diff --git a/src/lib/stepper/stepper.spec.ts b/src/lib/stepper/stepper.spec.ts index 02a326cc8f77..5302c249c330 100644 --- a/src/lib/stepper/stepper.spec.ts +++ b/src/lib/stepper/stepper.spec.ts @@ -56,6 +56,11 @@ describe('MatHorizontalStepper', () => { expect(stepperEl.getAttribute('role')).toBe('tablist'); }); + it('should set the proper "aria-orientation"', () => { + let stepperEl = fixture.debugElement.query(By.css('mat-horizontal-stepper')).nativeElement; + expect(stepperEl.getAttribute('aria-orientation')).toBe('horizontal'); + }); + it('should set aria-expanded of content correctly', () => { let stepContents = fixture.debugElement.queryAll(By.css(`.mat-horizontal-stepper-content`)); assertCorrectAriaExpandedAttribute(fixture, stepContents); @@ -227,6 +232,11 @@ describe('MatVerticalStepper', () => { expect(stepperEl.getAttribute('role')).toBe('tablist'); }); + it('should set the proper "aria-orientation"', () => { + let stepperEl = fixture.debugElement.query(By.css('mat-vertical-stepper')).nativeElement; + expect(stepperEl.getAttribute('aria-orientation')).toBe('vertical'); + }); + it('should set aria-expanded of content correctly', () => { let stepContents = fixture.debugElement.queryAll(By.css(`.mat-vertical-stepper-content`)); assertCorrectAriaExpandedAttribute(fixture, stepContents); diff --git a/src/lib/stepper/stepper.ts b/src/lib/stepper/stepper.ts index fad6059712d6..143abcb8e7e8 100644 --- a/src/lib/stepper/stepper.ts +++ b/src/lib/stepper/stepper.ts @@ -90,6 +90,7 @@ export class MatStepper extends _MatStepper implements AfterContentInit { inputs: ['selectedIndex'], host: { 'class': 'mat-stepper-horizontal', + 'aria-orientation': 'horizontal', 'role': 'tablist', }, animations: [ @@ -116,6 +117,7 @@ export class MatHorizontalStepper extends MatStepper { } inputs: ['selectedIndex'], host: { 'class': 'mat-stepper-vertical', + 'aria-orientation': 'vertical', 'role': 'tablist', }, animations: [