-
Notifications
You must be signed in to change notification settings - Fork 6.7k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
bug(TOOLTIP): Tooltip hide animation appears even if show delay not reached #24614
Comments
… not visible tooltip Fixes a bug in Angular Material `tooltip` when `mat-tooltip-hide` class trigger animation for not visible tooltip. Fixes angular#24614
… not visible tooltip Fixes a bug in Angular Material `tooltip` when `mat-tooltip-hide` class trigger animation for not visible tooltip. Fixes angular#24614
Any update on this? |
… not visible tooltip Fixes a bug in Angular Material `tooltip` when `mat-tooltip-hide` class trigger animation for not visible tooltip. Fixes angular#24614
… not visible tooltip Fixes a bug in Angular Material `tooltip` when `mat-tooltip-hide` class trigger animation for not visible tooltip. Fixes angular#24614
guys, please fix it. |
Hello Angular Team! |
this silly thing is blocking us from upgrading material and angular to 14.x. we are stuck with 13.2.4 :( |
RIP mat tooltip |
Temporary fix - add this to main style file: |
14.1.0 - the same issue! |
I've subscribed to the topic as I want to know when this gets fixed |
for now, this works for sure. thanks |
Problem still happens in version 14.2.0 |
…ed (#25699) After the tooltips were switched to CSS animations, a regression was introduced where the opposite animation is shown even if the tooltip didn't actually reach its target state. These changes are an alternate take on the fix from #24652 which had to be reverted due to internal failures. Fixes #24614.
…ed (angular#25699) After the tooltips were switched to CSS animations, a regression was introduced where the opposite animation is shown even if the tooltip didn't actually reach its target state. These changes are an alternate take on the fix from angular#24652 which had to be reverted due to internal failures. Fixes angular#24614.
…ed (#25699) (#25701) After the tooltips were switched to CSS animations, a regression was introduced where the opposite animation is shown even if the tooltip didn't actually reach its target state. These changes are an alternate take on the fix from #24652 which had to be reverted due to internal failures. Fixes #24614.
14.2.3 - The problem is not solved! Regression appears when the pointer moves in the vertical direction. |
I don't see the issue in the docs site anymore. Are you sure that you're testing the latest code? |
I still see the issue on the docs site. Here is a clip https://www.loom.com/share/314c84833a29481cae77a3d3c3c51e30 |
Okay, I see. The cases I was testing for was when there's no enter delay and a hide delay, and the opposite way around. |
Are the examples on the docs website actually using the corresponding version in the code? Just asking because FWIW in my project I don't see the issue anymore after updating to 14.2.3 . |
It seems that the problem appears when the mouse pointer moves from top to down only. In other directions I don't see this regression. At least in my component with mat-table. |
With default tooltip options I found problem that tooltip is appearing immediately without any delay however I am using below tooltip options I don't see problems in my project. export const DesignerTooltipDefaults: MatTooltipDefaultOptions = { |
…hrough tooltip We ignore `mouseleave` events that go into the tooltip which meant that some animations weren't being cancelled correctly after the fix in angular#25699. These changes resolve the issue by skipping all animations if the tooltip isn't fully shown yet. Fixes angular#24614.
…hrough tooltip (#25740) We ignore `mouseleave` events that go into the tooltip which meant that some animations weren't being cancelled correctly after the fix in #25699. These changes resolve the issue by skipping all animations if the tooltip isn't fully shown yet. Fixes #24614. (cherry picked from commit 6526277)
This is working as expected. As of a few versions ago, we stopped closing the tooltip by default when the user hovers over it. You can turn it off using the |
Tooltip interactivity makes sense if showDelay time has reached and I left. But the issue is that showDelay time has not reached, so the tooltip should not be shown regardless where I move the mouse. |
Either way, that would be a different issue from this one. Currently "interactivity" is considered as soon as the pointer enters the tooltip trigger. |
Thanks for response, disableTooltipInteractivity makes the trick for me now, I will make issue later. |
fix tooltip bug angular/components#24614 fix sharedRoom not emitted (modals not open) fix back to rooms button
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
Is this a regression?
The previous version in which this bug was not present was
13.2.4
Description
When using ShowDelay>0, and the cursor doesn't stay long enough to display the tooltip, when leaving the trigger element, the tooltip suddently appears and immediately starts the hide fade out animation.
Very disturbing when switching between multiple trigger elements (buttons for instance) with tooltips because if you move quickly over them, they all display the tooltip fade out animation
NB:
I'm also using "disableTooltipInteractivity=true" to remove the "blocked by tooltip" side effect started from 13.2.5
Reproduction
Steps to reproduce:
<span matTooltip="The phantom tooltip" matTooltipShowDelay="2000">hello, i have a tooltip. Move quickly over me</span>
Expected Behavior
The tooltip should'nt be shown at all because the showDelay was not reached
Actual Behavior
The hide animation plays, making the tooltip briefly appearing
Environment
The text was updated successfully, but these errors were encountered: