To announce a dynamic change, I have added
<div class="validation_error">. This
<div> appears after page reload, but Accessibility experts say the empty container with
role="alert" should already be present in the HTML. Otherwise screen readers can’t present the error correctly.
MDN also explains why an empty container must be present.
I have two questions about this:
- Why does Gravity add the
<div>with the validation error after reload?
- How can we create an empty div, to which the validation error can be added? Or do you have other suggestions to handle this?