fix(engine): update roles for summary and li elements per ARIA in HTML spec change

.gitignore

@@ -35,3 +35,4 @@ jspm_packages
 .gz
 .tar
 accessibility-checker-engine/karma.conf.js
+karma-accessibility-checker/package.json

accessibility-checker-engine/src/v2/aria/ARIADefinitions.ts

@@ -1906,11 +1906,6 @@ export class ARIADefinitions {
             validRoles: null,
             globalAriaAttributesValid: true
         },
-        "li": {
-            implicitRole: ["listitem"],
-            validRoles: ["menuitem", "menuitemcheckbox", "menuitemradio", "none", "option", "presentation", "radio", "separator", "tab", "treeitem"],
-            globalAriaAttributesValid: true
-        },
         "link": {
             implicitRole: null,
             validRoles: null,
@@ -2086,11 +2081,6 @@ export class ARIADefinitions {
             validRoles: ["any"],
             globalAriaAttributesValid: true
         },
-        "summary": {
-            implicitRole: ["button"],
-            validRoles: null,
-            globalAriaAttributesValid: true
-        },
         "sup": {
             implicitRole: ["superscript"],
             validRoles: ["any"],
@@ -2476,6 +2466,18 @@ export class ARIADefinitions {
                 globalAriaAttributesValid: true
             }
         },
+        "li": {
+            "child-of-list-role": {
+                implicitRole: ['listitem'],
+                validRoles: null,
+                globalAriaAttributesValid: true
+            },
+            "no-child-of-list-role": {
+                implicitRole: ['listitem'],
+                validRoles: ["any"],
+                globalAriaAttributesValid: true
+            }
+        },
         "section": {
             "with-name": {
                 implicitRole: ["region"],
@@ -2504,6 +2506,19 @@ export class ARIADefinitions {
                 otherDisallowedAriaAttributes: ["aria-multiselectable"]
             }
         },
+        "summary": {
+            "first-summary-of-detail": {
+                implicitRole: null,
+                validRoles: null,
+                globalAriaAttributesValid: true,
+                otherAllowedAriaAttributes: ["aria-disabled", "aria-haspopup"]
+            },
+            "no-first-summary-of-detail": {
+                implicitRole: null,
+                validRoles: ["any"],
+                globalAriaAttributesValid: true
+            }
+        },
         "tbody": {
             "des-table": {
                 implicitRole: ["rowgroup"],

accessibility-checker-engine/src/v2/checker/accessibility/util/legacy.ts

@@ -21,6 +21,7 @@ import { DOMWalker } from "../../../dom/DOMWalker";
 import { VisUtil } from "../../../dom/VisUtil";
 import { FragmentUtil } from "./fragment";
 import { getDefinedStyles } from "../../../../v4/util/CSSUtil";
+import { DOMUtil } from "../../../dom/DOMUtil";
 
 export class RPTUtil {
 
@@ -376,7 +377,15 @@ export class RPTUtil {
         "video": function (element) {
             return element.hasAttribute("controls");
         },
-        "summary": true
+        "summary": function (element) {
+            // first summary child of a details element is automatically focusable 
+            return element.parentElement && element.parentElement.nodeName.toLowerCase() === 'details' 
+                   && DOMUtil.sameNode([...element.parentElement.children].filter(elem=>elem.nodeName.toLowerCase() === 'summary')[0], element);
+        },
+        "details": function (element) {
+            //details element without a direct summary child is automatically focusable
+            return element.children && [...element.children].filter(elem=>elem.nodeName.toLowerCase() === 'summary').length === 0;
+        }
     }
 
     public static wordCount(str) : number {
@@ -2543,14 +2552,21 @@ export class RPTUtil {
                             RPTUtil.attributeNonEmpty(ruleContext, "list") ? tagProperty = specialTagProperties["text-with-list"] : tagProperty = specialTagProperties["text-no-list"];
                         }
                         break;
+                    case "li":
+                        specialTagProperties = ARIADefinitions.documentConformanceRequirementSpecialTags["li"];
+                        if (ruleContext.parentElement && RPTUtil.hasRoleInSemantics(ruleContext.parentElement, "list"))
+                            tagProperty = specialTagProperties["child-of-list-role"];
+                        else
+                            tagProperty = specialTagProperties["no-child-of-list-role"];
+                        break;
                     case "section":
                         name = ARIAMapper.computeName(ruleContext);
                         if (name && name.trim().length > 0) {
                             tagProperty = specialTagProperties["with-name"];
                         } else {
                             tagProperty = specialTagProperties["without-name"];
                         }
-                        break;
+                        break;    
                     case "select":
                         specialTagProperties = ARIADefinitions.documentConformanceRequirementSpecialTags["select"];
                         if (ruleContext.hasAttribute("multiple") ||
@@ -2559,6 +2575,14 @@ export class RPTUtil {
                         else
                             tagProperty = specialTagProperties["no-multiple-attr-size-gt1"];
                         break;
+                    case "summary":
+                        specialTagProperties = ARIADefinitions.documentConformanceRequirementSpecialTags["summary"];
+                        if (ruleContext.parentElement && ruleContext.parentElement.nodeName.toLowerCase() === 'details' 
+                            && DOMUtil.sameNode([...ruleContext.parentElement.children].filter(elem=>elem.nodeName.toLowerCase() === 'summary')[0], ruleContext))
+                            tagProperty = specialTagProperties["first-summary-of-detail"];
+                        else
+                            tagProperty = specialTagProperties["no-first-summary-of-detail"];
+                        break;
                     case "tbody":
                     case "td":
                     case "tr":

accessibility-checker-engine/test/v2/checker/accessibility/rules/HAAC_Aria_Native_Host_Semantics_ruleunit/ValidRoleSpecifiedMultiple.html

@@ -572,16 +572,16 @@ <h1 id="contents1">Button 1 Label</h1>
             "ruleId": "aria_semantics_role",
             "value": [
               "INFORMATION",
-              "PASS"
+              "FAIL"
             ],
             "path": {
               "dom": "/html[1]/body[1]/ol[1]/li[1]",
               "aria": "/document[1]/document[1]/list[2]/listitem[1]"
             },
-            "reasonId": "Pass_0",
-            "message": "Rule Passed",
+            "reasonId": "Fail_1",
+            "message": "The ARIA role 'tab, separator' is not valid for the element <li>",
             "messageArgs": [
-              "listitem, tab, separator",
+              "tab, separator",
               "li"
             ],
             "apiArgs": [],

accessibility-checker-engine/test/v2/checker/accessibility/rules/HAAC_Aria_Native_Host_Semantics_ruleunit/elementsWithSupportingAttributes.html

@@ -1293,14 +1293,14 @@ <h2 role="heading" aria-label="h2_El" id="h2_El2" aria-level="1"> Heading level
             "ruleId": "aria_semantics_role",
             "value": [
               "INFORMATION",
-              "FAIL"
+              "PASS"
             ],
             "path": {
               "dom": "/html[1]/body[1]/div[1]/li[1]",
               "aria": "/document[1]/generic[1]/region[1]/slider[9]"
             },
-            "reasonId": "Fail_1",
-            "message": "The ARIA role 'slider' is not valid for the element <li>",
+            "reasonId": "Pass_0",
+            "message": "Rule Passed",
             "messageArgs": [
               "slider",
               "li"

accessibility-checker-engine/test/v2/checker/accessibility/rules/aria_hidden_focus_misuse_ruleunit/act_6cfa84_aria_hidden_fail_with_summary_element.html

@@ -57,7 +57,7 @@
                     ],
                     "path": {
                         "dom": "/html[1]/body[1]/details[1]/summary[1]",
-                        "aria": "/document[1]/generic[1]/group[1]/button[1]"
+                        "aria": "/document[1]/generic[1]/group[1]"
                     },
                     "reasonId": "Fail_1",
                     "message": "Element \"summary\" should not be focusable within the subtree of an element with an 'aria-hidden' attribute with value 'true'",