If infinite loop is set to false, all slides have "aria-hidden" set to true

[esr360]

If I set the "infinite" property to "false", the "aria-hidden" attribute on every slide seems to be set to true, when naturally the visible slides should be set to false.

http://codepen.io/esr360/pen/XbMpKg

[leggomuhgreggo]

Looks like its a bug with center mode. I tried disabling that and it worked.

http://codepen.io/gwst/pen/dovNVg

If you need to use center mode and want to hack proper aria function until this get's fixed, I think you can get it done by using the beforeChange event to toggle the attribute. More here

[esr360]

Hi thanks for your reply and for the hack until there's a fix.

Just to point out, if I remove the "infinite" attribute from my initial above example, but leave centerMode set to "true", everything works as expected, so not sure if the issue is with infinite or center mode

EDIT: after playing about some more I see you are right that it is an issue with center mode. Thanks.

[gunnx]

Also having this issue on v1.5.0
To fix, I'm adding code to the afterchange event to set the active slide to aria-hidden false

[m-ret]

Any updates here? I am having this same issue.

[thiemeljiri]

I'm having the same issue. This is a critical bug as far as accessibility is concerned. It's like if the whole carousel wasn't present.

[underclockeddev]

@esr360 @leggomuhgreggo I think the issue appears when you use both centerMode:true and infinite:false

I worked around this in my local branch FOR MY PARTICULAR USE CASE. In Slick.prototype.setSlideClasses, by creating a new logic path. There's a if (_.options.centerMode === true) check, and within that a if (_.options.infinite === true) check, but there's no else for the infinite option check.

All I did was copy everything within if (_.options.infinite === true) into its own else (this is in effect the same as removing the line with the if check on it).

My use case is these particular settings

arrows: true,
slidesToShow: 1,
infinite: false,
centerMode: true,
slidesToScroll: 1,
focusOnChange: true,

and I am sure that this hack does not universally fix this issue but I didn't have time to deep dive into this chunk of logic and see exactly what was going on, and what would need to be different for infinite mode on/off.

But I am pretty sure this bug is a result of not having a flow for else on the if (_.options.infinite === true) check

Is @kenwheeler still accepting PR's? Looks like this project has been quiet for a while. If so, I will volunteer some time to do more extensive study and try to fix this for real.

[richgerdes]

I've opened PR #4307 for this. I copied the logic as suggested by @underclockeddev and adjusted the code to remove what I think was needed for the infinite loop to render correctly. Hopefully this addresses the bug.