Uploaded image for project: 'Crowd Data Center'
  1. Crowd Data Center
  2. CWD-5990

Log in | user: Related radio buttons are not programmatically grouped

      Issue Summary

      On the "Log in | user" page, The "I have forgotten user name" and "I have forgotten password" radio buttons are not programmatically grouped (that becomes available on activating "forgotten password" link).

       Steps to Reproduce

      1. Navigate onto the above mentioned page.
      2. Navigate to the "forgotten password" link and activate it. 
      3. Navigate onto the mentioned radio buttons using screen reader.
      4. Observe that no group is announced for it.

      Screenshot

      Actual Result

      The radio buttons such as "I have forgotten user name" and "I have forgotten password" are not programmatically grouped and associated with "What is preventing you from logging in?" instruction. As a result it will create bad user experience for screen reader users. Moreover incomplete information is conveyed for them.

      Expected result

      The screen reader should announce the instruction along with the label for the radio buttons. in this instance, Include the instruction "What is preventing you from logging in?" within <legend> element. Use <fieldset>and <legend> elements to group the instruction and radio buttons.

      Code snippet

       

      <fieldset>
      <legend>What is preventing you from logging in?</legend>
      <label ..>
      < input type="radio"...>
      <div>I have forgotten password</div>
      </label>
      <label ..>
      <input type="radio"..>
      <div>I have forgotten user name</div>
      </label>
      </fieldset>
      

      workaround

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

      Environment 

      MacBook Pro (14-inch, 2021)
      macOs Ventura 13.5
      Chrome - Version 115.0.5790.114 (Official Build) (x86_64)
      Firefox- Version 93.0 (32-bit)
      Safari- Version 15.3 (17612.4.9.1.5)
      JAWS- Version 2023
      NVDA- Version 2023.2
      Voiceover - Version Latest

            [CWD-5990] Log in | user: Related radio buttons are not programmatically grouped

            No work has yet been logged on this issue.

              1de29e97b13b Marek Weihs
              71c7b0ef4382 Malleswara Rao Konthala
              Affected customers:
              0 This affects my team
              Watchers:
              2 Start watching this issue

                Created:
                Updated:
                Resolved: