question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[Tooltip] Change `disableInteractive` default value

See original GitHub issue

Duplicates

  • I have searched the existing issues

Latest version

  • I have tested the latest version

Current behavior 😯

After a tooltip is shown, moving the mouse cursor over the tooltip keeps it open indefinitely. It is hidden only when the mouse cursor is moved outside it.

msedge_2022-01-28_12-39-44

Expected behavior 🤔

The tooltip should close as soon as the mouse moves outside the main element. This is illustrated in the Material Design guidelines: Also, the statement “Continuously display the tooltip as long as the user long-presses or hovers over the element.” implies that when this is no longer the case the tooltip should disappear.

See other Material Design implementations for comparison, e.g. Vue/Quasar), does it correctly:

msedge_2022-01-28_12-41-54

Steps to reproduce 🕹

To reproduce:

  1. Go to the built-in example).
  2. Move the mouse cursor over the IconButton: The tooltip is shown.
  3. Move the mouse cursor outside the IconButton and over the tooltip. The tooltip is still shown. It is hidden only when the mouse cursor is moved outside it.

Context 🔦

Any context / all uses.

Your environment 🌎

`npx @mui/envinfo` ``` Browser: MS Edge v. 97.0.1072.69, 64 bits System: OS: Windows 10 10.0.19042 Binaries: Node: 14.15.0 - C:\Program Files\nodejs\node.EXE Yarn: Not Found npm: 6.14.8 - C:\Program Files\nodejs\npm.CMD Browsers: Chrome: 97.0.4692.99 Edge: Spartan (44.19041.1266.0), Chromium (97.0.1072.69) npmPackages: @emotion/react: ^11.7.1 => 11.7.1 @emotion/styled: ^11.6.0 => 11.6.0 @mui/base: 5.0.0-alpha.66 @mui/material: ^5.3.1 => 5.3.1 @mui/private-theming: 5.3.0 @mui/styled-engine: 5.3.0 @mui/system: 5.3.0 @mui/types: 7.1.0 @mui/utils: 5.3.0 @types/react: ^17.0.38 => 17.0.38 react: ^17.0.2 => 17.0.2 react-dom: ^17.0.2 => 17.0.2 ```

Issue Analytics

  • State:open
  • Created 2 years ago
  • Reactions:3
  • Comments:14 (7 by maintainers)

github_iconTop GitHub Comments

2reactions
leosdadcommented, Jan 31, 2022

Hi, OP here. Thanks all for the responses and the workaround, although I can’t test anything because I’m on vacation now. I’ll comment further when I’m back. Cheers

1reaction
eps1loncommented, Feb 1, 2022

@ggascoigne As far as I can tell, this issue is about interactive/disableInteractive which isn’t related to the accessible name/accessible description. So if there’s an issue with describeChild, I would recommend opening a separate issue.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Tooltips - Bootstrap
Tooltips for .disabled or disabled elements must be triggered on a wrapper ... The tooltip plugin generates content and markup on demand, and...
Read more >
How to enable Bootstrap tooltip on disabled button
By default tooltips is initialized by selecting the specified element and call the tooltip() method using jQuery. · To position the tooltip data- ......
Read more >
How to enable Bootstrap tooltip on disabled button?
Disabled elements Elements with the disabled attribute aren't interactive, meaning users cannot focus, hover, or click them to trigger a tooltip ...
Read more >
Solved: Remove default tooltip - Microsoft Power BI Community
Solved: Hello All, I have added tooltip fields fo the visual/graph. But when I hover on the stack of bars, it showing me...
Read more >
Tooltip - Chart.js
To change the overrides for those chart types, the options are defined in Chart.overrides[type].plugins.tooltip . Name, Type, Default ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found