[tooltip] Improve support for disabled button triggers by mayank99 · Pull Request #48622 · mui/material-ui

mayank99 · 2026-06-04T17:36:56Z

Main changes

This PR removes the warning that is triggered when Tooltip is used on a <button disabled> element. This warning is unnecessary in 2026 and encourages bad patterns. See #33182 (comment) for longer explanation.

Additionally, 5a10fee removes the disabled guard from #48606 and replaces it with better handling of disabled button triggers.

Documentation

The "Disabled elements" section of the Tooltip docs has been reworked to remove the wrapper <span> recommendation.

The default pointer-events: none needs to be undone from Buttons (see related section in Button docs). I believe this should be addressed within ButtonBase in a separate PR.
Keyboard accessibility (or lack thereof) is mentioned as a warning. This should be updated to recommend the focusableWhenDisabled prop (when available).

I have followed (at least) the PR section of the contributing guide.

Signed-off-by: Mayank <9084735+mayank99@users.noreply.github.com>

code-infra-dashboard · 2026-06-04T17:40:03Z

Deploy preview

docs/data/material/components/tooltips/tooltips.md

Bundle size

Bundle	Parsed size	Gzip size
@mui/material	🔺+212B^(+0.04%)	🔺+79B^(+0.05%)
@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.

Signed-off-by: Mayank <9084735+mayank99@users.noreply.github.com>

mj12albert

Thanks for the PR @mayank99

I added a commit with some runtime changes needed to handle some edge cases

Would you mind moving the changes from #48623 to this PR as well? I think it's better to have the docs updates directly here

mj12albert · 2026-06-04T23:00:11Z

-    if (childNode?.disabled) {
-      return;
-    }


This needed to be removed as well in addition to the warning

Thank you! I also found this when testing #48623 (comment)

mj12albert · 2026-06-04T23:06:29Z

Sign in to view

+      // However, if the trigger became disabled while the tooltip was already open,
+      // stray mouseover events must not cancel the pending close.


I added the openedByDisabledTriggerRef in order to not affect the existing "tooltip trigger becomes disabled while tooltip is open" case

mayank99 · 2026-06-04T23:27:12Z

Would you mind moving the changes from #48623 to this PR as well? I think it's better to have the docs updates directly here

Done in fe719f8. Originally I was trying to limit the scope, but it makes sense to update it together since this is now tackling disabled button triggers more broadly.

silviuaavram · 2026-06-05T06:26:43Z

+    await user.unhover(button);
+    await user.hover(screen.getByRole('tooltip'));
+    await act(async () => {
+      await new Promise((resolve) => {
+        setTimeout(resolve, 600);
+      });
+    });


shouldn't the flow be: unhover button, wait for some time not enough for the tooltip to disappear, hover the tooltip, then check?

@mj12albert Since you wrote this test, would you be able to help with this?

Edit: Addressed in 1ef6079.

mj12albert · 2026-06-17T14:39:54Z

Demo of various disabled triggers with/without the span: https://stackblitz.com/edit/vocsyu4p?file=src%2FDemo.tsx

The only thing is that <Button disabled style={{ pointerEvents: 'auto' }}> is kind of a temporary API until focusableWhenDisabled is supported.

I tested the changes here in #48613 and didn't encounter any issues, the remaining thing is to decide how we're gonna do a focus ring (component level or theme level)

CC @siriwatknp @silviuaavram

mayank99 · 2026-06-17T19:31:15Z

The only thing is that <Button disabled style={{ pointerEvents: 'auto' }}> is kind of a temporary API until focusableWhenDisabled is supported.

One important thing I wanted to highlight: the pointer-events: auto style is only necessary to undo the pointer-events: none added by ButtonBase.

The Tooltip component could also be used with other types of (third-party) components that render a regular <button disabled> (or <button aria-disabled="true">), similar to case 3 in your demo. The changes in this PR make it properly compatible with all of those patterns, independently of focusableWhenDisabled.

siriwatknp · 2026-06-18T01:48:05Z

the remaining thing is to decide how we're gonna do a focus ring

Do you mean for this PR or for completeness of the effort?

siriwatknp

I propose to not updating docs in this PR and treat this PR to target native <button disabled> instead (only the Tooltip and the test).
Tackle ButtonBase in #48613 instead.

remove Tooltip warning about disabled buttons

cb7a270

Signed-off-by: Mayank <9084735+mayank99@users.noreply.github.com>

mayank99 changed the title ~~remove Tooltip warning about disabled buttons~~ [Tooltip] remove warning about disabled buttons Jun 4, 2026

update test

f30d046

Signed-off-by: Mayank <9084735+mayank99@users.noreply.github.com>

mayank99 mentioned this pull request Jun 4, 2026

[docs] update Tooltip "disabled elements" section #48623

Closed

1 task

zannager added the scope: tooltip Changes related to the tooltip. label Jun 4, 2026

zannager requested a review from ZeeshanTamboli June 4, 2026 18:27

mayank99 changed the title ~~[Tooltip] remove warning about disabled buttons~~ [tooltip] remove warning about disabled buttons Jun 4, 2026

mj12albert requested review from mnajdova and silviuaavram June 4, 2026 21:59

support disabled button triggers

5a10fee

mj12albert reviewed Jun 4, 2026

View reviewed changes

mj12albert changed the title ~~[tooltip] remove warning about disabled buttons~~ [tooltip] Improve support for disabled button triggers Jun 4, 2026

mj12albert and others added 2 commits June 5, 2026 07:18

fix ci

f57565b

update docs

fe719f8

silviuaavram reviewed Jun 5, 2026

View reviewed changes

mj12albert and others added 2 commits June 8, 2026 23:46

update test

1ef6079

Merge branch 'master' into mayank/tooltip-disabled-warning

06c5441

mayank99 requested a review from silviuaavram June 15, 2026 16:25

mj12albert requested a review from siriwatknp June 17, 2026 13:38

siriwatknp requested changes Jun 18, 2026

View reviewed changes

		// However, if the trigger became disabled while the tooltip was already open,
		// stray mouseover events must not cancel the pending close.

Uh oh!

Conversation

mayank99 commented Jun 4, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Main changes

Documentation

Uh oh!

code-infra-dashboard Bot commented Jun 4, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Deploy preview

Bundle size

Uh oh!

mj12albert left a comment

Choose a reason for hiding this comment

Uh oh!

mj12albert Jun 4, 2026

Choose a reason for hiding this comment

Uh oh!

mayank99 Jun 4, 2026

Choose a reason for hiding this comment

Uh oh!

mj12albert Jun 4, 2026

Choose a reason for hiding this comment

Uh oh!

This comment was marked as resolved.

Uh oh!

mayank99 commented Jun 4, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

silviuaavram Jun 5, 2026

Choose a reason for hiding this comment

Uh oh!

mayank99 Jun 8, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

mj12albert commented Jun 17, 2026

Uh oh!

mayank99 commented Jun 17, 2026

Uh oh!

siriwatknp commented Jun 18, 2026

Uh oh!

siriwatknp left a comment • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

mayank99 commented Jun 4, 2026 •

edited

Loading

code-infra-dashboard Bot commented Jun 4, 2026 •

edited

Loading

mayank99 commented Jun 4, 2026 •

edited

Loading

mayank99 Jun 8, 2026 •

edited

Loading

siriwatknp left a comment •

edited

Loading