Fixed #10837 - TabView: p-tabview-ink-bar doesn't follow the size of …

…TabPanel header property change
primefaces · Dec 8, 2021 · 46be1a0 · 46be1a0 · magicdict · Jan 20, 2022
1 parent 5ca9791
commit 46be1a0
Showing 1 changed file with 6 additions and 3 deletions.
diff --git a/src/app/components/tabview/tabview.ts b/src/app/components/tabview/tabview.ts
@@ -120,6 +120,7 @@ export class TabPanel implements AfterContentInit,OnDestroy {
 
     set header(header: string) {
         this._header = header;
+        this.tabView.updateInkBar();
         this.tabView.cd.markForCheck();
     }
 
@@ -380,9 +381,11 @@ export class TabView implements AfterContentInit,AfterViewChecked,BlockableUI {
     }
 
     updateInkBar() {
-        let tabHeader = DomHandler.findSingle(this.navbar.nativeElement, 'li.p-highlight');
-        this.inkbar.nativeElement.style.width = DomHandler.getWidth(tabHeader) + 'px';
-        this.inkbar.nativeElement.style.left =  DomHandler.getOffset(tabHeader).left - DomHandler.getOffset(this.navbar.nativeElement).left + 'px';
+        if (this.navbar) {
+            let tabHeader = DomHandler.findSingle(this.navbar.nativeElement, 'li.p-highlight');
+            this.inkbar.nativeElement.style.width = DomHandler.getWidth(tabHeader) + 'px';
+            this.inkbar.nativeElement.style.left =  DomHandler.getOffset(tabHeader).left - DomHandler.getOffset(this.navbar.nativeElement).left + 'px';
+        }
     }
 
     updateScrollBar(index) {