search

adaptlearning / adapt-contrib-narrative

A component that displays an image gallery with accompanying text
GNU General Public License v3.0
5 stars 39 forks source link

Label focus after selection #261

Closed joe-replin closed 1 year ago

joe-replin commented 1 year ago

Subject of the issue/enhancement/features

When using JAWS or NVDA after activating the forward or back button in the narrative component, the slide is changed and focus can be visually seen landing on the heading of the new slide. However, the first piece of information announced after activation is the label of the forward button instead of the new slide heading.

For example, if I am viewing narrative item 1 and move forward to narrative item 2, NVDA announces, "Forward to narrative item 3 (item 3 of 3), Narrative item 2". This is before if eventually announced the item heading.

If I am viewing narrative item 2 and move forward to narrative item 3, JAWS announces the trickle aria-label.

For example, if I am viewing narrative item 2 and move back to narrative item 1, JAWS announces, "Forward to narrative item 3 (item 3 of 3), Narrative item 2". This is before if eventually announced the item heading.

Your environment

Expected behaviour

Ensure that when users move between slides of the narrative component, that navigation buttons are not being announced unless they receive focus.

Actual behaviour

The headings are being focused but the navigation buttons are being read aloud.

oliverfoster commented 1 year ago

That sounds exactly like the behaviour of narrative before this pr https://github.com/adaptlearning/adapt-contrib-narrative/pull/259/files

joe-replin commented 1 year ago

This is happening after that PR as I am using Narrative v7.4.5. In Chrome & JAWS, this is working as intended. The issues are present when using a combination of Firefox & JAWS.

joe-replin commented 1 year ago

Upon further investigation, even though this is scripted to wait to move the element focus until after the animation has reached its conclusion, focus is being given to the correct element in the focus order, but the element being read aloud is the one after the focused element in the list, which in some cases screen readers will read the trickle button aloud.

Setting up a break point at the point of focus change, however, allows the correct element to be read aloud after the focus change.

oliverfoster commented 1 year ago

It'll be because the element isn't "readable" at the point of focusing, which is what "waiting for animation to finish" is about. https://github.com/adaptlearning/adapt-contrib-core/blob/c54cffec551a2311ab22c60b87a0a80274bf6aaa/js/a11y.js#L709

github-actions[bot] commented 1 year ago

:tada: This issue has been resolved in version 7.4.8 :tada:

The release is available on GitHub release

Your semantic-release bot :package::rocket: