Space in text is causing failure in color-contrast test

[ivoderuever]

Product

axe-core

Product Version

4.9.0

Latest Version

• [X] I have tested the issue with the latest version of the product

Issue Description

Expectation

I expect te return of the failing elements.

Actual

It throws the following error: Error: Cannot read properties of undefined (reading 'getCellFromPoint')

How to Reproduce

By running the mobile lighthouse on https://www.custtom.com/ you'll see the same error come up under accessibility.

Additional context

It only returns an error when in the mobile menu you press a sub menu (products for example) and then if those li elements contain words with spaces it returns the error in lighthouse. If I put a single word there it will return as expected. Additionally I did not see this error with the axe extension.

[straker]

Thanks for the issue.

So the quick answer is that the error is caused by the hamburger menu on mobile that is offscreen. It's not hidden from screen readers (or tab) so the color contrast algorithm tries to run on it, but that breaks. A quick fix would be to hide the menu which would prevent the code from running.

There's still a bug on our end though so I'll log this as a bug that needs fixing. A note for future self is that the menu container that is offscreen does not have an associated _grid with it but the child anchor does, so the code breaks when trying to look at the grid.container of the anchor, see's it exists, but then that container does not have a ._grid property.

[ivoderuever]

Thank you for looking into the issue.

I've adjusted things on our end based on your comment and lighthouses is running as normal again. So again thank you.

[nicokiva-sierrainteractive]

Hi @straker, I think I have the same issue but not sure (a drawer translateY -105%) to hide it. That offscreen may cause this error?