List: Table headers not programmatically defined

XMLWordPrintable

    • Severity 3 - Minor
    • Accessibility

      Issue Summary

      The table headers are not programmatically defined.

      Steps to Reproduce

      1. Open the Jira Cloud homepage.
      2. In the Sidebar navigation section, locate the Spaces control, expand it, and open any Space.
      3. Navigate to the "List" link and activate it.
      4. Using a screen reader, navigate to the data table in the main content area.
        1. Windows (JAWS / NVDA): Press T to move to the next table
        2. macOS (VoiceOver): Press Ctrl + Option + Command + T to move to the next table
      5. Attempt to navigate within the table structure:
        1. Windows (JAWS / NVDA):
          1. Press Ctrl + Alt + Arrow keys to move between rows and columns
          2. Press Ctrl + Alt + Home/End to move to the first or last cell
        2. macOS (VoiceOver):
          1. Press Ctrl + Option + Shift + Down Arrow to interact with the table
          2. Use Ctrl + Option + Right/Left Arrow to move between columns
          3. Use Ctrl + Option + Up/Down Arrow to move between rows
      6. Observe that the table headers are not programmatically defined.

      Screenshot

      Screen Recording

      Table Headers Issue.mov

      Actual Results

      On the "List" page, the table headers of the “Work items in SR” table are not programmatically identified as column headers. This occurs due to an incorrect ARIA implementation of the table/grid. Specifically, the column header cells are coded with role="gridcell" instead of role="columnheader". Additionally, the header row is placed at the end of the table in the DOM order rather than before the data rows. As a result, screen reader users have difficulty understanding the table structure and correctly associating column headers with their respective data cells.

      Expected Results

      Table headers should be programmatically identified so that screen readers can associate them with their corresponding data for users.

      Apply the following changes:

      • Replace role="gridcell" with role="columnheader" for <div> elements containing all header cells.
      • Ensure the header row appears at the beginning of the table in the DOM order, before all data rows.

      For guidance on creating an accessible data grid, refer to the Accessible Data Grid Example.

      Workaround

      Currently there is no known workaround for this behavior. A workaround will be added here when available

      Environment

      MacBook Pro (16-inch, 2021)
      macOS Tahoe 26.1
      Operations - Windows11
      Chrome - Version 143.0.7499.170 (Official Build) (64-bit)
      Safari- Version 26.1
      JAWS- Version 2023
      NVDA- Version 2025.3
      VoiceOver - Version Latest

        1. Screenshot 2025-12-29 at 6.04.46 PM.png
          680 kB
          Anusooya .
        2. Table Headers Issue.mov
          15.35 MB
          Chirag Goyal

            Assignee:
            Unassigned
            Reporter:
            Chirag Goyal
            Votes:
            0 Vote for this issue
            Watchers:
            1 Start watching this issue

              Created:
              Updated: