hidden-element-has-focusable-content-and-the-where-pseudo-class.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="UTF-8">
<title>x</title>
<style>


.test1_class1:where(.test1_class2)[aria-hidden=true] {
	display: none
}

.test2_class2.test2_class2[aria-hidden=true] {
	display: none
}

</style>

</head>

<body>
<main>


<h1>Test
</h1>


<div>
	This is test1.  It uses ":where".  It fails the "Hidden element has focusable content" rule.
	<div id="id1" class='test1_class1 test1_class2' aria-hidden="true"> 
		<a href="#" >x</a>
	</div>
</div>


<div>
	This is test2.  It doesn't use ":where".  It passes the "Hidden element has focusable content" rule.
	<div class='test2_class1 test2_class2' aria-hidden="true">
		<a href="#" >x</a>
	</div>
</div>


</main>

</body>

</html>