update the rule for table header check #1472

IBMa · Aug 16, 2023 · 81d7809 · 81d7809
1 parent e220825
commit 81d7809
Show file tree

Hide file tree

Showing 6 changed files with 134 additions and 9 deletions.
diff --git a/accessibility-checker-engine/src/v2/checker/accessibility/util/legacy.ts b/accessibility-checker-engine/src/v2/checker/accessibility/util/legacy.ts
@@ -1108,24 +1108,36 @@ export class RPTUtil {
     // Return true if a table's header is in the first row or column
     public static isTableHeaderInFirstRowOrColumn(ruleContext) {
 
-        let passed = false;
+        let passed = true;
         let rows = ruleContext.rows;
 
         if (rows != null && rows.length > 0) {
             let firstRow = rows[0];
             // Check if the cells with data in the first row are all TH's
-            passed = firstRow.cells.length > 0 && RPTUtil.getChildByTagHidden(firstRow, "td", false, true).length === 0;
+            //passed = firstRow.cells.length > 0 && RPTUtil.getChildByTagHidden(firstRow, "td", false, true).length === 0;
+            if (!firstRow.cells)
+                passed = false;
+            else  {   
+                for (let c=0; passed && c < firstRow.cells.length; c++) {
+                    let cell = firstRow.cells[c];
+                    passed = !VisUtil.isNodeVisible(cell) || (cell.innerHTML.trim().length > 0 && cell.nodeName.toLowerCase() === 'th');          
+                }
+            }    
+
             // If the first row isn't a header row, try the first column
             if (!passed) {
-                // Assume that the first column has all TH's unless we find a TD in the first column.
+                // Assume that the first column has all TH's or a TD without data in the first column.
                 passed = true;
                 for (let i = 0; passed && i < rows.length; ++i) {
-                    // If no cells in this row, that's okay too.
+                    // ignore the rows from tfoot
+                    if (rows[i].parentNode && rows[i].parentNode.nodeName.toLowerCase() === 'tfoot') continue;
+                    // If no cells in this row, or no data at all, that's okay too.
                     passed = !rows[i].cells ||
                         rows[i].cells.length === 0 ||
+                        rows[i].cells[0].innerHTML.trim().length === 0 ||
                         rows[i].cells[0].nodeName.toLowerCase() != "td";
                 }
-            }
+            } 
             if (!passed) {
                 // Special case - both first row and first column are headers, but they did not use
                 // a th for the upper-left cell

diff --git a/...est/v2/checker/accessibility/rules/table_headers_exists_ruleunit/table_column_headers.htm b/...est/v2/checker/accessibility/rules/table_headers_exists_ruleunit/table_column_headers.htm
@@ -21,7 +21,7 @@
 <META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
 <title>Data table is missing one row header</title>
 <style type="text/css">
-  #vertical-1 thead,#vertical-1 tbody, th, td {
+  #vertical-1 thead,#vertical-1 tbody, th, td, tfoot {
       border: 1px solid black;
   }
 </style>
@@ -41,6 +41,11 @@
         <th>Header 2</th>
         <td>data</td><td>data</td><td>data</td>
     </tr>
+    <tfoot>
+      <tr>
+          <td colspan="3">Footer</td>
+      </tr>
+  </tfoot>
 </table>
 <script>
   UnitTest = {

diff --git a/...v2/checker/accessibility/rules/table_headers_exists_ruleunit/table_column_headers_css.htm b/...v2/checker/accessibility/rules/table_headers_exists_ruleunit/table_column_headers_css.htm
@@ -66,6 +66,28 @@
       </tr>
   </tfoot>
 </table>
-
+<script>
+    UnitTest = {
+        ruleIds: ["table_headers_exists"],
+        results: [
+        {
+            "ruleId": "table_headers_exists",
+            "value": [
+              "INFORMATION",
+              "PASS"
+            ],
+            "path": {
+              "dom": "/html[1]/body[1]/table[1]",
+              "aria": "/document[1]/table[1]"
+            },
+            "reasonId": "Pass_0",
+            "message": "Rule Passed",
+            "messageArgs": [],
+            "apiArgs": [],
+            "category": "Accessibility"
+          }
+        ]
+    };
+  </script>  
 </body>
 </html>
diff --git a/..._exists_ruleunit/table_double_headers.htm → ...exists_ruleunit/table_double_headers1.htm b/..._exists_ruleunit/table_double_headers.htm → ...exists_ruleunit/table_double_headers1.htm
diff --git a/...st/v2/checker/accessibility/rules/table_headers_exists_ruleunit/table_double_headers2.htm b/...st/v2/checker/accessibility/rules/table_headers_exists_ruleunit/table_double_headers2.htm
@@ -0,0 +1,70 @@
+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html>
+<!--
+   /******************************************************************************
+     Copyright:: 2020- IBM, Inc
+
+    Licensed under the Apache License, Version 2.0 (the "License");
+    you may not use this file except in compliance with the License.
+    You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+    Unless required by applicable law or agreed to in writing, software
+    distributed under the License is distributed on an "AS IS" BASIS,
+    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+    See the License for the specific language governing permissions and
+    limitations under the License.
+  *****************************************************************************/
+-->
+
+<head>
+<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
+<title>Data table is missing one row header</title>
+</head>
+<body>
+  <table>
+    <caption>
+      Council budget (in £) 2018
+    </caption>
+    <thead>
+      <tr>
+        <th scope="col">Items</th>
+        <th scope="col">Expenditure</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr>
+        <th scope="row">Donuts</th>
+        <td>3,000</td>
+      </tr>
+      <tr>
+        <th scope="row">Stationery</th>
+        <td>18,000</td>
+      </tr>
+    </tbody>
+  </table>
+    <script>
+        UnitTest = {
+            ruleIds: ["table_headers_exists"],
+            results: [
+            {
+            "ruleId": "table_headers_exists",
+            "value": [
+              "INFORMATION",
+              "PASS"
+            ],
+            "path": {
+              "dom": "/html[1]/body[1]/table[1]",
+              "aria": "/document[1]/table[1]"
+            },
+            "reasonId": "Pass_0",
+            "message": "Rule Passed",
+            "messageArgs": [],
+            "apiArgs": [],
+            "category": "Accessibility"
+          }
+            ]
+        };
+      </script> 
+</body>
+</html>
diff --git a/...exists_ruleunit/table_mutiple_headers.htm → ...xists_ruleunit/table_multiple_headers.htm b/...exists_ruleunit/table_mutiple_headers.htm → ...xists_ruleunit/table_multiple_headers.htm
@@ -25,7 +25,8 @@
     <div class="op--relationship-heatmap-field">
       <table class="op--heatmap">
         <caption> Complext data table with column headers in first two cells and bottom headers</caption>
-        <tbody><tr class="op--heatmap-row">
+        <tbody>
+        <tr class="op--heatmap-row">
           <th scope="col" rowspan="6" class="op--heatmap-overall-y-label">
             <span>Importance to Stakeholders</span>
           </th>
@@ -255,7 +256,22 @@
       UnitTest = {
           ruleIds: ["table_headers_exists"],
           results: [
-
+          {
+            "ruleId": "table_headers_exists",
+            "value": [
+              "INFORMATION",
+              "PASS"
+            ],
+            "path": {
+              "dom": "/html[1]/body[1]/div[1]/table[1]",
+              "aria": "/document[1]/table[1]"
+            },
+            "reasonId": "Pass_0",
+            "message": "Rule Passed",
+            "messageArgs": [],
+            "apiArgs": [],
+            "category": "Accessibility"
+          }
           ]
       };
     </script>