diff --git a/src/material-experimental/mdc-radio/radio.spec.ts b/src/material-experimental/mdc-radio/radio.spec.ts index d6edd9f1dc29..82ac7439d4c0 100644 --- a/src/material-experimental/mdc-radio/radio.spec.ts +++ b/src/material-experimental/mdc-radio/radio.spec.ts @@ -796,17 +796,7 @@ describe('MDC-based MatRadio', () => { const radioButtonEl = predefinedFixture.debugElement.query(By.css('.mat-mdc-radio-button'))!.nativeElement; - expect(radioButtonEl.getAttribute('tabindex')).toBe('-1'); - }); - - it('should set the tabindex to -1 on the host element', () => { - const predefinedFixture = TestBed.createComponent(RadioButtonWithPredefinedTabindex); - predefinedFixture.detectChanges(); - - const radioButtonEl = - predefinedFixture.debugElement.query(By.css('.mat-mdc-radio-button'))!.nativeElement; - - expect(radioButtonEl.getAttribute('tabindex')).toBe('-1'); + expect(radioButtonEl.hasAttribute('tabindex')).toBe(false); }); it('should forward a pre-defined tabindex to the underlying input', () => { diff --git a/src/material-experimental/mdc-radio/radio.ts b/src/material-experimental/mdc-radio/radio.ts index 0c9e52249696..7743a53a9794 100644 --- a/src/material-experimental/mdc-radio/radio.ts +++ b/src/material-experimental/mdc-radio/radio.ts @@ -97,7 +97,8 @@ export class MatRadioGroup extends _MatRadioGroupBase { '[class.mat-primary]': 'color === "primary"', '[class.mat-accent]': 'color === "accent"', '[class.mat-warn]': 'color === "warn"', - '[attr.tabindex]': 'disabled ? null : -1', + // Needs to be removed since it causes some a11y issues (see #21266). + '[attr.tabindex]': 'null', '[attr.aria-label]': 'null', '[attr.aria-labelledby]': 'null', '[attr.aria-describedby]': 'null', diff --git a/src/material/radio/radio.spec.ts b/src/material/radio/radio.spec.ts index 20e72ebed397..3a4d3fb6b50d 100644 --- a/src/material/radio/radio.spec.ts +++ b/src/material/radio/radio.spec.ts @@ -790,7 +790,7 @@ describe('MatRadio', () => { const radioButtonEl = predefinedFixture.debugElement.query(By.css('.mat-radio-button'))!.nativeElement; - expect(radioButtonEl.getAttribute('tabindex')).toBe('-1'); + expect(radioButtonEl.hasAttribute('tabindex')).toBe(false); }); it('should forward a pre-defined tabindex to the underlying input', () => { diff --git a/src/material/radio/radio.ts b/src/material/radio/radio.ts index 95b364e2ab57..25da1d46ba57 100644 --- a/src/material/radio/radio.ts +++ b/src/material/radio/radio.ts @@ -640,8 +640,8 @@ export abstract class _MatRadioButtonBase extends _MatRadioButtonMixinBase imple '[class.mat-primary]': 'color === "primary"', '[class.mat-accent]': 'color === "accent"', '[class.mat-warn]': 'color === "warn"', - // Needs to be -1 so the `focus` event still fires. - '[attr.tabindex]': '-1', + // Needs to be removed since it causes some a11y issues (see #21266). + '[attr.tabindex]': 'null', '[attr.id]': 'id', '[attr.aria-label]': 'null', '[attr.aria-labelledby]': 'null',