diff --git a/e2e/components/tabs-e2e.spec.ts b/e2e/components/tabs-e2e.spec.ts index d7ce273b44db..31a30a14ff96 100644 --- a/e2e/components/tabs-e2e.spec.ts +++ b/e2e/components/tabs-e2e.spec.ts @@ -51,17 +51,11 @@ describe('tabs', () => { pressKeys(right); expect(await getFocusStates(tabLabels)).toEqual([false, false, true]); - pressKeys(right); - expect(await getFocusStates(tabLabels)).toEqual([false, false, true]); - pressKeys(left); expect(await getFocusStates(tabLabels)).toEqual([false, true, false]); pressKeys(left); expect(await getFocusStates(tabLabels)).toEqual([true, false, false]); - - pressKeys(left); - expect(await getFocusStates(tabLabels)).toEqual([true, false, false]); }); }); }); diff --git a/src/lib/tabs/tab-group.spec.ts b/src/lib/tabs/tab-group.spec.ts index 3063045f575c..65ebcbcef4fd 100644 --- a/src/lib/tabs/tab-group.spec.ts +++ b/src/lib/tabs/tab-group.spec.ts @@ -284,6 +284,7 @@ describe('MatTabGroup', () => { fixture.detectChanges(); const labels = fixture.debugElement.queryAll(By.css('.mat-tab-disabled')); expect(labels.length).toBe(1); + expect(labels[0].nativeElement.getAttribute('aria-disabled')).toBe('true'); }); it('should set the disabled flag on tab', () => { @@ -293,6 +294,7 @@ describe('MatTabGroup', () => { let labels = fixture.debugElement.queryAll(By.css('.mat-tab-disabled')); expect(tabs[2].disabled).toBe(false); expect(labels.length).toBe(1); + expect(labels[0].nativeElement.getAttribute('aria-disabled')).toBe('true'); fixture.componentInstance.isDisabled = true; fixture.detectChanges(); @@ -300,6 +302,8 @@ describe('MatTabGroup', () => { expect(tabs[2].disabled).toBe(true); labels = fixture.debugElement.queryAll(By.css('.mat-tab-disabled')); expect(labels.length).toBe(2); + expect(labels.every(label => label.nativeElement.getAttribute('aria-disabled') === 'true')) + .toBe(true); }); }); diff --git a/src/lib/tabs/tab-header.ts b/src/lib/tabs/tab-header.ts index 6b1bf808e5e4..7e183fa764bd 100644 --- a/src/lib/tabs/tab-header.ts +++ b/src/lib/tabs/tab-header.ts @@ -198,7 +198,8 @@ export class MatTabHeader extends _MatTabHeaderMixinBase }; this._keyManager = new FocusKeyManager(this._labelWrappers) - .withHorizontalOrientation(this._getLayoutDirection()); + .withHorizontalOrientation(this._getLayoutDirection()) + .withWrap(); this._keyManager.updateActiveItemIndex(0); diff --git a/src/lib/tabs/tab-label-wrapper.ts b/src/lib/tabs/tab-label-wrapper.ts index 44177c937628..09f54ba833fb 100644 --- a/src/lib/tabs/tab-label-wrapper.ts +++ b/src/lib/tabs/tab-label-wrapper.ts @@ -22,7 +22,8 @@ export const _MatTabLabelWrapperMixinBase = mixinDisabled(MatTabLabelWrapperBase selector: '[matTabLabelWrapper]', inputs: ['disabled'], host: { - '[class.mat-tab-disabled]': 'disabled' + '[class.mat-tab-disabled]': 'disabled', + '[attr.aria-disabled]': '!!disabled', } }) export class MatTabLabelWrapper extends _MatTabLabelWrapperMixinBase implements CanDisable {