After react 18 update, the tab node may not yet be rendered
by tabBar.jsx when we try to scroll it into view in Zotero_Tabs.select.
- To make sure scrolling happens when rendering is done, move scroll-related
logic into a useEffect of tabBar.jxs. It also makes sure that we'll scroll to
a selected tab if it is moved via context menu to the very beginning or the end.
- Added a small scroll-padding to tabs container to make sure the border
does not get cutoff after the tab is scrolled into view instead of
JS code accounting for the border.
- Fixed a glitch where the pinned library tab would not get selected
on shift-tab from opened tabs menu.
Fixes: #4382
* vpat 48: announce selection for default virt table
For simpler virtualized tables
(e.g. style manager in Zotero_Preferences.Cite), the table
does not get re-rendered when selection changes, so
aria-activedescendant does not get updated in render().
- a single function to update aria-activedescendant of the table
- call it in _updateTree of the tree selection because _onSelection
is not called the very first time a table is rendered. In that case, after
restart, collectionTree would have a selected row but no aria-activedescendant
- remove this.forceUpdate() from selection handlers of itemTree and
collectionTree because judging by the coment it's main purpose was to set
aria-activedescendant through render()
- set aria-activedescendant in _onSelection handler
of virtualized table.
- construct and set aria-label for rows build via
makeRowRenderer of VirtualizedTable so that is is
announced when the row is selected.
- remove earlier shift-Enter behavior that makes tag's
input multiline.
- shift-Enter will function just as Enter by saving the
tag and allowing focus to return to reader or itemTree.
- except after pasting multiple tags which will still turn
the tags input into a multiline field. Then, shift-enter
will add a new line, just as with any other multiline
editable-text.
- focus will always enter the tagsBox popup opened from the reader
- escape from within the popup with tagsBox will close the popup (vpat
67)
- one should not be able to collapse the tagsBox. Added `collapsible`
getter and setters to the collapsible panel to prevent the section
from changing its open status. This may be also used in other cases,
such as to prevent itemBox from being collapsed in duplicates mode.
- patched a glitch where tab from the last empty tab input would loose
focus.
- changed the `menupopup` for `panel` to display the `tagsbox` because
`menupopup` has implicit `role="menu"` which is not meant to contain
inputs, so voiceover completely looses cursor when inputs are focused
inside of the popup. Also, tweaked spacing a bit to avoid the
focus-ring getting cutoff.
Addresses: #4222Fixes: #4230Fixes: #4226
Addresses: #4388
As opposed to 'change' event.
Because if the field is editted and another window is focused
while the cursor is in the field, the change event will be
swallowed and when the field finally looses focus, it will not
be saved.
This may address the reported issue of edits not being saved in
title and abstract fields.
Addresses: #4388
- display the first continuous span of emojis in the primary cell of
the itemTree for non-colored tags.
- the emojis appear after the colored tags' circles (if any)
- to keep things consistent with itemTree, sort tags in the tagsBox in
the following order: colored tags first sorted by their position,
emoji tags after sorted alphabetically, followed by remaining tags sorted
alphabetically.
By moving the setAutoAttachmentTitle() calls to importFromFile() /
_addToDB().
Also:
- Chop off file extension when setting the parent's title based on the
filename in Create Parent Item -> Manual Entry.
- Fix Manual Entry not renaming the attachment correctly by awaiting
createEmptyParent().
When tabs' state is updated, refresh library tab's icon.
Do not skip it if the icon already exists (as for reader tabs).
Otherwise, when selected row from collectionTree changes,
the icons in the library tab will not update.
Fixes: #4385
- remove padding between the <dialog> and the window edges
- explicit width for all zoterosearch fields because otherwise
a menulist with a long content (e.g. longer collection name) name
can push the + and - buttons outside of the window
Fixes: #4374
- properly determine between which two bubbles a click landed
- set input direction
- delete the bubble on the left of the cursor
- in rtl, use selectionStart as the expected end of the input
and selectionEnd as the start. It fixes the issue of the
cursor getting stuck at the end of the input, as well as
fixes the Home/End not working from the right end.
- fix spacing issues for item descriptions in both layouts
Fixes: #4371
* Multiple accessiblity fixes
* Increase font size
* Nicer layout of the welcome screen
* Fix description in the welcome screen
* Add stripes to the table in citations matching screen
* Change icons for accept and resolve manually buttons
React 18 introduced automatic batching which tries to avoid unnecessary
re-rendering (https://react.dev/blog/2022/03/08/react-18-upgrade-guide#automatic-batching).
In some components based on react-virtualized (e.g. tag selector),
it leads to visible lagginess on scroll via keypress or
mouse wheel (not trackpad). This patch wraps setState of the scroll handler
of react-virtualized with ReactDOM.flushSync, which opts out
of automatic batching.
Fixes: #4368
- Wait for the itemsView to be initialized in the onload listener of the
Advanced Search window
- moved waitForTagSelector in a few tests to avoid it resolving too
early. For some tests these tweaks are always required, for others -
tests would pass half the time. Again, not clear why it's necessary,
potentially some flakiness from react 18?
- getDOMElement relied on React.renderToStaticMarkup,
which is react 18 was moved to a different file than the
one exposed with react-dom-server. To not add another
file just for that one function, replace getDOMElement
with getCSSIcon.
- getDOMElement was mainly used for a few remaining
png icons that were not replaced with svg. For those
few icons, just record which background-url should be
set when the module loads and add it in getCSSIcon if
applicable. Alternatively, background-image setting
could be moved into a stylesheet?
- a few hardcoded twisty svgs in icons.jsx are not used anywhere
(they would be fetched via IconTwisty), so those are
removed
- await for promise that is resolved in ref attribute
of root.render() as an alternative for removed callback
from ReactDOM.render
- await-ing for promise every time when ref needs to be
used after render (e.g. tag selector container), otherwise
ref will be undefined
- additional window.sizeToContent calls to properly size
dialogs with react-rendered content (e.g. create parent),
otherwise the window can cut off some of the content.
