Issue Summary

The "How urgent is this?" form field is not identified as required for users.

Steps to Reproduce

1. Open the JSM DC Help Center instance.
2. Navigate to the "Report a system problem" and activate it.
3. Navigate to the mentioned form field and inspect the code.
4. Observe that there is no indication to identify the mandatory field.

Screen Recording

https://jira.atlassian.com/secure/attachment/483684/Required%20Form%20Field%20Screen%20Recording.mp4

Actual Results

There is no indication that the form field, such as "How urgent is this?", is mandatory. Users are only informed that the field is required after submitting the form, if an error occurs.

As a result, both cognitive and screen reader users may have difficulty identifying the mandatory field.

Expected Results

All users should be able to identify the mandatory fields.

Include an asterisk within the label markup of the mandatory form fields. Additionally, apply the "required" attribute or the aria-required="true" attribute to the form fields in the source code.

Code Snippet:

<label class="field-label" for="priority" id="priority-label">
How urgent is this?
<span class="cp-required" aria-hidden="true">*</span>
</label>
<input id="react-select-priority-instance-input" type="text" aria-labelledby="priority-label" role="combobox" aria-expanded="false" required> 

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.7
Operations - Windows11
Chrome - Version 133.0.6943.54 (Official Build) (64-bit)
Safari- Version 18.0
Firefox- Version 135.0 (64-bit)
JAWS- Version 2023
NVDA- Version 2024.4.2
VoiceOver - Version Latest