fix(button-toggle): clear name from host node

src/material/button-toggle/button-toggle.spec.ts

@@ -224,6 +224,7 @@ describe('MatButtonToggle without forms', () => {
         ButtonToggleWithAriaLabelledby,
         RepeatedButtonTogglesWithPreselectedValue,
         ButtonToggleWithTabindex,
+        ButtonToggleWithStaticName,
       ],
     });
 
@@ -736,7 +737,7 @@ describe('MatButtonToggle without forms', () => {
     });
   });
 
-  describe('with tabindex ', () => {
+  describe('with tabindex', () => {
     it('should forward the tabindex to the underlying button', () => {
       const fixture = TestBed.createComponent(ButtonToggleWithTabindex);
       fixture.detectChanges();
@@ -778,6 +779,16 @@ describe('MatButtonToggle without forms', () => {
     expect(fixture.componentInstance.toggles.toArray()[1].checked).toBe(true);
   });
 
+  it('should not throw on init when toggles are repeated and there is an initial value', () => {
+    const fixture = TestBed.createComponent(ButtonToggleWithStaticName);
+    fixture.detectChanges();
+
+    const hostNode: HTMLElement = fixture.nativeElement.querySelector('.mat-button-toggle');
+
+    expect(hostNode.hasAttribute('name')).toBe(false);
+    expect(hostNode.querySelector('button')!.getAttribute('name')).toBe('custom-name');
+  });
+
   it('should maintain the selected state when the value and toggles are swapped out at ' +
     'the same time', () => {
       const fixture = TestBed.createComponent(RepeatedButtonTogglesWithPreselectedValue);
@@ -951,3 +962,7 @@ class RepeatedButtonTogglesWithPreselectedValue {
 })
 class ButtonToggleWithTabindex {}
 
+@Component({
+  template: `<mat-button-toggle name="custom-name"></mat-button-toggle>`
+})
+class ButtonToggleWithStaticName {}

src/material/button-toggle/button-toggle.ts

@@ -372,6 +372,7 @@ const _MatButtonToggleMixinBase: CanDisableRippleCtor & typeof MatButtonToggleBa
     // but can still receive focus from things like cdkFocusInitial.
     '[attr.tabindex]': '-1',
     '[attr.id]': 'id',
+    '[attr.name]': 'null',
     '(focus)': 'focus()',
   }
 })