element-hq / element-web

A glossy Matrix collaboration client for the web.
https://element.io
GNU Affero General Public License v3.0
11.25k stars 2.01k forks source link

Fix React 18 strict mode breaking spotlight dialog #28452

Closed MidhunSureshR closed 1 week ago

MidhunSureshR commented 1 week ago

Fixes https://github.com/element-hq/element-web/issues/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.