SIA-R83 (Text is clipped) doesn't detect invisibility due to clip-path

[dan-tripp-siteimprove]

The CSS properties clip-path and/or -webkit-clip-path seems to be cause a false positive for this rule. With those CSS properties one clip it completely so that it's invisible, even while its bounding rect's width/height are much greater than zero. If the text isn't visible then it doesn't meet the applicability for the rule so it shouldn't be checked. But it is checked, and it fails.

The HTML that I saw on a customer's page which exhibited this looked roughly like this:

<div style="clip-path: polygon(0px 0px,0px 0px,0px 0px); -webkit-clip-path: polygon(0px 0px,0px 0px,0px 0px); overflow: hidden; height: 10px; width: 10px;">lorem ipsum dolor</div>

But that HTML on its own doesn't reproduce the problem, so there's something I don't understand here. @Jym77 I won't post the customer's page here but if you would like me to file a jira too or do anything else to be more specific on this, let me know.

• Follow up on II-7579

[Jym77]

I think we need to gather cases of how clip-path is used to make content invisible.
I do not want to implement a generic area computation of all possible clip-path, but I assume that there are only a handful that are commonly used to make content invisible, and we can likely make a heuristic to detect these cases specifically.

[dan-tripp-siteimprove]

Would you like any more info on this current case?

[Jym77]

Would you like any more info on this current case?

No, I think there is enough with that CSS value. I'd like to know if it's somewhat common to use polygon(0px, …) and worth having a "polygon with all 0 is invisible" heuristic.

[dan-tripp-siteimprove]

Okay, I'll try to gather that info.