Fix roving tab index crash compareDocumentPosition (#12594)

* Fix roving tab index crash `compareDocumentPosition`

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2024-06-11 10:11:52 +01:00 committed by GitHub
parent 3e7511cc5d
commit 930b4e2424
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 7 additions and 10 deletions

View file

@ -18,7 +18,7 @@ import React, {
createContext,
useCallback,
useContext,
useLayoutEffect,
useEffect,
useMemo,
useRef,
useReducer,
@ -144,7 +144,7 @@ export const reducer: Reducer<IState, Action> = (state: IState, action: Action)
}
if (document.activeElement === document.body) {
// if the focus got reverted to the body then the user was likely focused on the unmounted element
state.activeRef?.current?.focus();
setTimeout(() => state.activeRef?.current?.focus(), 0);
}
}
@ -362,7 +362,7 @@ export const useRovingTabIndex = <T extends HTMLElement>(
}
// setup (after refs)
useLayoutEffect(() => {
useEffect(() => {
context.dispatch({
type: Type.Register,
payload: { ref },

View file

@ -33,10 +33,7 @@ const Button = (props: HTMLAttributes<HTMLButtonElement>) => {
};
const checkTabIndexes = (buttons: NodeListOf<HTMLElement>, expectations: number[]) => {
expect(buttons.length).toBe(expectations.length);
for (let i = 0; i < buttons.length; i++) {
expect(buttons[i].tabIndex).toBe(expectations[i]);
}
expect([...buttons].map((b) => b.tabIndex)).toStrictEqual(expectations);
};
// give the buttons keys for the fibre reconciler to not treat them all as the same

View file

@ -15,7 +15,7 @@ limitations under the License.
*/
import React, { createRef } from "react";
import { render } from "@testing-library/react";
import { render, waitFor } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import EmojiPicker from "../../../../src/components/views/emojipicker/EmojiPicker";
@ -24,7 +24,7 @@ import { stubClient } from "../../../test-utils";
describe("EmojiPicker", function () {
stubClient();
it("should not mangle default order after filtering", () => {
it("should not mangle default order after filtering", async () => {
const ref = createRef<EmojiPicker>();
const { container } = render(
<EmojiPicker ref={ref} onChoose={(str: string) => false} onFinished={jest.fn()} />,
@ -41,7 +41,7 @@ describe("EmojiPicker", function () {
// Clear the filter and assert that the HTML matches what it was before filtering
//@ts-ignore private access
ref.current!.onChangeFilter("");
expect(beforeHtml).toEqual(container.innerHTML);
await waitFor(() => expect(beforeHtml).toEqual(container.innerHTML));
});
it("sort emojis by shortcode and size", function () {