To announce a dynamic change, I have added role="alert"
to <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?