-
Notifications
You must be signed in to change notification settings - Fork 6.8k
New issue
Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? # to your account
fix(checkbox): Set aria-checked to mixed for indeterminate checkbox #8089
Conversation
src/lib/checkbox/checkbox.ts
Outdated
@@ -303,6 +303,10 @@ export class MatCheckbox extends _MatCheckboxMixinBase implements ControlValueAc | |||
this._changeDetectorRef.markForCheck(); | |||
} | |||
|
|||
getAriaChecked() { | |||
return this.checked ? true : (this.indeterminate ? 'mixed' : false); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Return type should be 'true' | 'false' | 'mixed'
(since the attr should always be a string)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Done. Thanks for review!
ab0d856
to
55d01f8
Compare
src/lib/checkbox/checkbox.ts
Outdated
@@ -303,6 +303,10 @@ export class MatCheckbox extends _MatCheckboxMixinBase implements ControlValueAc | |||
this._changeDetectorRef.markForCheck(); | |||
} | |||
|
|||
getAriaChecked(): string { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Just also realized: method should be internal _getAriaChecked
The return type can really the string literal type 'true' | 'false' | 'mixed'
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM, just some style nits. Add merge-ready when you're ready
src/lib/checkbox/checkbox.spec.ts
Outdated
@@ -87,13 +87,17 @@ describe('MatCheckbox', () => { | |||
expect(checkboxNativeElement.classList).not.toContain('mat-checkbox-checked'); | |||
expect(inputElement.checked).toBe(false); | |||
expect(inputElement.indeterminate).toBe(false); | |||
expect(inputElement.getAttribute('aria-checked')) | |||
.toBe('false', 'Expect aria-checked to be false'); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
+2 more indent
src/lib/checkbox/checkbox.ts
Outdated
@@ -303,6 +303,10 @@ export class MatCheckbox extends _MatCheckboxMixinBase implements ControlValueAc | |||
this._changeDetectorRef.markForCheck(); | |||
} | |||
|
|||
_getAriaChecked(): 'true'|'false'|'mixed' { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
We typically put spaces between the types like this
'true' | 'false' | 'mixed'
79e3f0a
to
11fc952
Compare
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
Fixes #7932