From ccb39687e57dfb52a9197cee4a86ab14a1d87a95 Mon Sep 17 00:00:00 2001 From: Conor Wright Date: Wed, 12 Sep 2018 10:10:10 -0400 Subject: [PATCH 1/2] Fixed radio buttons permanently being checked when outside of a group --- src/modules/radio/radio.component.spec.ts | 18 ++++++++++++++---- src/modules/radio/radio.component.ts | 4 ++-- 2 files changed, 16 insertions(+), 6 deletions(-) diff --git a/src/modules/radio/radio.component.spec.ts b/src/modules/radio/radio.component.spec.ts index a8a6f50b2..d723ac8f2 100644 --- a/src/modules/radio/radio.component.spec.ts +++ b/src/modules/radio/radio.component.spec.ts @@ -72,7 +72,9 @@ describe('Radio component', function () { expect(ngModel.valid).toBe(true); expect(ngModel.pristine).toBe(false); expect(ngModel.touched).toBe(true); - expect(radios.item(1).checked).toBe(true); + expect(radios.item(0).checked).toBeFalsy(); + expect(radios.item(1).checked).toBeTruthy(); + expect(radios.item(2).checked).toBeFalsy(); expect(componentInstance.selectedValue).toBe('2'); SkyAppTestUtility.fireDomEvent(radios.item(1), 'blur'); @@ -106,7 +108,9 @@ describe('Radio component', function () { tick(); const radios = fixture.nativeElement.querySelectorAll('input'); - expect(radios.item(1).checked).toBe(true); + expect(radios.item(0).checked).toBeFalsy(); + expect(radios.item(1).checked).toBeTruthy(); + expect(radios.item(2).checked).toBeFalsy(); })); it('should maintain checked state when value is changed', fakeAsync(function() { @@ -122,6 +126,8 @@ describe('Radio component', function () { radios = fixture.nativeElement.querySelectorAll('input'); expect(radios.item(0).checked).toBeTruthy(); + expect(radios.item(1).checked).toBeFalsy(); + expect(radios.item(2).checked).toBeFalsy(); })); it('should handle disabled state properly', fakeAsync(function () { @@ -134,7 +140,9 @@ describe('Radio component', function () { fixture.detectChanges(); tick(); - expect(radios.item(1).checked).toBe(false); + expect(radios.item(0).checked).toBeTruthy(); + expect(radios.item(1).checked).toBeFalsy(); + expect(radios.item(2).checked).toBeFalsy(); expect(componentInstance.selectedValue).toBe('1'); componentInstance.disabled2 = false; @@ -145,7 +153,9 @@ describe('Radio component', function () { fixture.detectChanges(); tick(); - expect(radios.item(1).checked).toBe(true); + expect(radios.item(0).checked).toBeFalsy(); + expect(radios.item(1).checked).toBeTruthy(); + expect(radios.item(2).checked).toBeFalsy(); expect(componentInstance.selectedValue).toBe('2'); })); diff --git a/src/modules/radio/radio.component.ts b/src/modules/radio/radio.component.ts index 35b4ea8e2..e2c25fa5a 100644 --- a/src/modules/radio/radio.component.ts +++ b/src/modules/radio/radio.component.ts @@ -132,7 +132,6 @@ export class SkyRadioComponent implements OnDestroy, ControlValueAccessor { public get change(): Observable { return this._change; } - public get inputId(): string { return `sky-radio-${this.id}-input`; } @@ -142,7 +141,6 @@ export class SkyRadioComponent implements OnDestroy, ControlValueAccessor { this._selectedValue = value; } } - public get selectedValue(): any { return this._selectedValue; } @@ -171,6 +169,8 @@ export class SkyRadioComponent implements OnDestroy, ControlValueAccessor { if (this.value === this.selectedValue) { this.checked = true; + } else { + this.checked = false; } this.changeDetector.markForCheck(); From 501984b51025bf80d092753fa79b9004d1c395be Mon Sep 17 00:00:00 2001 From: Conor Wright Date: Wed, 12 Sep 2018 10:18:34 -0400 Subject: [PATCH 2/2] simplified logic --- src/modules/radio/radio.component.ts | 7 +------ 1 file changed, 1 insertion(+), 6 deletions(-) diff --git a/src/modules/radio/radio.component.ts b/src/modules/radio/radio.component.ts index e2c25fa5a..aebc91b7e 100644 --- a/src/modules/radio/radio.component.ts +++ b/src/modules/radio/radio.component.ts @@ -166,12 +166,7 @@ export class SkyRadioComponent implements OnDestroy, ControlValueAccessor { } this.selectedValue = value; - - if (this.value === this.selectedValue) { - this.checked = true; - } else { - this.checked = false; - } + this.checked = this.value === this.selectedValue; this.changeDetector.markForCheck(); }