diff --git a/packages/excalidraw/components/ConfirmDialog.tsx b/packages/excalidraw/components/ConfirmDialog.tsx index 2bda72e2c00e..637f0659a808 100644 --- a/packages/excalidraw/components/ConfirmDialog.tsx +++ b/packages/excalidraw/components/ConfirmDialog.tsx @@ -1,3 +1,4 @@ +import { flushSync } from "react-dom"; import { t } from "../i18n"; import type { DialogProps } from "./Dialog"; import { Dialog } from "./Dialog"; @@ -43,7 +44,14 @@ const ConfirmDialog = (props: Props) => { onClick={() => { setAppState({ openMenu: null }); 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(); }} /> @@ -52,7 +60,14 @@ const ConfirmDialog = (props: Props) => { onClick={() => { setAppState({ openMenu: null }); 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(); }} actionType="danger"