Notice: This is a work in progress. Please submit feedback or suggestions.

Test: aria-colcount attribute

Screen Reader support level: partial (7/22)

Voice Control support level: unknown

On this page

About this test

aria-colcount tests

Run this test and submit your results

Age of results

Results in this test range from 7 months ago to 7 months ago. See detailed information about test dates and versions for more information.

Failing and partial results are between 7 months ago and 7 months ago.

Test HTML

open the test page

HTML source is too long to display here.

Summary of Screen Reader support by expectation

* means that some support is hidden behind settings

Summary of Voice Control support by expectation

aria-colcount attribute
ExpectationDragon Naturally SpeakingVoice Access (Android)Voice Control (iOS)Voice Control (MacOS)Windows Speech Recognition
ChromeChromeSafariSafariChrome
Not applicable

* means that some support is hidden behind settings

Detailed support results by expectation

Expectation for the aria-colcount attribute: convey the total column count when some columns are hidden

This expectation is from the aria-colcount attribute feature.

Rationale:

The user needs to know how many columns are in the whole grid / table when some columns are hidden

Strength of this expectation for different types of assistive technologies:

  • Screen Readers: MUST
  • Voice Control: NA

Grading method:

Just one of the listed commands must pass for the expectation to pass.

ATBrowserHas SupportOutput
Dragon Naturally SpeakingChromenot applicable-
JAWSChromeyes
  • Result: (pass)
    • Test Case: Use Down arrow (Read next item) to navigate forward to `#table1`
      1. Launch JAWS and Chrome.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table1
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: Down arrow (Read next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Table with 4 of 6 columns and 6 of 6 rows"
JAWSEdgeyes
  • Result: (pass)
    • Test Case: Use Down arrow (Read next item) to navigate forward to `#table1`
      1. Launch JAWS and Edge.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table1
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: Down arrow (Read next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Table with 4 of 6 columns and 6 of 6 rows"
JAWSFirefoxyes
  • Result: (pass)
    • Test Case: Use Down arrow (Read next item) to navigate forward to `#table1`
      1. Launch JAWS and Firefox.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table1
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: Down arrow (Read next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Table with 4 of 6 columns and 6 of 6 rows"
NarratorEdgeyes
  • Result: (pass)
    • Test Case: Use Narrator + right arrow (Read next item (scan mode)) to navigate forward to `#table1`
      1. Launch Narrator and Edge.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table1
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: Narrator + right arrow (Read next item (scan mode))
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Enter table Table 1, 6 by 6, Date"
NVDAChromeyes
  • Result: (pass)
    • Test Case: Use down arrow (Read next item) to navigate forward to `#table1`
      1. Launch NVDA and Chrome.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table1
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: down arrow (Read next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Table with 6 rows and 6 columns, Table 1"
NVDAEdgeyes
  • Result: (pass)
    • Test Case: Use down arrow (Read next item) to navigate forward to `#table1`
      1. Launch NVDA and Edge.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table1
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: down arrow (Read next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Table with 6 rows and 6 columns, Table 1"
NVDAFirefoxyes
  • Result: (pass)
    • Test Case: Use down arrow (Read next item) to navigate forward to `#table1`
      1. Launch NVDA and Firefox.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table1
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: down arrow (Read next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Table with 6 rows and 6 columns, Table 1"
OrcaFirefoxunknown-
TalkBackChromenone
  • Result: (fail)
    • Test Case: Use Swipe right (or alt+right arrow) (Read next item) to navigate forward to `#table1`
      1. Launch TalkBack and Chrome.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table1
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: Swipe right (or alt+right arrow) (Read next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Date, column header, Row 1, In table Table 1, 6 rows 4 columns"
Voice Access (Android)Chromenot applicable-
Voice Control (iOS)Safarinot applicable-
Voice Control (MacOS)Safarinot applicable-
VoiceOver (iOS)Safarinone
  • Result: (fail)
    • Test Case: Use Swipe Right (Next item) to navigate forward to `#table1`
      1. Launch VoiceOver (iOS) and Safari.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table1
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: Swipe Right (Next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Table 1, Date, Row header, Column header, Row 1, Column 1, Table start, 6 rows, 4 columns"
VoiceOver (macOS)Safarinone
  • Result: (fail)
    • Test Case: Use VO + Right arrow (Read next item) to navigate forward to `#table1`
      1. Launch VoiceOver (macOS) and Safari.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table1
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: VO + Right arrow (Read next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Table 1, table 4 columns, 6 rows"
Windows Speech RecognitionChromenot applicable-

Extended Support for: aria-colcount attribute: convey the total column count when some columns are hidden

These are less common combinations

ATBrowserHas SupportOutput
Dragon Naturally SpeakingIEnot applicable-
Dragon Naturally SpeakingFirefoxnot applicable-
JAWSIEunknown-
NarratorFirefoxunknown-
NarratorChromeunknown-
NarratorIEunknown-
NVDAIEunknown-
TalkBackFirefoxunknown-
Voice Access (Android)Firefoxnot applicable-
VoiceOver (iOS)Chromeunknown-
VoiceOver (macOS)Chromeunknown-
VoiceOver (macOS)Firefoxunknown-
OrcaChromeunknown-
Voice Control (MacOS)Chromenot applicable-
Voice Control (MacOS)Firefoxnot applicable-
Windows Speech RecognitionEdgenot applicable-
Back to top

Expectation for the aria-colcount attribute: convey a column count when total column count is unknown

This expectation is from the aria-colcount attribute feature.

Rationale:

Screen readers should not attempt to calculate the column count when it is unknown

Strength of this expectation for different types of assistive technologies:

  • Screen Readers: MUST NOT
  • Voice Control: NA

Grading method:

Just one of the listed commands must pass for the expectation to pass.

Notes:

ARIA 1.1 spec: "If the total number of columns is unknown, authors MUST set the value of aria-colcount to -1 to indicate that the value should not be calculated by the user agent."

ATBrowserHas SupportOutput
Dragon Naturally SpeakingChromenot applicable-
JAWSChromenone
  • Result: (fail)
    • Test Case: Use Down arrow (Read next item) to navigate forward to `#table2`
      1. Launch JAWS and Chrome.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table2
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: Down arrow (Read next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Table with 4 of minus 1 columns and 6 of 6 rows"
JAWSEdgenone
  • Result: (fail)
    • Test Case: Use Down arrow (Read next item) to navigate forward to `#table2`
      1. Launch JAWS and Edge.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table2
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: Down arrow (Read next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Table with 4 of minus 1 columns and 6 of 6 rows"
JAWSFirefoxnone
  • Result: (fail)
    • Test Case: Use Down arrow (Read next item) to navigate forward to `#table2`
      1. Launch JAWS and Firefox.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table2
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: Down arrow (Read next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Table with 4 columns and 6 rows"
NarratorEdgenone
  • Result: (fail)
    • Test Case: Use Narrator + right arrow (Read next item (scan mode)) to navigate forward to `#table2`
      1. Launch Narrator and Edge.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table2
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: Narrator + right arrow (Read next item (scan mode))
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Enter table Table 2, 6 by zero, Date"
NVDAChromenone
  • Result: (fail)
    • Test Case: Use down arrow (Read next item) to navigate forward to `#table2`
      1. Launch NVDA and Chrome.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table2
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: down arrow (Read next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Table with 6 rows and minus 1 columns, Table 2"
NVDAEdgenone
  • Result: (fail)
    • Test Case: Use down arrow (Read next item) to navigate forward to `#table2`
      1. Launch NVDA and Edge.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table2
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: down arrow (Read next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Table with 6 rows and minus 1 columns, Table 2"
NVDAFirefoxnone
  • Result: (fail)
    • Test Case: Use down arrow (Read next item) to navigate forward to `#table2`
      1. Launch NVDA and Firefox.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table2
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: down arrow (Read next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Table with 6 rows and minus 1 columns, Table 2"
OrcaFirefoxunknown-
TalkBackChromenone
  • Result: (fail)
    • Test Case: Use Swipe right (or alt+right arrow) (Read next item) to navigate forward to `#table2`
      1. Launch TalkBack and Chrome.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table2
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: Swipe right (or alt+right arrow) (Read next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Date, column header, Row 1, In table Table 2, 6 rows 4 columns"
Voice Access (Android)Chromenot applicable-
Voice Control (iOS)Safarinot applicable-
Voice Control (MacOS)Safarinot applicable-
VoiceOver (iOS)Safarinone
  • Result: (fail)
    • Test Case: Use Swipe Right (Next item) to navigate forward to `#table2`
      1. Launch VoiceOver (iOS) and Safari.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table2
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: Swipe Right (Next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Table 2, Date, Row header, Column header, Row 1, Column 1, Table start, 6 rows 4 columns"
VoiceOver (macOS)Safarinone
  • Result: (fail)
    • Test Case: Use VO + Right arrow (Read next item) to navigate forward to `#table2`
      1. Launch VoiceOver (macOS) and Safari.
      2. Navigate to the test page.
      3. Find the target element(s) that you will test against. Identify all elements that match this selector:#table2
        • If multiple elements match the selector, repeat this test for all instances. However, choose a single instance to report against. If you feel that the selector should be more specific, please open a GitHub Issue.
      4. Position and configure the screen reader so that the following conditions are met
        • Virtual focus is: before target
        • Keyboard focus is: before target
        • Mode is: auto (do not explicitly change the mode)
      5. Issue the command: VO + Right arrow (Read next item)
        • After issuing the command, virtual focus should be: target
      6. Record results for the relevant expectations
    • Output: "Table 2, table 4 columns, 6 rows"
Windows Speech RecognitionChromenot applicable-

Extended Support for: aria-colcount attribute: convey a column count when total column count is unknown

These are less common combinations

ATBrowserHas SupportOutput
Dragon Naturally SpeakingIEnot applicable-
Dragon Naturally SpeakingFirefoxnot applicable-
JAWSIEunknown-
NarratorFirefoxunknown-
NarratorChromeunknown-
NarratorIEunknown-
NVDAIEunknown-
TalkBackFirefoxunknown-
Voice Access (Android)Firefoxnot applicable-
VoiceOver (iOS)Chromeunknown-
VoiceOver (macOS)Chromeunknown-
VoiceOver (macOS)Firefoxunknown-
OrcaChromeunknown-
Voice Control (MacOS)Chromenot applicable-
Voice Control (MacOS)Firefoxnot applicable-
Windows Speech RecognitionEdgenot applicable-
Back to top

Dates and Versions of tested combinations

ATAT VersionBrowserBrowser versionOS versionDate tested
JAWS2022.2110.36Chrome9621H12021-12-02
JAWS2022.2110.36Edge9621H12021-12-02
JAWS2022.2110.36Firefox9421H12021-12-02
Narrator21H1Edge9621H12021-11-29
NVDA2021.2Chrome9621H12021-11-29
NVDA2021.2Edge9621H12021-11-29
NVDA2021.2Firefox9421H12021-11-29
TalkBack12.1Chrome96112021-12-02
VoiceOver (iOS)14.8.1Safari14.8.114.8.12021-11-29
VoiceOver (macOS)11.6.1Safari11.6.111.6.12021-12-02

History

  • 2021-12-02 Test created