Skip to content

Commit 08d2e3e

Browse files
committedAug 13, 2024·
fix(material/slide-toggle): 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 c3e0279)
1 parent a259b01 commit 08d2e3e

File tree

3 files changed

+25
-4
lines changed

3 files changed

+25
-4
lines changed
 

‎src/material/slide-toggle/slide-toggle.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
[attr.aria-describedby]="ariaDescribedby"
1818
[attr.aria-required]="required || null"
1919
[attr.aria-checked]="checked"
20-
[attr.aria-disabled]="disabledInteractive && disabledInteractive ? 'true' : null"
20+
[attr.aria-disabled]="disabled && disabledInteractive ? 'true' : null"
2121
(click)="_handleClick()"
2222
#switch>
2323
<span class="mdc-switch__track"></span>

‎src/material/slide-toggle/testing/slide-toggle-harness.spec.ts

+16-1
Original file line numberDiff line numberDiff line change
@@ -160,6 +160,17 @@ describe('MatSlideToggleHarness', () => {
160160
await disabledToggle.toggle();
161161
expect(await disabledToggle.isChecked()).toBe(false);
162162
});
163+
164+
it('should get disabled state when disabledInteractive is enabled', async () => {
165+
fixture.componentInstance.disabled.set(false);
166+
fixture.componentInstance.disabledInteractive.set(true);
167+
168+
const toggle = await loader.getHarness(MatSlideToggleHarness.with({label: 'Second'}));
169+
expect(await toggle.isDisabled()).toBe(false);
170+
171+
fixture.componentInstance.disabled.set(true);
172+
expect(await toggle.isDisabled()).toBe(true);
173+
});
163174
});
164175

165176
@Component({
@@ -171,7 +182,10 @@ describe('MatSlideToggleHarness', () => {
171182
aria-label="First slide-toggle">
172183
First
173184
</mat-slide-toggle>
174-
<mat-slide-toggle [disabled]="disabled()" aria-labelledby="second-label">
185+
<mat-slide-toggle
186+
[disabled]="disabled()"
187+
[disabledInteractive]="disabledInteractive()"
188+
aria-labelledby="second-label">
175189
Second
176190
</mat-slide-toggle>
177191
<span id="second-label">Second slide-toggle</span>
@@ -182,4 +196,5 @@ describe('MatSlideToggleHarness', () => {
182196
class SlideToggleHarnessTest {
183197
ctrl = new FormControl(true);
184198
disabled = signal(true);
199+
disabledInteractive = signal(false);
185200
}

‎src/material/slide-toggle/testing/slide-toggle-harness.ts

+8-2
Original file line numberDiff line numberDiff line change
@@ -70,8 +70,14 @@ export class MatSlideToggleHarness extends ComponentHarness {
7070

7171
/** Whether the slide-toggle is disabled. */
7272
async isDisabled(): Promise<boolean> {
73-
const disabled = (await this._nativeElement()).getAttribute('disabled');
74-
return coerceBooleanProperty(await disabled);
73+
const nativeElement = await this._nativeElement();
74+
const disabled = await nativeElement.getAttribute('disabled');
75+
76+
if (disabled !== null) {
77+
return coerceBooleanProperty(disabled);
78+
}
79+
80+
return (await nativeElement.getAttribute('aria-disabled')) === 'true';
7581
}
7682

7783
/** Whether the slide-toggle is required. */

0 commit comments

Comments
 (0)
Please sign in to comment.