Create new page | mention: Dynamically updating results are inappropriately communicated to assistive technologies

XMLWordPrintable

    Issue Summary

    The dynamically updating results is not communicated to the users of assistive technologies on accessing “@mentions” functionality. 

    Steps to Reproduce

    1. Navigate to "Create" button present in header section.
    2. After activating "Create" blank page template will appear on the screen.
    3. Navigate to the "Insert more content" button and activate it.
    4. Select the "User mention" option among them.
    5. Type "@" mentions in the "Rich text area".
    6. Start typing any name and check it.
    7. Observe that few suggestions has been available below which are not accessible for the screen reader users.

    Screenshot

    Actual Results

    On typing any character in the main content area preceded by an “@” symbol, the number of search results are not communicated. As well, this component cannot be adjusted with a keyboard, such as Up and Down arrow keys these options gets closed on interaction. This strange behaviour might mislead or confuse keyboard only and assistive technology users.

    Expected Results

    Status messages must be programmatically determined. To achieve this, use a polite live region, such as role=”status” and aria-atomic=”true” to ensure that the entire text node containing the number of results is always announced.

    Make sure that this component can be controlled with a keyboard. In this scenario, we would recommend you to modify this component in a manner such that users can use Up and Down Arrow keys to navigate amongst the options. They can then press Enter or Return key to select a particular option. Make sure that this instruction is included within the live region along with the number of search results.

    Code Snippet

    <span role="status" aria-atomic="true">10 results found. Use Up and Down arrow keys to navigate amongst the options. Press Enter to select an option.</span>

    Workaround

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

    Environment

    MacBook Pro (16-inch, 2019)
    macOS Ventura Version 13.3.1
    Chrome - Version 114.0.5735.198 (Official Build) (x86_64)
    Firefox- Version 112.0.1 (64-bit)
    Safari- Version 16.4 (18615.1.26.11.23)
    JAWS- Version 2022
    NVDA- Version 2020.3
    Voiceover - Version Latest

          Assignee:
          Judy Lim
          Reporter:
          Varsha Bansode (Inactive)
          Votes:
          0 Vote for this issue
          Watchers:
          4 Start watching this issue

            Created:
            Updated:
            Resolved: