Skip to content

Commit fd97395

Browse files
committed
fix(material/tabs): nav bar not navigating on enter presses (#27862)
Fixes that the tab nav bar wasn't navigating when pressing the enter key. Fixes #27843. (cherry picked from commit 5dd614a)
1 parent e5a6691 commit fd97395

File tree

2 files changed

+19
-4
lines changed

2 files changed

+19
-4
lines changed

src/material/tabs/tab-nav-bar/tab-nav-bar.spec.ts

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -327,6 +327,19 @@ describe('MDC-based MatTabNavBar', () => {
327327
expect(tabLinks[1].classList.contains('mdc-tab--active')).toBe(true);
328328
});
329329

330+
it('should activate a link when enter is pressed', () => {
331+
const fixture = TestBed.createComponent(SimpleTabNavBarTestApp);
332+
fixture.detectChanges();
333+
334+
const tabLinks = fixture.nativeElement.querySelectorAll('.mat-mdc-tab-link');
335+
expect(tabLinks[1].classList.contains('mdc-tab--active')).toBe(false);
336+
337+
dispatchKeyboardEvent(tabLinks[1], 'keydown', ENTER);
338+
fixture.detectChanges();
339+
340+
expect(tabLinks[1].classList.contains('mdc-tab--active')).toBe(true);
341+
});
342+
330343
describe('ripples', () => {
331344
let fixture: ComponentFixture<SimpleTabNavBarTestApp>;
332345

src/material/tabs/tab-nav-bar/tab-nav-bar.ts

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -261,10 +261,12 @@ export class _MatTabLinkBase
261261
}
262262

263263
_handleKeydown(event: KeyboardEvent) {
264-
if (this.disabled && (event.keyCode === SPACE || event.keyCode === ENTER)) {
265-
event.preventDefault();
266-
} else if (this._tabNavBar.tabPanel && event.keyCode === SPACE) {
267-
this.elementRef.nativeElement.click();
264+
if (event.keyCode === SPACE || event.keyCode === ENTER) {
265+
if (this.disabled) {
266+
event.preventDefault();
267+
} else if (this._tabNavBar.tabPanel) {
268+
this.elementRef.nativeElement.click();
269+
}
268270
}
269271
}
270272

0 commit comments

Comments
 (0)