Material: tooltip: does not disappear after click and hover

[floreks]

Actual Behavior:

• What is the issue? * After hovering over the button and clicking on it, then moving mouse off the button and hovering again tooltip appears but does not disappear when mouse leaves button area.
• What is the expected behavior? Tooltip should disappear.

CodePen (or steps to reproduce the issue): *

• CodePen Demo which shows your issue: https://codepen.io/floreks/pen/KWGbdj
• Details: Step by step explanation
  
  
  
  1. Hover over the button and click on it
  
  
  2. Move mouse out of the button area
  
  
  3. Hover over the button again (tooltip appears)
  
  
  4. Move mouse out of the button area (tooltip does not disappear)
     
     Tooltip only disappears if you click on area outside of the button (button loses focus).
  
  

AngularJS Versions: *

• AngularJS Version: 1.6.2
• AngularJS Material Version: 1.1.3

[maciaszczykm]

Friendly ping.

[maciaszczykm]

Friendly ping.

[Wsiegenthaler]

This could be because the button has focus. The tooltip stays visible when the button is focused regardless of whether the mouse has left the button. Add md-autohide to the md-tooltip element to force it to disappear.

https://codepen.io/anon/pen/prMpeR

[floreks]

Nice tip. We'll check that. Thanks.

[Splaktar]

As mentioned by Wsiegenthaler, you can use md-autohide as mentioned in the docs:

If present or provided with a boolean value, the tooltip will hide on mouse leave, regardless of focus.