From a8d006671c97219307db340b506bbf160f240537 Mon Sep 17 00:00:00 2001 From: nad767 Date: Thu, 12 Mar 2026 08:30:24 +0200 Subject: [PATCH] [react-dom] Fix non-popover ignoring inline toggle events Fixes a bug with native `` elements ignoring event handlers provided in `onBeforeToggle` and `onToggle` props, unless they also happen to have the `popover` attribute. Per MDN, the two abovementioned events should fire for `` elements regardless of whether they are `popover`s or not,[^1] and indeed, calling `someNonPopoverDialogRef.current.addEventListener('beforetoggle'|'toggle', someCallback)` does in fact work (tested in Chrome 146). [^1]: See https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/beforetoggle_event and https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/toggle_event. --- packages/react-dom-bindings/src/client/ReactDOMComponent.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/react-dom-bindings/src/client/ReactDOMComponent.js b/packages/react-dom-bindings/src/client/ReactDOMComponent.js index 1b25e37270..bb92b2edc8 100644 --- a/packages/react-dom-bindings/src/client/ReactDOMComponent.js +++ b/packages/react-dom-bindings/src/client/ReactDOMComponent.js @@ -3113,6 +3113,8 @@ export function hydrateProperties( // TODO: Make sure that we check isMounted before firing any of these events. switch (tag) { case 'dialog': + listenToNonDelegatedEvent('beforetoggle', domElement); + listenToNonDelegatedEvent('toggle', domElement); listenToNonDelegatedEvent('cancel', domElement); listenToNonDelegatedEvent('close', domElement); break;