Skip to content

Fix React 18 strict mode breaking spotlight dialog - #28452

Merged
t3chguy merged 10 commits into
developfrom
midhun/fix-spotlight-1
Nov 13, 2024
Merged

t3chguy merged 10 commits into
developfrom
midhun/fix-spotlight-1

Conversation

@MidhunSureshR

@MidhunSureshR MidhunSureshR commented Nov 12, 2024 •

Copy link
Copy Markdown
Member

Fixes #28404

Previously RovingTabIndexProvider held an array of refs in state. Every time a new ref was added to the array, the entire array was sorted. With strict mode, refs/reducers/components/effects are all run twice. This lead to some refs being unset (i.e ref.current = null) just before sorting began.

This PR fixes the issue by refactoring the code so that we keep an array of DOM elements instead of refs.

This code originally held an array of refs. But these refs were unset
just before sorting leading to errors.

For the fix, I've used a callback ref to add/remove the DOM elements
to/from the array in state. This way there's nothing that could possibly
mutate just before sort.
Comment thread src/components/views/elements/Field.tsx Resolved
Comment thread src/components/views/elements/Field.tsx Resolved
Comment thread src/accessibility/RovingTabIndex.tsx Resolved
@t3chguy
t3chguy merged commit 18ef975 into develop Nov 13, 2024
@t3chguy
t3chguy deleted the midhun/fix-spotlight-1 branch November 13, 2024 15:54
SpiritCroc pushed a commit to SchildiChat/element-web that referenced this pull request Nov 25, 2024
This code originally held an array of refs. But these refs were unset
just before sorting leading to errors.

For the fix, I've used a callback ref to add/remove the DOM elements
to/from the array in state. This way there's nothing that could possibly
mutate just before sort.

SCHILDI NOTE:
- This is from element-hq#28452
- To be dropped in the next upstream rebase

This branch was successfully deployed

2 active deployments
EndToEndTests β€” ec96d33e Deployed Nov 13, 2024 by github-actions[bot]
Netlify β€” ec96d33e Deployed Nov 13, 2024 by github-actions[bot]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

search box closes when i am typing fast

2 participants