Skip to content

[popups] Fix onOpenChangeComplete(true) timing#3558

Merged
atomiks merged 2 commits into
mui:masterfrom
atomiks:fix/openchangecomplete-aborted
Dec 17, 2025
Merged

[popups] Fix onOpenChangeComplete(true) timing#3558
atomiks merged 2 commits into
mui:masterfrom
atomiks:fix/openchangecomplete-aborted

Conversation

@atomiks

@atomiks atomiks commented Dec 16, 2025

Copy link
Copy Markdown
Contributor

Fixes #3555

After the change to remove ReactDOM.flushSync(...) in #3424, onOpenChangeComplete(true) would sometimes incorrectly fire immediately without waiting for the animation to finish. That's because the double rAF wasn't enough sometimes for [data-starting-style] to have been removed. This changes it to a MutationObserver that will wait for the attr to be removed before calling element.getAnimations(). Also refactors useOpenChangeComplete to use the AbortController.

Original issue: https://stackblitz.com/edit/rtmdhqzj-4tjxwtcd

@atomiks atomiks added type: bug It doesn't behave as expected. scope: all components Widespread work has an impact on almost all components. labels Dec 16, 2025
@pkg-pr-new

pkg-pr-new Bot commented Dec 16, 2025

Copy link
Copy Markdown
  • vite-css-base-ui-example

    pnpm add https://pkg.pr.new/mui/base-ui/@base-ui/react@3558
    
    pnpm add https://pkg.pr.new/mui/base-ui/@base-ui/utils@3558
    

commit: 56f65b4

@mui-bot

mui-bot commented Dec 16, 2025

Copy link
Copy Markdown

Bundle size report

Bundle Parsed size Gzip size
@base-ui/react 🔺+310B(+0.08%) 🔺+77B(+0.06%)

Details of bundle changes


Check out the code infra dashboard for more information about this PR.

@netlify

netlify Bot commented Dec 16, 2025

Copy link
Copy Markdown

Deploy Preview for base-ui ready!

Name Link
🔨 Latest commit 56f65b4
🔍 Latest deploy log https://app.netlify.com/projects/base-ui/deploys/694331848add4700089686a9
😎 Deploy Preview https://deploy-preview-3558--base-ui.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@atomiks atomiks force-pushed the fix/openchangecomplete-aborted branch from ea5feae to 8a9b61d Compare December 16, 2025 09:09
@atomiks atomiks changed the title [popups] Ignore aborted animations in onOpenChangeComplete [popups] Fix onOpenChangeComplete(true) timing Dec 16, 2025
@atomiks atomiks marked this pull request as ready for review December 16, 2025 09:15
@atomiks atomiks force-pushed the fix/openchangecomplete-aborted branch from 8a9b61d to f70ad55 Compare December 16, 2025 09:17

@LukasTy LukasTy left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Works nicely, GJ. 👌

@atomiks atomiks force-pushed the fix/openchangecomplete-aborted branch from 9a6db31 to 02a2bda Compare December 17, 2025 22:25
@atomiks atomiks force-pushed the fix/openchangecomplete-aborted branch from 02a2bda to 56f65b4 Compare December 17, 2025 22:41
@atomiks atomiks merged commit 7f1c298 into mui:master Dec 17, 2025
23 checks passed
@atomiks atomiks deleted the fix/openchangecomplete-aborted branch December 17, 2025 23:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

scope: all components Widespread work has an impact on almost all components. type: bug It doesn't behave as expected.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[dialog] onOpenChangeComplete is triggered when dialog is dismissed through an outside click during enter transition.

3 participants