Business Services/Create Objects : Inaccessible by keyboard and no conforming alternate.

XMLWordPrintable

    • Severity 2 - Major

      Issue Summary

      The element is not accessible by keyboard alone and there is no conforming accessible version of the same functionality reachable from the non-conforming page.

      Elements:
      For the following checkboxes below

      • Key
      • Name
      • Created
      • Updated
      • Status
        ---so on

      Location:
      Present on expanding "Filter search" button

      Tested URL

      https://instenv-5971-nizh.instenv.atl-test.space/secure/ObjectSchema.jspa?id=3&mode=object&objectId=100

      Steps to Reproduce

      1. Step 1

      Actual Results

      Actual results

      Expected Results

      Fix Information
      RULE :
      The name, role, value, states, and properties of user interface components MUST be programmatically determinable by assistive technologies.

      HOW TO FIX:
      Fix this issue by using ONE of the following techniques:
      1. Use the aria-sort attribute values of "ascending" or "descending" or "none" on the column header to indicate the sort state of the data in a sortable column. This technique also requires that role="columnheader" be added to the <th> element.

      <th role="columnheader" aria-sort="descending">
      <button class="sortableColumnLabel">Name</button>
      </th>

      2. Add CSS clipped (visually hidden) text to the sorting element to indicate the sorted state.

      <th>
      <div tabindex="0" role="button" id="date-sort">
      Date <span class="sr-text">sorted ascending</span>
      </div>
      </th>

      REFERENCE:
      WAI-ARIA Recommendation: https://www.w3.org/TR/wai-aria-1.1/#aria-sort

      BACKGROUND:
      States and properties are attributes used to convey essential information about an element to screen readers and other assistive technologies. Some roles require certain state and property information - such as the checked/unchecked state of a checkbox. Native HTML elements provide those required states and properties, so nothing more needs to be done. If you create a custom version of a native HTML element or a custom control or widget that does not have a native HTML equivalent, you must add the relevant states and properties using ARIA.

      Screenshot

      Screen Recording

      screen recording

      Workaround

      workaround

      Bug Ref: 748653

      Bulldog Ref: JSMDC-12834

        1. FIlter search.jpg
          752 kB
          Akhilesh Paradhi
        2. FIlter search.mp4
          1.31 MB
          Akhilesh Paradhi

            Assignee:
            Roman Litvishko (Inactive)
            Reporter:
            Matthew Brennan
            Votes:
            0 Vote for this issue
            Watchers:
            2 Start watching this issue

              Created:
              Updated:
              Resolved: