aria-rowcount and aria-rowindex updated to accomodate both - actions …

…and hidden headers

packages/terra-table/src/Table.jsx

@@ -289,20 +289,21 @@ function Table(props) {
   // check if at least one column has a valid action
   // same check is done in DataGrid, but as Table can be a stand-alone component, it can't relay on passed prop.
   const hasColumnHeaderActions = checkForColumnActions(pinnedColumns) || checkForColumnActions(overflowColumns);
+  // eslint-disable-next-line no-nested-ternary
+  const headerRowCount = hasVisibleColumnHeaders ? (hasColumnHeaderActions ? 2 : 1) : 0;
 
   // Calculate total table row count
   const tableSectionReducer = (rowCount, currentSection) => {
     if (currentSection.id !== defaultSectionRef.current) {
       // eslint-disable-next-line no-param-reassign
-      currentSection.sectionRowIndex = rowCount + (hasColumnHeaderActions ? 2 : 1);
+      currentSection.sectionRowIndex = rowCount + 1;
       return rowCount + currentSection.rows.length + 1;
     }
-
     // eslint-disable-next-line no-param-reassign
-    currentSection.sectionRowIndex = rowCount + (hasColumnHeaderActions ? 1 : 0);
+    currentSection.sectionRowIndex = rowCount;
     return rowCount + currentSection.rows.length;
   };
-  const tableRowCount = tableSections.reduce(tableSectionReducer, 1);
+  const tableRowCount = tableSections.reduce(tableSectionReducer, headerRowCount);
 
   // -------------------------------------
   // functions

packages/terra-table/tests/jest/Table.test.jsx

@@ -55,6 +55,12 @@ const tableData = {
   ],
 };
 
