From a259b016b0ef37511c7b6b887da93bacef91f243 Mon Sep 17 00:00:00 2001 From: Kristiyan Kostadinov Date: Mon, 12 Aug 2024 09:53:35 +0200 Subject: [PATCH] fix(material/radio): account for disabledInteractive in harness Switches to using a CSS class to get the disabled state in the harness so it continues to work when `disabledInteractive` is set. (cherry picked from commit 002b0541a9ec6bc389aef7cfa6d136e832e67f62) --- .../radio/testing/radio-harness.spec.ts | 42 ++++++++++++------- src/material/radio/testing/radio-harness.ts | 10 ++++- 2 files changed, 35 insertions(+), 17 deletions(-) diff --git a/src/material/radio/testing/radio-harness.spec.ts b/src/material/radio/testing/radio-harness.spec.ts index 60855009842a..0a448b8a2ddc 100644 --- a/src/material/radio/testing/radio-harness.spec.ts +++ b/src/material/radio/testing/radio-harness.spec.ts @@ -45,21 +45,17 @@ describe('radio harness', () => { expect(await groups[0].getId()).toBe('my-group-1'); }); - it( - 'should throw when finding radio-group with specific name that has mismatched ' + - 'radio-button names', - async () => { - fixture.componentInstance.thirdGroupButtonName = 'other-name'; - fixture.changeDetectorRef.markForCheck(); - fixture.detectChanges(); - - await expectAsync( - loader.getAllHarnesses(MatRadioGroupHarness.with({name: 'third-group-name'})), - ).toBeRejectedWithError( - /locator found a radio-group with name "third-group-name".*have mismatching names/, - ); - }, - ); + it('should throw when finding radio-group with specific name that has mismatched radio-button names', async () => { + fixture.componentInstance.thirdGroupButtonName = 'other-name'; + fixture.changeDetectorRef.markForCheck(); + fixture.detectChanges(); + + await expectAsync( + loader.getAllHarnesses(MatRadioGroupHarness.with({name: 'third-group-name'})), + ).toBeRejectedWithError( + /locator found a radio-group with name "third-group-name".*have mismatching names/, + ); + }); it('should get name of radio-group', async () => { const groups = await loader.getAllHarnesses(MatRadioGroupHarness); @@ -214,6 +210,20 @@ describe('radio harness', () => { expect(await firstRadio.isDisabled()).toBe(true); }); + it('should get the disabled state with disabledInteractive is enabled', async () => { + fixture.componentInstance.disabledInteractive = true; + fixture.changeDetectorRef.markForCheck(); + + const [firstRadio] = await loader.getAllHarnesses(MatRadioButtonHarness); + expect(await firstRadio.isDisabled()).toBe(false); + + fixture.componentInstance.disableAll = true; + fixture.changeDetectorRef.markForCheck(); + fixture.detectChanges(); + + expect(await firstRadio.isDisabled()).toBe(true); + }); + it('should focus radio-button', async () => { const radioButton = await loader.getHarness(MatRadioButtonHarness.with({selector: '#opt2'})); expect(await radioButton.isFocused()).toBe(false); @@ -272,6 +282,7 @@ describe('radio harness', () => { { class MultipleRadioButtonsHarnessTest { values = ['opt1', 'opt2', 'opt3']; disableAll = false; + disabledInteractive = false; secondGroupId = 'my-group-2'; thirdGroupName: string = 'third-group-name'; thirdGroupButtonName: string | undefined = undefined; diff --git a/src/material/radio/testing/radio-harness.ts b/src/material/radio/testing/radio-harness.ts index 2c543519e014..c33b2065d574 100644 --- a/src/material/radio/testing/radio-harness.ts +++ b/src/material/radio/testing/radio-harness.ts @@ -205,8 +205,14 @@ export class MatRadioButtonHarness extends ComponentHarness { /** Whether the radio-button is disabled. */ async isDisabled(): Promise { - const disabled = (await this._input()).getAttribute('disabled'); - return coerceBooleanProperty(await disabled); + const input = await this._input(); + const disabled = await input.getAttribute('disabled'); + + if (disabled !== null) { + return coerceBooleanProperty(disabled); + } + + return (await input.getAttribute('aria-disabled')) === 'true'; } /** Whether the radio-button is required. */