Issue Summary

The screen reader fails to render the "Page title" field as mandatory.

Steps to Reproduce

1. Open the home page.
2. Activate the "Create" button> Select the "Content Formatting Templates" option > Activate the "Next" button
3. Using the screen reader, navigate to the mentioned instance.
4. Listen, the screen reader fails to render the mentioned field as mandatory.

Screenshot

Screen Recording

Screen Recording 2024-09-10 at 6.07.54 PM.mov

Actual Results

An asterisk “*“ is provided for mentioned form fields but they are not conveyed as required fields by the screen reader.

Screen reader users often prefer identifying mandatory form field information in advance to complete the form successfully and avoid error messages. Well-defined mandatory form fields are also helpful for users with mobility impairments as they can fill up the form with ease. In the absence of mandatory form fields information, users might incorrectly fill up the form and thus might lead to frustration.

Expected Results

All users should be able to identify the mandatory fields.

Apply the following changes:

• Add "required" attribute to the <input> element for the mentioned field which will help to convey the required state for screen reader users.
• Ensure that the accessible name should be match with the visual label. Use ‘for’ and ‘id’ attributes to associate labels with their respective form fields.
• Ensure that the value of ‘for’ attribute of the label exactly matches the value of ‘id’ attribute of the form field.

Code Snippet

<label for="text-input">Page title</label>
<input id="text-input" required class="text medium-field" type="text"  name="title" tabindex="0"> 

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 14.6.1
Chrome - Version 128.0.6613.120 (Official Build) (arm64)
Firefox- Version 92.0 (64-bit) 
Safari- Version 17.6 (19618.3.11.11.5)
JAWS- Version 2023
NVDA- Version 2021.2 
Voiceover - Version Latest