bug(mat-tab-nav-bar): With version 19 the ink bar lost animation when choosing a tab to the right of the active tab

[bstaley]

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

18

Description

Using mat-tab-nav-bar in version 18, no matter which tab you chose you would see the ink bar animate to that new tab. Now in 19 it only animates to the left.

Reproduction

Steps to reproduce:

1. navigate to https://v18.material.angular.io/components/tabs/examples#tab-nav-bar-basic
2. switch tab focus
3. note the animation
4. navigate to any version of 19, such as https://next.material.angular.io/components/tabs/examples
5. choose a tab to the right
6. note the lack of animation
7. choose a tab to the left
8. note the animation

Expected Behavior

Choosing a tab in any direction should animate.

Actual Behavior

Animation only happens when choosing a tab to the left of the current active.

Environment

• Angular: ^19.0.0
• CDK/Material: ^19.0.4
• Browser(s): Chrome - 131.0.6778.205
• Operating System (e.g. Windows, macOS, Ubuntu): Windows

[crisbeto]

Which animation are you referring to? It seems to work as expected to me.

[crisbeto]

Also here a recording of how it looks on my end:

Screen.Recording.2025-01-10.at.21.09.32.mov

[crisbeto]

Ah I see what you mean. It's only on the nav bar.