Skip to content

[ButtonBase] Fix memory leak when ripple is disabled - #49165

Open
Dextheking1 wants to merge 1 commit into
mui:masterfrom
Dextheking1:fix/buttonbase-disable-ripple-leak
Open

Dextheking1 wants to merge 1 commit into
mui:masterfrom
Dextheking1:fix/buttonbase-disable-ripple-leak

Conversation

@Dextheking1

Copy link
Copy Markdown

Summary

Fixes #48999.

Problem

ButtonBase skips rendering TouchRipple when disableRipple is set, but its event handlers still call LazyRipple.start/stop/pulsate. Each of those calls invokes LazyRipple.mount(), which creates a promise that only resolves after TouchRipple mounts. Since the component never mounts when ripples are disabled, the promises never settle and retain the event object (including its relatedTarget DOM tree) forever — a memory leak on every interaction.

Fix

Skip ripple actions entirely when ripples are disabled:

  • keyboard focus-ripple handlers are now also gated on !disableRipple,
  • useRippleHandler calls for mouse/touch events pass disableTouchRipple || disableRipple,
  • the blur ripple action is disabled via disableRipple.

Test

Added a regression test (does not queue ripple actions that would never settle when disableRipple is set) that fires 8 mouse/touch/blur/context interactions on <ButtonBase disableRipple> and asserts LazyRipple.prototype.mount is never called. It fails without the fix (expected 8 to equal +0) and passes with it.

Full ButtonBase suite: 43 passed, 50 skipped. Prettier and ESLint clean.

@code-infra-dashboard

Copy link
Copy Markdown

Deploy preview

https://deploy-preview-49165--material-ui.netlify.app/
QR code for https://deploy-preview-49165--material-ui.netlify.app/

Bundle size

Bundle Parsed size Gzip size
@mui/material 🔺+31B(+0.01%) 🔺+4B(0.00%)
@mui/lab 0B(0.00%) 0B(0.00%)
@mui/private-theming 0B(0.00%) 0B(0.00%)
@mui/system 0B(0.00%) 0B(0.00%)
@mui/utils 0B(0.00%) 0B(0.00%)

Details of bundle changes


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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[material-ui][ButtonBase] Every interaction on a disableRipple button permanently leaks its event object (LazyRipple mounted promise never settles)

1 participant