Skip to content

Fix refocusing the selected node after a rerender.#1264

Merged
dpvc merged 3 commits intodevelopfrom
fix/explorer-refocus
Jun 1, 2025
Merged

Fix refocusing the selected node after a rerender.#1264
dpvc merged 3 commits intodevelopfrom
fix/explorer-refocus

Conversation

@dpvc
Copy link
Copy Markdown
Member

@dpvc dpvc commented May 31, 2025

This PR fixes a number of issues with refocusing the explorer after a re-render action occurs. In particular, when a menu action required a re-render (like when the speech settings change), the focus would go to the whole expression rather than the previously selected node. Moreover, because the speech isn't added until after a delay when the new expressions are rendered, and the focused element was in an old expression, when that is removed, the focus reverts to the last focused item (or the whole page), and so some screen readers would announce that previous item or the page itself before the new expression gets its speech and refocuses on the sub-expression again. For screen readers with separate focus/browse modes, it might also switch between modes (and announce that) in between as well, depending on the mode of the previously focused item.

This is fixed by adding a temporary item to the page that is used to hold the focus while the math is re-rendered. It has the same role as the mjx-speech items, and so the focus mode is retained. It has an aria label that contains the "none" content, so nothing is spoken when it is focused. When the re-rendering is complete, the temporary item is removed. This makes the transition between old and re-rendered expressions operate smoothly.

The previous handling of maction elements did get the refocusing correct, but could suffer from the focus/browse mode issues, and announcing of another element during the re-rendering, and so it now uses this same work-around to make the transition.

One other issue that is fixed here is that if an maction from the collapsible math extension is focused and the menu is used to select an item that does a page re-render, the refocusing went to the full expression. This is because the maction elements end up getting new id attributes, to the semanticFocus() value is looking for the wrong element after the re-render. This issue is fixed here by having the ComplexityMathItem save the initial id value and restart the numbering there, so the ids will remain the same after the re-render. That allows the proper sub-expression to be focused after the re-rendering.

The explorer's state() function now stops the explorers (so the regions are removed) when the state is set to before when the explorer was inserted. The explorers aren't actually removed, however (technically they should be). They are reattached if the page is re-rendered.

Some changes are made to the magnifier region to prevent the border outline (from the mjx-selected CSS) and to move the background color to the inner div so that the color covers the complete magnifier region (rather than having a white border on top and bottom). Some changes in the menu code fix a problem with turning on the hover highlighting when the complexity code needs to be loaded.

@dpvc dpvc requested a review from zorkow May 31, 2025 14:25
@dpvc dpvc added this to the v4.0 milestone May 31, 2025
Copy link
Copy Markdown
Member

@zorkow zorkow left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

One comment.
Otherwise lgtm.

Comment thread ts/a11y/explorer.ts Outdated
@dpvc dpvc merged commit 988e6e3 into develop Jun 1, 2025
@dpvc dpvc deleted the fix/explorer-refocus branch June 1, 2025 11:48
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants