If the image is hidden (e.g. display:none parent) then it won't be checked.
We should check all the images despite them being visible or not. A common case might be that keeps some content parts in hiddien container - like slider, tabbed content.
E.g. simplified tabbed content (without any classes/aria markup) might be created like so:
<!-- All the section[data-tab-content] are display:none by default. -->
<nav>
<ol>
<li><a data-content-id="foo">tab1</a></li>
<li><a data-content-id="bar">tab2</a></li>
<li><a data-content-id="baz">tab3</a></li>
</ol>
</nav>
<section data-tab-content="foo">
<!--Some markup.-->
</section>
<section data-tab-content="bar">
<img src="...">
<!--Some markup.-->
</section>
So images in tabs would pass unchecked, while it's important part of the content.
On top of it using jQuery :visible filter greatly affects the performance.
Visibility check was introduced in this commit. We'll cover only img here, as it's a priority, but other cases should be checked as well.
Subject assessment:
imgHasAlt.If the image is hidden (e.g.
display:noneparent) then it won't be checked.We should check all the images despite them being visible or not. A common case might be that keeps some content parts in hiddien container - like slider, tabbed content.
E.g. simplified tabbed content (without any classes/aria markup) might be created like so:
So images in tabs would pass unchecked, while it's important part of the content.
On top of it using jQuery
:visiblefilter greatly affects the performance.Visibility check was introduced in this commit. We'll cover only
imghere, as it's a priority, but other cases should be checked as well.Source issue: cksource/quail#6.