Skip to content

Commit bfa4022

Browse files
committed
fix(stepper): remove tabindex from content
A while ago in #14892 we added a `tabindex` to the content of the current step, however since then we consulted with the a11y team and it looks like adding the `tabindex` there isn't the best approach. Fixes #16692.
1 parent 37086fd commit bfa4022

File tree

3 files changed

+0
-18
lines changed

3 files changed

+0
-18
lines changed

src/material/stepper/stepper-horizontal.html

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,6 @@
2727

2828
<div class="mat-horizontal-content-container">
2929
<div *ngFor="let step of steps; let i = index"
30-
[attr.tabindex]="selectedIndex === i ? 0 : null"
3130
class="mat-horizontal-stepper-content" role="tabpanel"
3231
[@stepTransition]="_getAnimationDirection(i)"
3332
(@stepTransition.done)="_animationDone.next($event)"

src/material/stepper/stepper-vertical.html

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,6 @@
2323

2424
<div class="mat-vertical-content-container" [class.mat-stepper-vertical-line]="!isLast">
2525
<div class="mat-vertical-stepper-content" role="tabpanel"
26-
[attr.tabindex]="selectedIndex === i ? 0 : null"
2726
[@stepTransition]="_getAnimationDirection(i)"
2827
(@stepTransition.done)="_animationDone.next($event)"
2928
[id]="_getStepContentId(i)"

src/material/stepper/stepper.spec.ts

Lines changed: 0 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -362,22 +362,6 @@ describe('MatStepper', () => {
362362
assertSelectKeyWithModifierInteraction(fixture, stepHeaders, 'vertical', SPACE);
363363
});
364364

365-
it('should set the proper tabindex', () => {
366-
let stepContents = fixture.debugElement.queryAll(By.css(`.mat-vertical-stepper-content`));
367-
let stepperComponent = fixture.debugElement.query(By.directive(MatStepper)).componentInstance;
368-
let firstStepContentEl = stepContents[0].nativeElement;
369-
let secondStepContentEl = stepContents[1].nativeElement;
370-
371-
expect(firstStepContentEl.getAttribute('tabindex')).toBe('0');
372-
expect(secondStepContentEl.getAttribute('tabindex')).toBeFalsy();
373-
374-
stepperComponent.selectedIndex = 1;
375-
fixture.detectChanges();
376-
377-
expect(firstStepContentEl.getAttribute('tabindex')).toBeFalsy();
378-
expect(secondStepContentEl.getAttribute('tabindex')).toBe('0');
379-
});
380-
381365
});
382366

383367
describe('basic stepper when attempting to set the selected step too early', () => {

0 commit comments

Comments
 (0)