refactor isNodeVisible function #1974

IBMa · Sep 24, 2024 · 9d1c9a6 · 9d1c9a6
1 parent 6bf3ebd
commit 9d1c9a6
Show file tree

Hide file tree

Showing 6 changed files with 20 additions and 49 deletions.
diff --git a/accessibility-checker-engine/src/v2/aria/ARIAMapper.ts b/accessibility-checker-engine/src/v2/aria/ARIAMapper.ts
@@ -19,6 +19,7 @@ import { CommonMapper } from "../common/CommonMapper";
 import { DOMUtil } from "../dom/DOMUtil";
 import { CommonUtil } from "../../v4/util/CommonUtil";
 import { AriaUtil } from "../../v4/util/AriaUtil";
+import { VisUtil } from "../../v4/util/VisUtil";
 import { FragmentUtil } from "../checker/accessibility/util/fragment";
 import { IMapResult } from "../../v4/api/IMapper";
 import { ARIAWalker } from "./ARIAWalker";
@@ -419,7 +420,7 @@ export class ARIAMapper extends CommonMapper {
         // See https://www.w3.org/TR/html-aam-1.0/#input-type-text-input-type-password-input-type-search-input-type-tel-input-type-url-and-textarea-element
 
         // 2a. Only show hidden content if it's referenced by a labelledby
-        if (!labelledbyTraverse && !DOMWalker.isNodeVisible(cur)) {
+        if (!labelledbyTraverse && !VisUtil.isNodeVisible(cur)) {
             return "";
         }
 

diff --git a/accessibility-checker-engine/src/v2/aria/ARIAWalker.ts b/accessibility-checker-engine/src/v2/aria/ARIAWalker.ts
@@ -15,8 +15,8 @@
  *****************************************************************************/
 
 import { FragmentUtil } from "../checker/accessibility/util/fragment";
-import { DOMWalker } from "../dom/DOMWalker";
 import { ARIAMapper } from "./ARIAMapper";
+import { VisUtil } from "../../v4/util/VisUtil";
 
 /**
  * Walks in an ARIA order
@@ -59,15 +59,15 @@ export class ARIAWalker {
                 let slotElement = (this.node as HTMLSlotElement)
                 if (this.node.nodeType === 1 /* Node.ELEMENT_NODE */ 
                     && this.node.nodeName.toUpperCase() === "IFRAME"
-                    && DOMWalker.isNodeVisible(iframeNode)
+                    && VisUtil.isNodeVisible(iframeNode)
                     && iframeNode.contentDocument
                     && iframeNode.contentDocument.documentElement)
                 {
                     let ownerElement = this.node;
                     this.node = iframeNode.contentDocument.documentElement;
                     (this.node as any).ownerElement = ownerElement;
                 } else if (this.node.nodeType === 1 /* Node.ELEMENT_NODE */ 
-                    && DOMWalker.isNodeVisible(elementNode)
+                    && VisUtil.isNodeVisible(elementNode)
                     && elementNode.shadowRoot
                     && elementNode.shadowRoot.firstChild)
                 {
@@ -152,15 +152,15 @@ export class ARIAWalker {
                 let elementNode = (this.node as HTMLElement);
                 if (this.node.nodeType === 1 /* Node.ELEMENT_NODE */ 
                     && this.node.nodeName.toUpperCase() === "IFRAME"
-                    && DOMWalker.isNodeVisible(iframeNode)
+                    && VisUtil.isNodeVisible(iframeNode)
                     && iframeNode.contentDocument
                     && iframeNode.contentDocument.documentElement) 
                 {
                     let ownerElement = this.node;
                     this.node = iframeNode.contentDocument.documentElement;
                     (this.node as any).ownerElement = ownerElement;
                 } else if (this.node.nodeType === 1 /* Node.ELEMENT_NODE */ 
-                    && DOMWalker.isNodeVisible(elementNode)
+                    && VisUtil.isNodeVisible(elementNode)
                     && elementNode.shadowRoot
                     && elementNode.shadowRoot.lastChild) 
                 {

diff --git a/accessibility-checker-engine/src/v2/common/Engine.ts b/accessibility-checker-engine/src/v2/common/Engine.ts
@@ -24,6 +24,7 @@ import { Issue, Rule, RuleContext, RuleContextHierarchy, RuleResult, eRuleConfid
 import { HelpMap, IEngine, NlsMap } from "../../v4/api/IEngine";
 import { IMapper } from "../../v4/api/IMapper";
 import { Report } from "../../v4/api/IReport";
+import { VisUtil } from "../../v4/util/VisUtil";
 
 class WrappedRule {
     ns: string;
@@ -195,9 +196,9 @@ export class Engine implements IEngine {
                     contextHierarchies[namespace] = this.mappers[namespace].closeScope(walker.node);
                 }
             }
-
+            
             if (walker.node.nodeType !== 11 
-                && (DOMWalker.isNodeVisible(walker.node)
+                && (VisUtil.isNodeVisible(walker.node)
                     // || walker.node.nodeName.toLowerCase() === "head"
                     || walker.node.nodeName.toLowerCase() === "meta"
                     || walker.node.nodeName.toLowerCase() === "style"

diff --git a/accessibility-checker-engine/src/v2/dom/DOMWalker.ts b/accessibility-checker-engine/src/v2/dom/DOMWalker.ts
@@ -14,6 +14,7 @@
     limitations under the License.
  *****************************************************************************/
 
+import { VisUtil } from "../../v4/util/VisUtil";
 /**
  * Walks in a DOM order
  * 
@@ -112,15 +113,15 @@ export class DOMWalker {
                 let slotElement = (this.node as HTMLSlotElement)
                 if (this.node.nodeType === 1 /* Node.ELEMENT_NODE */ 
                     && this.node.nodeName.toUpperCase() === "IFRAME"
-                    && (this.considerHidden ? DOMWalker.isNodeVisible(iframeNode) : true)
+                    && (this.considerHidden ? VisUtil.isNodeVisible(iframeNode) : true)
                     && iframeNode.contentDocument
                     && iframeNode.contentDocument.documentElement)
                 {
                     let ownerElement = this.node;
                     this.node = iframeNode.contentDocument.documentElement;
                     (this.node as any).ownerElement = ownerElement;
                 } else if (this.node.nodeType === 1 /* Node.ELEMENT_NODE */ 
-                    && (this.considerHidden ? DOMWalker.isNodeVisible(elementNode) : true)
+                    && (this.considerHidden ? VisUtil.isNodeVisible(elementNode) : true)
                     && elementNode.shadowRoot
                     && elementNode.shadowRoot.firstChild)
                 {
@@ -186,15 +187,15 @@ export class DOMWalker {
                 let elementNode = (this.node as HTMLElement);
                 if (this.node.nodeType === 1 /* Node.ELEMENT_NODE */ 
                     && this.node.nodeName.toUpperCase() === "IFRAME"
-                    && (this.considerHidden ? DOMWalker.isNodeVisible(iframeNode) : true)
+                    && (this.considerHidden ? VisUtil.isNodeVisible(iframeNode) : true)
                     && iframeNode.contentDocument
                     && iframeNode.contentDocument.documentElement) 
                 {
                     let ownerElement = this.node;
                     this.node = iframeNode.contentDocument.documentElement;
                     (this.node as any).ownerElement = ownerElement;
                 } else if (this.node.nodeType === 1 /* Node.ELEMENT_NODE */ 
-                    && (this.considerHidden ? DOMWalker.isNodeVisible(elementNode) : true)
+                    && (this.considerHidden ? VisUtil.isNodeVisible(elementNode) : true)
                     && elementNode.shadowRoot
                     && elementNode.shadowRoot.lastChild) 
                 {

diff --git a/accessibility-checker-engine/src/v4/util/VisUtil.ts b/accessibility-checker-engine/src/v4/util/VisUtil.ts
@@ -110,8 +110,10 @@ export class VisUtil {
         //            mark this element as visible at all times.
         //  style --> style elements have display: none by default, but the actually CSS script is still executed so we have to
         //            mark this element as visible at all times.
+        // datalist --> In the rendering, the datalist element represents nothing and it, along with its children, should be hidden.
         if (VisUtil.hiddenByDefaultElements != null && VisUtil.hiddenByDefaultElements != undefined && VisUtil.hiddenByDefaultElements.indexOf(nodeName) > -1) {
-            return true;
+            //return true;
+            return false;
         }
 
         // Check if this node is visible, we check couple of CSS properties and hidden attribute.
@@ -181,7 +183,7 @@ export class VisUtil {
                 return false;
             }
 
-            // check content-visibility: if the content-visibility is hiddenthen, return false as the element is not visible
+            // check content-visibility: if the content-visibility is hidden, then, return false as the element is not visible
             if (VisUtil.isContentHidden(node)) {
                 CacheUtil.setCache(node, "PT_NODE_HIDDEN", true);
                 return false;

diff --git a/...ine/test/v2/checker/accessibility/rules/aria_attribute_conflict_ruleunit/aria-hidden.html b/...ine/test/v2/checker/accessibility/rules/aria_attribute_conflict_ruleunit/aria-hidden.html
@@ -39,41 +39,7 @@
         UnitTest = {
           ruleIds: ["aria_attribute_conflict", "aria_attribute_redundant"],
 		  results: [
-		  {
-            "ruleId": "aria_attribute_conflict",
-            "value": [
-              "INFORMATION",
-              "FAIL"
-            ],
-            "path": {
-              "dom": "/html[1]/body[1]/div[7]",
-              "aria": "/document[1]/generic[7]"
-            },
-            "reasonId": "fail_conflict",
-            "message": "The ARIA attribute \"aria-hidden\" is in conflict with the corresponding HTML attribute \"hidden\"",
-            "messageArgs": [
-              "aria-hidden",
-              "hidden"
-            ],
-            "apiArgs": [],
-            "category": "Accessibility"
-          },
-          {
-            "ruleId": "aria_attribute_redundant",
-            "value": [
-              "INFORMATION",
-              "PASS"
-            ],
-            "path": {
-              "dom": "/html[1]/body[1]/div[8]",
-              "aria": "/document[1]/generic[8]"
-            },
-            "reasonId": "pass",
-            "message": "The ARIA attribute is not redundant with a corresponding HTML attribute",
-            "messageArgs": [],
-            "apiArgs": [],
-            "category": "Accessibility"
-          }	
+
         ]
         };
       </script>