smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: Flush pending DOM updates before .focus() (#8901)

Browse source
This commit is contained in:
Marcel Mraz 2024-12-09 22:57:37 +02:00 • committed by GitHub
parent b5652b8e36
commit 8a1152ce36
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
1 changed files with 17 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

19
packages/excalidraw/components/ConfirmDialog.tsx
View file

@ -1,3 +1,4 @@
import { flushSync } from "react-dom";
import { t } from "../i18n"; import { t } from "../i18n";
import type { DialogProps } from "./Dialog"; import type { DialogProps } from "./Dialog";
import { Dialog } from "./Dialog"; import { Dialog } from "./Dialog";
@ -43,7 +44,14 @@ const ConfirmDialog = (props: Props) => {
onClick={() => { onClick={() => {
setAppState({ openMenu: null }); setAppState({ openMenu: null });
setIsLibraryMenuOpen(false); setIsLibraryMenuOpen(false);
onCancel(); // flush any pending updates synchronously,
// otherwise it could lead to crash in some chromium versions (131.0.6778.86),
// when `.focus` is invoked with container in some intermediate state
// (container seems mounted in DOM, but focus still causes a crash)
flushSync(() => {
onCancel();
});
container?.focus(); container?.focus();
}} }}
/> />
@ -52,7 +60,14 @@ const ConfirmDialog = (props: Props) => {
onClick={() => { onClick={() => {
setAppState({ openMenu: null }); setAppState({ openMenu: null });
setIsLibraryMenuOpen(false); setIsLibraryMenuOpen(false);
onConfirm(); // flush any pending updates synchronously,
// otherwise it leads to crash in some chromium versions (131.0.6778.86),
// when `.focus` is invoked with container in some intermediate state
// (container seems mounted in DOM, but focus still causes a crash)
flushSync(() => {
onConfirm();
});
container?.focus(); container?.focus();
}} }}
actionType="danger" actionType="danger"