TabMenu: Inkbar Not Aligned With Active Route

[shawnweeks]

Describe the bug

For all the material design and material design compact themes the inkbar is not located under the active TabMenu tab when accessing the page directly via routing. For other themes like lara-light-blue that use pure CSS the issue isn't there. These seems to be caused by tabChanged being undefined at

primeng/src/app/components/tabmenu/tabmenu.ts

Line 270 in dcfbb20

if (this.tabChanged) {

when accessing a tab directly via the route instead of clicking.

Overriding the function definition like this seems to resolve the issue.

TabMenu.prototype.ngAfterViewChecked = function () {
      if (this.tabChanged ? this.tabChanged : true) {
        this.updateInkBar();
        this.tabChanged = false;
      }
    }

Environment

Angular CLI: 17.0.3
Node: 20.10.0
Package Manager: npm 10.2.3
OS: darwin arm64

Reproducer

https://stackblitz.com/~/github.com/shawnweeks/primeng-tab-menu-bug

Angular version

17.0.4

PrimeNG version

17.0.0-beta.1

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

17.0.0-beta.1

Browser(s)

Firefox 119.0.1

Steps to reproduce the behavior

1. Open project using StackBlitz Link
2. Wait for project to start
3. Add /first or /second to the end of the mini browser url
4. Notice how the text is highlighted correctly but the inkbar is all the way to the left.

Expected behavior

No response

[nclsstdl]

ran into the same issue today with version 17.6.0

[balkaninal]

I encountered the same issue today. The routerLink values in the tabMenu didn't work correctly with router-outlet. The active item wasn't set on the first click but updated on the next click. I used the "overriding the function" above to fix it, thank you.

version 15.4.1

[mertsincan]

Hi,

So sorry for the delayed response! Improvements have been made to many components recently, both in terms of performance and enhancement. Therefore, this improvement may have been developed in another issue ticket without realizing it. You can check this in the documentation. If there is no improvement on this, can you reopen the issue so we can include it in our roadmap?
Please don't forget to add your feedback as a comment after reopening the issue. These will be taken into account by us and will contribute to the development of this feature. Thanks a lot for your understanding!

Best Regards,

[shawnweeks]

I've confirmed that this issue no longer occurs in 17.18.12.