+// valid action
+const action = {
+  label: 'Column-action',
+  onClick: jest.fn(),
+};
+
 const tableSectionData = {
   cols: [
     {
@@ -68,6 +74,19 @@ const tableSectionData = {
     { id: 'Column-4', displayName: 'Allergy' },
     { id: 'Column-5', displayName: 'Primary Contact' },
 
+  ],
+  colsWithActions: [
+    {
+      id: 'Column-0', displayName: 'Patient', sortIndicator: 'ascending', isSelectable: true, action,
+    },
+    {
+      id: 'Column-1', displayName: 'Location', isSelectable: true,
+    },
+    { id: 'Column-2', displayName: 'Illness Severity', isSelectable: true },
+    { id: 'Column-3', displayName: 'Visit' },
+    { id: 'Column-4', displayName: 'Allergy' },
+    { id: 'Column-5', displayName: 'Primary Contact' },
+
   ],
   sections: [{
     id: 'section-0',
@@ -363,6 +382,97 @@ describe('Table', () => {
     expect(section2Row1Cell2.props().headers).toBe('test-terra-table-section-1 test-terra-table-rowheader-3 test-terra-table-Column-1');
   });
 
+  it('verifies ARIA rowcount and rowindex attributes for a table with header actions (with sections)', () => {
+    const wrapper = enzymeIntl.mountWithIntl(
+      <Table
+        id="test-terra-table"
+        overflowColumns={tableSectionData.colsWithActions}
+        sections={tableSectionData.sections}
+      />,
+    );
+
+    // Validate table properties
+    const table = wrapper.find('table');
+    expect(table.props()['aria-rowcount']).toBe(8);
+
+    // Retrieve first section
+    const tableSections = wrapper.find(Section);
+    const section1 = tableSections.at(0);
+
+    // Validate section header rowindex was increased by one per actions header
+    const section1HeaderRow = section1.find('.header-row');
+    expect(section1HeaderRow.props()['aria-rowindex']).toBe(3);
+
+    // Validate that aria-rowindexes of the first section were increased by 1 per action row
+    const section1Row1 = section1.find('.row').at(0);
+    expect(section1Row1.props()['aria-rowindex']).toBe(4);
+    expect(section1Row1.props()['data-row-id']).toBe('1');
+    const section1Row2 = section1.find('.row').at(1);
+    expect(section1Row2.props()['aria-rowindex']).toBe(5);
+    expect(section1Row2.props()['data-row-id']).toBe('2');
+
+    // Retrieve second section
+    const section2 = tableSections.at(1);
+
+    // Validate section header rowindex was increased by one per actions header
+    const section2HeaderRow = section2.find('.header-row');
+    expect(section2HeaderRow.props()['aria-rowindex']).toBe(6);
+
+    // Validate that aria-rowindexes of the second section were increased by 1 per action row
+    const section2Row1 = section2.find('.row').at(0);
+    expect(section2Row1.props()['aria-rowindex']).toBe(7);
+    expect(section2Row1.props()['data-row-id']).toBe('3');
+    const section2Row2 = section2.find('.row').at(1);
+    expect(section2Row2.props()['aria-rowindex']).toBe(8);
+    expect(section2Row2.props()['data-row-id']).toBe('4');
+  });
+
+  it('verifies ARIA rowcount and rowindex attributes for a table with hidden headers (with sections)', () => {
+    const wrapper = enzymeIntl.mountWithIntl(
+      <Table
+        id="test-terra-table"
+        overflowColumns={tableSectionData.colsWithActions}
+        sections={tableSectionData.sections}
+        hasVisibleColumnHeaders={false}
+      />,
+    );
+
+    // Validate table properties
+    const table = wrapper.find('table');
+    expect(table.props()['aria-rowcount']).toBe(6);
+
+    // Retrieve first section
+    const tableSections = wrapper.find(Section);
+    const section1 = tableSections.at(0);
+
+    // Validate section header rowindex was decreased by one per hidden header
+    const section1HeaderRow = section1.find('.header-row');
+    expect(section1HeaderRow.props()['aria-rowindex']).toBe(1);
+
+    // Validate that aria-rowindexes of the first section were was decreased by one per hidden header
+    const section1Row1 = section1.find('.row').at(0);
+    expect(section1Row1.props()['aria-rowindex']).toBe(2);
+    expect(section1Row1.props()['data-row-id']).toBe('1');
+    const section1Row2 = section1.find('.row').at(1);
+    expect(section1Row2.props()['aria-rowindex']).toBe(3);
+    expect(section1Row2.props()['data-row-id']).toBe('2');
+
+    // Retrieve second section
+    const section2 = tableSections.at(1);
+
+    // Validate section header rowindex was was decreased by one per hidden header
+    const section2HeaderRow = section2.find('.header-row');
+    expect(section2HeaderRow.props()['aria-rowindex']).toBe(4);
+
+    // Validate that aria-rowindexes of the second section were was decreased by one per hidden header
+    const section2Row1 = section2.find('.row').at(0);
+    expect(section2Row1.props()['aria-rowindex']).toBe(5);
+    expect(section2Row1.props()['data-row-id']).toBe('3');
+    const section2Row2 = section2.find('.row').at(1);
+    expect(section2Row2.props()['aria-rowindex']).toBe(6);
+    expect(section2Row2.props()['data-row-id']).toBe('4');
+  });
+
   it('verifies ARIA attributes for a table without sections', () => {
     const wrapper = enzymeIntl.mountWithIntl(
       <Table
@@ -419,6 +529,71 @@ describe('Table', () => {
     expect(row2Cell2.props().headers).toBe('test-terra-table-rowheader-2 test-terra-table-Column-1');
   });
 
+  it('verifies ARIA rowcount and rowindex attributes for a table with header actions (no sections)', () => {
+    const wrapper = enzymeIntl.mountWithIntl(
+      <Table
+        id="test-terra-table"
+        overflowColumns={tableSectionData.colsWithActions}
+        rows={tableData.rows}
+      />,
+    );
+
+    // Validate aria-rowcount was increased by 1 per action row
+    const table = wrapper.find('table');
+    expect(table.props()['aria-rowcount']).toBe(6);
+
+    // Retrieve first section
+    const tableSections = wrapper.find(Section);
+    const section1 = tableSections.at(0);
+
+    // Validate that aria-rowindexes were increased by 1 per action row
+    const row1 = section1.find('.row').at(0);
+    expect(row1.props()['aria-rowindex']).toBe(3);
+    expect(row1.props()['data-row-id']).toBe('1');
+    const row2 = section1.find('.row').at(1);
+    expect(row2.props()['aria-rowindex']).toBe(4);
+    expect(row2.props()['data-row-id']).toBe('2');
+    const row3 = section1.find('.row').at(2);
+    expect(row3.props()['aria-rowindex']).toBe(5);
+    expect(row3.props()['data-row-id']).toBe('3');
+    const row4 = section1.find('.row').at(3);
+    expect(row4.props()['aria-rowindex']).toBe(6);
+    expect(row4.props()['data-row-id']).toBe('4');
+  });
+
+  it('verifies ARIA rowcount and rowindex attributes for a table with hidden headers (no sections)', () => {
+    const wrapper = enzymeIntl.mountWithIntl(
+      <Table
+        id="test-terra-table"
+        overflowColumns={tableSectionData.colsWithActions}
+        rows={tableData.rows}
+        hasVisibleColumnHeaders={false}
+      />,
+    );
+
+    // Validate aria-rowcount was decreased by one per hidden header
+    const table = wrapper.find('table');
+    expect(table.props()['aria-rowcount']).toBe(4);
+
+    // Retrieve first section
+    const tableSections = wrapper.find(Section);
+    const section1 = tableSections.at(0);
+
+    // Validate that aria-rowindexes were decreased by one per hidden header
+    const row1 = section1.find('.row').at(0);
+    expect(row1.props()['aria-rowindex']).toBe(1);
+    expect(row1.props()['data-row-id']).toBe('1');
+    const row2 = section1.find('.row').at(1);
+    expect(row2.props()['aria-rowindex']).toBe(2);
+    expect(row2.props()['data-row-id']).toBe('2');
+    const row3 = section1.find('.row').at(2);
+    expect(row3.props()['aria-rowindex']).toBe(3);
+    expect(row3.props()['data-row-id']).toBe('3');
+    const row4 = section1.find('.row').at(3);
+    expect(row4.props()['aria-rowindex']).toBe(4);
+    expect(row4.props()['data-row-id']).toBe('4');
+  });
+
   it('verifies row selection column header not selectable without callback', () => {
     const mockColumnSelect = jest.fn();