Uploaded image for project: 'Jira Service Management Data Center'
  1. Jira Service Management Data Center
  2. JSDSERVER-11493

Search Result selection (select any of the options from the search results) : Combobox: Combobox is missing appropriate roles and/or attributes

XMLWordPrintable

      Issue Description

      Missing role combo box for "All Actors" input field, as a result, screen reader users will find it difficult to understand the functionality of the input field.

      Steps to Reproduce

      1. Navigate to the following link: https://instenv-19536-ipiz.instenv.internal.atlassian.com/secure/insight/assets/IOPITSM-139?v=3
      2. Using the TAB key, navigate to the tabs such as attributes, connected tickets etc. and select "HISTORY".
      3. With the 'history' tab selected, navigate to the "ALL ACTORS'  combo box.
      4. With the screen reader on, the role of combobox is missing can be observed.

      Screen recording

      9442BAFA-113A-408E-87F9-4AC220F9AE52_2_0_a.mov

      Screenshot

      Actual Behaviour

      When users navigate to "ALL ACTORS" the input field role as combo box is not conveyed by the screen reader. As a result, the screen reader user will find it difficult to understand the purpose of the input field. When an appropriate role is announced for screen reader users, they can perform the associated functionality more efficiently.

      Expected Result

      When users navigate to "ALL ACTORS" input field, role combo box should be announced by the screen reader. In order to implement the same effectively, make sure to provide role="combobox".

      Refer to the following snippet for Combobox implementation:

      <div class="ruiSelect__input" style="display: inline-block;">
<input autocapitalize="none" role="combobox" autocomplete="off" autocorrect="off" id="react-select-2-input" spellcheck="false" tabindex="0" type="text" aria-autocomplete="list" value="" style="box-sizing: content-box; width: 2px; background: 0px center; border: 0px; font-size: inherit; opacity: 1; outline: 0px; padding: 0px; color: inherit;">
<div style="...">
</div>
</div>

      Workaround

      Not available

      Bug Ref: 747995

      Bulldog Ref: JSMDC-13210

        1. 9442BAFA-113A-408E-87F9-4AC220F9AE52_2_0_a.mov
          6.27 MB
        2. Screen Recording 2023-04-27 at 4.10.03 PM.mov
          18.25 MB
        3. Screenshot 2022-05-23 at 12.34.10 PM.png
          Screenshot 2022-05-23 at 12.34.10 PM.png
          507 kB
        4. Screenshot 2023-02-20 at 19.58.33.png
          Screenshot 2023-02-20 at 19.58.33.png
          792 kB
        5. Screenshot 2023-02-21 at 08.47.54.png
          Screenshot 2023-02-21 at 08.47.54.png
          766 kB

            [JSDSERVER-11493] Search Result selection (select any of the options from the search results) : Combobox: Combobox is missing appropriate roles and/or attributes

            Yufei Zuo made changes -
            Remote Link Original: This issue links to "Page (Confluence)" [ 778228 ]
            Yufei Zuo made changes -
            Remote Link New: This issue links to "Page (Confluence)" [ 778228 ]
            Satej Mirpagar made changes -
            Resolution New: Fixed [ 1 ]
            Status Original: Waiting for Release [ 12075 ] New: Closed [ 6 ]
            Yufei Zuo made changes -
            Remote Link Original: This issue links to "Page (Confluence)" [ 762243 ]
            Yufei Zuo made changes -
            Remote Link New: This issue links to "Page (Confluence)" [ 762243 ]
            Andrew Bui made changes -
            Remote Link New: This issue links to "Page (Confluence)" [ 761005 ]
            Matthew Brennan made changes -
            Labels Original: 4.1.2 Accessibility WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-bug ax-bulldog-bl ax-high-priority ax-jsm ax-platform-dc ax-qa ax-qa-verified ax-vpat-critical New: 4.1.2 Accessibility WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-bug ax-bulldog-bl ax-critical ax-critical-priority ax-high-priority ax-jsm ax-platform-dc ax-qa ax-qa-verified ax-vpat-critical
            Matthew Brennan made changes -
            Labels Original: 4.1.2 Accessibility WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-bug ax-bulldog-bl ax-high-priority ax-jsm ax-platform-dc ax-qa-verified ax-vpat-critical New: 4.1.2 Accessibility WCAG21 ax-at-JAWS ax-at-NVDA ax-at-VO ax-bug ax-bulldog-bl ax-high-priority ax-jsm ax-platform-dc ax-qa ax-qa-verified ax-vpat-critical
            Yurii Travenko (Inactive) made changes -
            Status Original: In Review [ 10051 ] New: Waiting for Release [ 12075 ]
            Yurii Travenko (Inactive) made changes -
            Fix Version/s New: 5.9.0 [ 104928 ]

              36a811bdd856 Yurii Travenko (Inactive)
              12b69dcabe29 Matthew Brennan
              Affected customers:
              0 This affects my team
              Watchers:
              3 Start watching this issue

                Created:
                Updated:
                Resolved: