From a6b26161b4af96baac0cc5002765498c2c52eced Mon Sep 17 00:00:00 2001 From: crisbeto Date: Sat, 9 Mar 2019 00:14:44 +0100 Subject: [PATCH] fix(radio): clear names from host nodes Along the same lines as #15368. Clears the `name` from the host node of the radio button and radio group, because they end up being forwarded to the underlying `input` and can cause double results when using something like `getElementsByName`. --- src/material/radio/radio.spec.ts | 9 +++++++++ src/material/radio/radio.ts | 2 ++ 2 files changed, 11 insertions(+) diff --git a/src/material/radio/radio.spec.ts b/src/material/radio/radio.spec.ts index 65f6541115cd..7d475f84839e 100644 --- a/src/material/radio/radio.spec.ts +++ b/src/material/radio/radio.spec.ts @@ -65,6 +65,11 @@ describe('MatRadio', () => { } }); + it('should clear the name attribute from the radio group host node', () => { + expect(groupInstance.name).toBeTruthy(); + expect(groupDebugElement.nativeElement.getAttribute('name')).toBeFalsy(); + }); + it('should coerce the disabled binding on the radio group', () => { (groupInstance as any).disabled = ''; fixture.detectChanges(); @@ -727,6 +732,10 @@ describe('MatRadio', () => { expect(seasonRadioInstances.every(radio => radio.color === 'accent')).toBe(true); }); + it('should clear the name attribute from the radio host node', () => { + expect(radioDebugElements.every(el => !el.nativeElement.getAttribute('name'))).toBe(true); + }); + }); describe('with tabindex', () => { diff --git a/src/material/radio/radio.ts b/src/material/radio/radio.ts index fc7d93470aeb..bc027cf122f5 100644 --- a/src/material/radio/radio.ts +++ b/src/material/radio/radio.ts @@ -93,6 +93,7 @@ export class MatRadioChange { host: { 'role': 'radiogroup', 'class': 'mat-radio-group', + '[attr.name]': 'null', }, }) export class MatRadioGroup implements AfterContentInit, ControlValueAccessor { @@ -346,6 +347,7 @@ const _MatRadioButtonMixinBase: // Needs to be -1 so the `focus` event still fires. '[attr.tabindex]': '-1', '[attr.id]': 'id', + '[attr.name]': 'null', // 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 // the focus to the native element.