Issue Summary

On "Repository Details" page, the "Repository names are limited to 128 characters. They must start with a letter or number and may contain spaces, hyphens, underscores, and periods" error message is incorrectly associated with "Name" input field. 

Steps to Reproduce

1. Open any project and activate "Repository" link present in header. 
2. Activate "Repository settings" link present in side navigation. 
3. Observe that the "Repository Settings" navigation appear. 
4. Activate "Repository details" link. 
5. Navigate through page using screen reader. 
6. Keep "Name" input field empty. 
7. Activate "Save" button. 
8. Observe that the focus moves at the "Name" input field. 
9. Observe that the error message is incorrectly associated with the input field.

Screenshot

Actual Results

When the "Save" button is activated by keeping "Name" input field empty, the "Repository names are limited to 128 characters. They must start with a letter or number and may contain spaces, hyphens, underscores, and periods" error message appears. 

The error message is incorrectly associated with the input field. The id="name-error-message-0" is provided on <div> that contains the error. The aria-describedby="name-error-message-0 " attribute is defined on <input> element and the value that has been referred has extra space. 

As a result, error message is not announced for screen reader message with label. 

Expected Results

Make sure that the error message is announced for screen reader users. In this case, associate error message with "Name" input field. 

Apply following changes:

• Provide id="" attribute on <div> element that contains the error message. 
• Provide aria-describedby="" attribute on <input> element. 
• Refer correct id="" value in aria-describedby="" attribute.

If above is not possible then provide aria-live="polite" on container of the error message. 

<label for="a1">Name * 
<span>
Required
</span>
</label>
<input id="a1" aria-describedby="name-error-message-0" type="text" ....>
<div id="name-error-message-0">Repository names are limited to 128 characters. They must start with a letter or number and may contain spaces, hyphens, underscores, and periods.</div>

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