How To Prevent Windows Narrator From Reading Hidden Html Tags?

I have an HTML page, with multiple hidden elements that become visible only under certain circumstances. When I set the focus on the page wrapper (to read all the content), Window

Solution 1:

apply role="presentation" tabindex="-1" to your elements that have aria-hidden applied.

Solution 2:

Just fought with the same thing, and found out that if there's an element with role="main" without explicit aria-label/aria-labelledby defined, its whole content, including all the hidden elements, is added to MSAA and UIA trees which is then read out by the Narrator. Adding an explicit aria property solves the issue - but apparently also stops the Narrator from starting to read the main content automatically.

The good thing is that AccChecker warns about these problems. Apparently better to follow its advice even though it would be nice to have that automatic reading of content.

Solution 3:

Apparently this isn't an issue anymore on MS Edge! Hurray! If the element is hidden with CSS display:none then it doesn't read it's content.