Issue Summary

Error message inaccessible for the screen reader users in the preview section, which makes assistive technology users unaware of the occurrence of error.

Steps to Reproduce

1. Edit the Page.
2. Select the Children Display macro.
3. In the Children display modal, add the required value and activate the refresh preview button.

Screenshot

Actual Results

When users submit the refreshes the preview link with forms errors for children display macro, error messages get displayed in the preview section, but the focus is not available on the message nor the error message announced to the screen reader user. As a result, screen reader users were unaware of the occurrence of errors on the page.

Expected Results

Ensure the error message is accessible by the screen reader user and is announced appropriately when the user enters incorrect values in the form field.

Apply the following changes:

• Add the role="alert" to the <div> element of the error message
• The focus should not move and must remain on the "refresh" element even if the error has occurred. 

Workaround

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