Uploaded image for project: 'Bitbucket Data Center'
  1. Bitbucket Data Center
  2. BSERV-19256

Your Work : Input field does not have accessible name

    XMLWordPrintable

Details

    Description

      Issue Summary

      On "Your Work" page, the accessible name is missing for "Repository search" input field. 

      Steps to Reproduce

      1. Open "Your Work" page.
      2. Navigate through page using screen reader or inspect the code of input field. 
      3. Observed that the input field does not have accessible name. 

      Screenshot

      Actual Results

      The input field "Repository Search" does not have labels associated with it and the title attribute is not included in it's source code either. As a result, users with visual impairments who use a screen reader will not be able to understand the purpose of the input fields.

      Expected Results

      Provide unique and descriptive label for each form control using <label> element. This will help screen reader users to understand the purpose of the form control and input the details accordingly. Web pages that lack label for form controls make it difficult for screen reader users to complete the form successfully.

      In addition, associate the label explicitly with the form control using the “for” and “id” attribute to ensure that assistive technologies identify the label for each form control correctly. Alternatively use either hidden labels or ‘title’ or ‘aria-label’ attribute to convey the purpose of the form controls to screen reader users as well as maintain the presentation.

      Please note :  Use only one labelling technique to provide accessible name for input field.

      Example 1: Using <label> element.

      <label for="a1" ...>Repository Search</label>
      <input id="a1" type="text" ...>

      Example 2 : Using id="" and aria-labelledby="" attributes

      <h2 id="a1" ...>Repository Search</h2>
      <input aria-labelledby="a1" type="text" ...>

      Example 3 : Using aria-label="" attribute 

      <input type="text" aria-label="Repository Search" ...>

      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 Sonoma Version 14.1
      Chrome - Version 119.0.6045.159 (Official Build) (arm64)
      Firefox- Version 93.0 (32-bit)
      Safari- Version 17.1 (19616.2.9.11.7)
      JAWS- Version 2023
      NVDA- Version 2020.3
      Voiceover - Version Latest

      Attachments

        Activity

          People

            482cfebf5b5a Matthew Hanselman
            8b74bced7d61 Shruti Chabukswar
            Votes:
            0 Vote for this issue
            Watchers:
            1 Start watching this issue

            Dates

              Created:
              Updated: