Description
Is this a regression?
- Yes, this behavior used to work in the previous version
The previous version in which this bug was not present was
No response
Description
Angular app with mat-tab-nav-bar and mat-tab-link
Then we run our angular application (fresh start/ initial load/ refresh page), even we have correctly selected activeLink we cannot see underline under selected tab.
Even using _alignInkBarToSelectedTab() and realignInkBar() did not help.
The problem is visible in example stackBlitz for component.
Reproduction
Steps to reproduce:
As I said, the problem is visible in example stackBlitz for component.
Go here:
https://material.angular.io/components/tabs/examples
Scroll to a very bottom of the page (Basic use of the tab nav bar),
Click icon to "Edit this example in StackBlitz"
Click the button and go here (or just follow the link):
https://stackblitz.com/run?file=src%2Fapp%2Ftab-nav-bar-basic-example.ts
Let application load and just look at output.
There is no underline under 1st tab.
But, when we click the second tab we will see animation (underline going from 1st to 2nd tab) and underline is visible under 2nd tab.
Expected Behavior
On initial load, we should be able to see underline in the selected tab.
Actual Behavior
On initial load, there is no underline in tab link component.
Environment
- Angular: 14.0.0
- CDK/Material: material current version (14.0.2)
- Browser(s): Chrome V. 102.0.5005.115
- Operating System (e.g. Windows, macOS, Ubuntu): Windows.
// All can be check in stackBlitz example