Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

Hi I am working on angular where we need popup accessibility. I took reference from this link for that:

https://www.w3.org/TR/wai-aria-practices/examples/dialog-modal/dialog.html

It states that using aria-modal="true" will not allow screen readers read content which is in background but it is not working in JAWS 18 version and working in JAWS 19 version.

This is how my code looks like:

I have a dialog.component.html

<div aria-modal="true">
model-contet goes here
Now I am injecting this component <dialog></dialog> inside various components. But it still keeps reading content below.
Your code is correct but aria-modal is not well supported yet.  
For now, you have to set aria-hidden on elements that do not belong to the dialog.  If your code/DOM can be arranged so that the dialog is a sibling of your main window, it makes setting aria-hidden much easier.
See my answer on focus moving out of modal in scan mode
        
Thanks for contributing an answer to Stack Overflow!
Please be sure to answer the question. Provide details and share your research!
But avoid …
Asking for help, clarification, or responding to other answers.
Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.