Skip to content

Syntax error, unrecognized expression: a, input, button, select #4344

@cmahnke

Description

@cmahnke

I'm not sure if this is related to a upgrade to a dependency like jQuery:

Syntax error, unrecognized expression: a, input, button, select

This is introduced here:

Slick.prototype.activateADA = function() {

Update

I tracked it down: Chrome changed the handling of a11y (aria) tags, especially in focus switching contexts (like a slider).

Blocked aria-hidden on an element because its descendant retained focus. The focus must not be hidden from assistive technology users. Avoid using aria-hidden on a focused element or its ancestor. Consider using the inert attribute instead, which will also prevent focus. For more details, see the aria-hidden section of the WAI-ARIA specification at https://w3c.github.io/aria/#aria-hidden.
Element with focus: <div.slick-slide slick-cloned#>
Ancestor with aria-hidden: <div.slick-slide slick-cloned#> <div class=​"slick-slide slick-cloned" data-slick-index=​"5" id aria-hidden=​"true" tabindex=​"-1" style=​"width:​ 952px;​">​…​</div>​

So the fix is to pass accessibility: false to the slick method.

But maybe it's time to move to another slider, since there aren't any releases on NPM since 8 years...

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions