angular / angular/components

[Tooltip] Tooltip does not vanish after route navigation with reusable routes

Open
#11,478 12 comments 16 reactions 0 assignees View on GitHub
area: material/tooltip P3
Dominant language
TypeScript
Stars
25k
Forks
6.8k
Avg merge
1d 8h
Merged PRs (30d)
91

Description

#### Bug, feature request, or proposal:

Bug

#### What is the expected behavior?

A displayed tooltip should vanish, after navigating to a route with a different component.

#### What is the current behavior?

When a RouteReuseStrategy is implemented, then the tooltip doesn't vanish if the original route is detached while the tooltip was visible.

#### What are the steps to reproduce?

StackBlitz example: https://stackblitz.com/edit/angular-yvcjzp

A tooltip is displayed on button "Goto Page 2". Clicking on the button will navigate to page 2. This will causes the tooltip from page 1 to be stuck on the screen. It will only vanish once the user navigates back to page 1 again.

Disabling reusable routes by removing the custom RouteReuseStrategy will lead to the the expected behavior again:

```
providers: [
// remove this, and the tooltip starts to work properly
{ provide: RouteReuseStrategy, useClass: CustomReuseStrategy }
],
```

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

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

"dependencies": {
"@angular/animations": "6.0.0",
"@angular/cdk": "^6.0.0",
"@angular/common": "6.0.0",
"@angular/compiler": "6.0.0",
"@angular/core": "6.0.0",
"@angular/forms": "6.0.0",
"@angular/http": "6.0.0",
"@angular/material": "^6.0.0",
"@angular/platform-browser": "6.0.0",
"@angular/platform-browser-dynamic": "6.0.0",
"@angular/router": "6.0.0",
"core-js": "^2.4.1",
"rxjs": "^6.1.0",
"rxjs-compat": "^6.1.0",
"zone.js": "^0.8.26"
},

#### Is there anything else we should know?

Contributor guide

Open the contributing guide

Research direction

Start with the linked StackBlitz reproduction and inspect the tooltip behavior during navigation with the custom RouteReuseStrategy enabled. Compare it with navigation after removing that provider; done means a visible tooltip from page 1 disappears when navigating to page 2, without requiring a return to page 1.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.