Giters

ryersondmp / sa11y

Sa11y is an accessibility quality assurance tool that visually highlights common accessibility and usability issues. Geared towards content authors, Sa11y straightforwardly identifies errors or warnings at the source with a simple tooltip on how to fix them.

Home Page:https://sa11y.netlify.app

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Not working for Firefox (ESR build)?

maxstarkenburg opened this issue · comments

commented

Hi, was just checking this out after seeing your announcement in the web-a11y Slack (it's also been on my to-do list forever to check out Editoria11y for possible use on my Drupal sites). I noticed that the demo didn't seem to be working for me in Firefox. I temporary disabled all my extensions but still no luck; clicking the button just made the :focus style show up, but no other noticeable changes (opening the demo in a new tab also didn't help).

I see in the Console the following message appear sometimes when clicking the button (maybe every other time clicked?):

Uncaught (in promise) DOMException: Element.querySelectorAll: '*:not([aria-hidden='true'], #sa11y-container *, .sa11y-instance *, .sa11y-ignore *, .sa11y-ignore)' is not a valid selector sa11y.js:4
    checkAll sa11y.js:639
    sa11yMainToggle sa11y.js:252
    jQuery 2
        dispatch
        handle

Not seeing similar behavior or errors in Chrome/Edge. My Firefox version is 78.10.1esr (unsure what that might correspond to in non-ESR versions).

commented

Thanks for sharing @maxstarkenburg!

Seems to work perfectly on Firefox (non-ESR build) on MacOS, although I downloaded ESR build and experienced the same. I'll look into it.

commented

Update: Firefox ESR doesn't like my QuerySelector containing a CSS :not() selector.

Problem code:

this.$contrast = container.querySelectorAll("*:not("+containerIgnore+")");

Fix:

this.$contrast = Array.from(container.querySelectorAll("*")).filter(item => !item.querySelector(containerIgnore));

Will be patched next release. Thanks again @maxstarkenburg