Tooltip never disappears after opening

[christophechevalier]

Bug, feature request, or proposal:

Bug with my dependencies may be.. or @angular/animations

What is the expected behavior?

Tooltip should disappear after the hideDelay

What is the current behavior?

Tooltip NOT disappear after the hideDelay

What are the steps to reproduce?

Same of material2 official doc
Providing a Plunker (or similar) is the best way to get the team to see your issue.

Works with this version.
Plunker template: http://plnkr.co/edit/pr4AFA06aURbMxYI77BK?p=preview

Not works with this dependencies :

What is the use-case or motivation for changing an existing behavior?

N/A

Which versions of Angular, Material, OS, browsers are affected?

`
...
"@angular/common": "4.0.0-rc.1",
"@angular/compiler": "4.0.0-rc.1",
"@angular/core": "4.0.0-rc.1",
"@angular/flex-layout": "2.0.0-rc.1",
"@angular/forms": "4.0.0-rc.1",
"@angular/http": "4.0.0-rc.1",
"@angular/material": "2.0.0-beta.2",
...
"@angular/cli": "1.0.0-rc.0",
"@angular/compiler-cli": "4.0.0-rc.1",
"typescript": "2.2.1"
...

`

Is there anything else we should know?

I post my problem here : https://gitter.im/angular/material2.

I imported @angular/animations.
But nothing change.
Is it necessary that I import it in my code or angular does it alone ?

Thanks.

[frankspin89]

Please make sure that you have included the animation package for angular core. You can find more information about implementing the animation package here https://github.com/angular/angular/blob/master/CHANGELOG.md#400-rc1-2017-02-24

[frankspin89]

Related: #3321

[victornoel]

@frankspin89 thanks, that works well! it's not obvious, you also need to add BrowserAnimationsModule too… (see http://stackoverflow.com/questions/42470364/using-angular-material-2-tabs-component-with-angular-4-0-0-rc-1/42471212#42471212).

[karlhaas]

I can't import BrowserAnimationsModule like import { BrowserAnimationsModule } from '@angular/platform-browser/typings/animations';

Error:

VM686:2 GET http://localhost:5555/node_modules/@angular/platform-browser/typings/animations.js 404 (Not Found)
(index):246 (SystemJS) XHR error (404 Not Found) loading http://localhost:5555/node_modules/@angular/platform-browser/typings/animations.js
	Error: XHR error (404 Not Found) loading http://localhost:5555/node_modules/@angular/platform-browser/typings/animations.js
	    at XMLHttpRequest.wrapFn [as _onreadystatechange] (http://localhost:5555/node_modules/zone.js/dist/zone.js?1488980193959:1190:29) [<root>]
	    at Zone.runTask (http://localhost:5555/node_modules/zone.js/dist/zone.js?1488980193959:166:47) [<root> => <root>]
	    at XMLHttpRequest.ZoneTask.invoke (http://localhost:5555/node_modules/zone.js/dist/zone.js?1488980193959:416:38) [<root>]
	Error loading http://localhost:5555/node_modules/@angular/platform-browser/typings/animations.js as "@angular/platform-browser/typings/animations" from http://localhost:5555/app/app.module.js Not expecting this error? Report it at https://github.com/mgechev/angular2-seed/issues

If BrowserAnimationsModule should be used, then it should be available via index.ts / public_api.ts ... right?

angular/angular#15005

[code-tree]

I can confirm tooltip gets stuck in IE/Edge and Safari, but works fine in Chrome and Firefox. I believe this is due to web-animations polyfill and I've reported it there. This issue actually crashes my app so I've had to blacklist IE/Edge and Safari from even loading the web-animations polyfill.

Reproduce by hovering in and out of button rapidly.

[karlhaas]

As also added to web-animations/web-animations-js#115 I think we got the same error:

[karlhaas]

Another strange fact is that

• with Angular v2 and Angular Material v2.0.0-beta.1 we had the same bug including the JavaScript error
• currently with Angular v2 and Angular Material v2.0.0-beta.2 the tooltips stuck and don't disappear but the app does not crash
• with Angular v4.0.1 and Angular Material v2.0.0-beta.1 the app crashes again so we can't upgrade Angular

[victornoel]

@karlhaas: I am using angular 4 and material 2 beta 2 and it's working great (as long as BrowserAnimationsModule is registered)

[karlhaas]

Without BrowserAnimationsModule animations won't work at all, right?
@victornoel in Safari with web-animations-js?

[victornoel]

@karlhaas ha, maybe not in this context, sorry :) I just tried with chromium

[HitomiTenshi]

I have the same issue when using IE11 or the latest Edge browser. I include web.animation.js to support animations.

When hovering over an element that has a tooltip multiple times in quick succession, the whole app crashes and following error occurs (as already mentioned above):

[karlhaas]

I just provided a PR to fix this in web-animations-js: web-animations/web-animations-js#118

[jelbourn]

Seems to be working fine in the latest version.

Be sure to check out the changelog for the latest release in regards to changes w/ animations.

[karlhaas]

@jelbourn still the same error with material v. 2.0.0-beta.3 in Safari. Fix is available for web-animations-js: web-animations/web-animations-js#118

[HitomiTenshi]

@jelbourn I can also confirm that the error still happens with the new version in IE11 and Edge. As @karlhaas already mentioned it's a problem with web-animations-js and should get fixed there.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}