-
Notifications
You must be signed in to change notification settings - Fork 6.8k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in 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