fix(radio): clear tabindex from host element (angular#13323)

Along the same lines as angular#13311 and angular#13308. Clears the `tabindex` from the radio button host element so we don't end up with multiple tab stops.

Author: crisbeto

src/lib/radio/radio.spec.ts

@@ -18,7 +18,8 @@ describe('MatRadio', () => {
         RadioGroupWithFormControl,
         StandaloneRadioButtons,
         InterleavedRadioGroup,
-        TranscludingWrapper
+        TranscludingWrapper,
+        RadioButtonWithPredefinedTabindex,
       ]
     });
 
@@ -714,6 +715,17 @@ describe('MatRadio', () => {
       expect(radioButtonInput.tabIndex)
         .toBe(4, 'Expected the tabindex to be set to "4".');
     });
+
+    it('should remove the tabindex from the host element', () => {
+      const predefinedFixture = TestBed.createComponent(RadioButtonWithPredefinedTabindex);
+      predefinedFixture.detectChanges();
+
+      const radioButtonEl =
+          predefinedFixture.debugElement.query(By.css('.mat-radio-button')).nativeElement;
+
+      expect(radioButtonEl.getAttribute('tabindex')).toBeFalsy();
+    });
+
   });
 
   describe('group interspersed with other tags', () => {
@@ -873,3 +885,9 @@ class InterleavedRadioGroup {
   `
 })
 class TranscludingWrapper {}
+
+
+@Component({
+  template: `<mat-radio-button tabindex="0"></mat-radio-button>`
+})
+class RadioButtonWithPredefinedTabindex {}

src/lib/radio/radio.ts

@@ -336,6 +336,7 @@ export const _MatRadioButtonMixinBase:
     '[class.mat-radio-checked]': 'checked',
     '[class.mat-radio-disabled]': 'disabled',
     '[class._mat-animation-noopable]': '_animationMode === "NoopAnimations"',
+    '[attr.tabindex]': 'null',
     '[attr.id]': 'id',
     // Note: under normal conditions focus shouldn't land on this element, however it may be
     // programmatically set, for example inside of a focus trap, in this case we want to forward