SONAR-16939 States/Properties: Invalid ARIA attribute value

diff --git a/server/sonar-web/src/main/js/components/controls/Checkbox.tsx b/server/sonar-web/src/main/js/components/controls/Checkbox.tsx
index 69fb1518e032f0e5088641f7ffb48b92d27ba7df..ce2940fbfc471b4d508e1803bc64c35a0e15ed15 100644 (file)
--- a/server/sonar-web/src/main/js/components/controls/Checkbox.tsx
+++ b/server/sonar-web/src/main/js/components/controls/Checkbox.tsx
@@ -73,7 +73,7 @@ export default class Checkbox extends React.PureComponent<Props> {
     if (children) {
       return (
         <a
-          aria-checked={checked}
+          aria-checked={thirdState ? 'mixed' : checked}
           aria-label={label}
           className={classNames('link-checkbox', this.props.className, {
             disabled
@@ -98,7 +98,7 @@ export default class Checkbox extends React.PureComponent<Props> {
 
     return (
       <a
-        aria-checked={checked}
+        aria-checked={thirdState ? 'mixed' : checked}
         aria-label={label}
         className={classNames(className, this.props.className)}
         href="#"

diff --git a/server/sonar-web/src/main/js/components/controls/__tests__/Checkbox-test.tsx b/server/sonar-web/src/main/js/components/controls/__tests__/Checkbox-test.tsx
index 05055305f29a0bcfc89a7fb93e1a20b04211bdb3..dcd89ea0f75a03c40e36669485e28524e22f6c32 100644 (file)
--- a/server/sonar-web/src/main/js/components/controls/__tests__/Checkbox-test.tsx
+++ b/server/sonar-web/src/main/js/components/controls/__tests__/Checkbox-test.tsx
@@ -48,12 +48,14 @@ it('should render unchecked third state', () => {
   const checkbox = shallow(<Checkbox checked={false} onCheck={() => true} thirdState={true} />);
   expect(checkbox.is('.icon-checkbox-single')).toBe(true);
   expect(checkbox.is('.icon-checkbox-checked')).toBe(false);
+  expect(checkbox.prop('aria-checked')).toBe('mixed');
 });
 
 it('should render checked third state', () => {
   const checkbox = shallow(<Checkbox checked={true} onCheck={() => true} thirdState={true} />);
   expect(checkbox.is('.icon-checkbox-single')).toBe(true);
   expect(checkbox.is('.icon-checkbox-checked')).toBe(true);
+  expect(checkbox.prop('aria-checked')).toBe('mixed');
 });
 
 it('should render with a spinner', () => {