[tooltip] Downgrade disabled error to a warning

[grantdiamond]

Summary 💡

I get the following error when I have a disabled button nested in a tooltip:

You are providing a disabled `button` child to the Tooltip component.
A disabled element does not fire events.
Tooltip needs to listen to the child element's events to display the title.

This is the behavior I want - for the tooltip to be disabled while the button is disabled.

Can we downgrade this from an error to a warning? An ideal solution would be to add a disabled prop to the tooltip component that passes down.

Examples 🌈

No response

Motivation 🔦

No response

[siriwatknp]

Agree, a warning sounds better for this. cc @mui/core

[Nefcanto]

Also could you please tell us which Tooltip?

We have more than 40 Tooltips in our app and this is what we see:

How are we supposed to find out which Tooltip is causing this error/warning?

[DiegoAndai]

@Nefcanto thanks for reaching out and sorry for the delay.

I'll add the waiting for 👍🏼 label so the community can vote for this new feature. If you want to see this implemented, please add a 👍🏼 reaction to the issue's description. I'll also add the ready to take label in case anyone wants to work on this before the team gets to it. Please reach out if you're interested, I'll gladly guide you.

[yash49]

Hi @DiegoAndai
Can you please tell me what needs to be done here?
Replace console.error with console.warn?

[yash49]

Hey @DiegoAndai @siriwatknp
I've raised a PR #44846
Can you please review it

[github-actions]

This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue.
Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

Note

@grantdiamond How did we do? Your experience with our support team matters to us. If you have a moment, please share your thoughts in this short Support Satisfaction survey.

[oliviertassinari]

Under #21979, I guess error -> warn make sense.

An ideal solution would be to add a disabled prop to the tooltip component that passes down.

@grantdiamond You are expected to set <Tooltip title={disabled ? '' : message} in this case. At least, it's the DX of the component that was designed to support your use case.