Sharing UI accessibility

[tyrylu]

Steps to reproduce

1. Open the sharing UI for any file with, lets say NVDA
2. Observe missing buttons, and maybe more

Expected behaviour

Everything should be read correctly

Actual behaviour

There at least two instances of, i assume buttons, which have only an icon - namely the confirmation button for the share with action and the more button for public link sharing.
I did not notice it sooner, i should probably have tested the betas, but i naively assumed that if it worked in 13, it would not be broken with 14.

Client configuration

Browser: Firefox 62.0.3

Operating system: Windows 10

Screen reader tested: NVDA, latest development snapshot

Notes

I suspect that we can not avoid those regressions entirely, because it would require some sort of integration test or something like that, but i have honestly no idea how testing those kinds of interactions would even work, anyone any ideas?

[nextcloud-bot]

GitMate.io thinks possibly related issues are #10361 (Public share note needs a better ui), #5916 (UI problem in sharing options), #434 (New sharing UI), #11364 ([npm] Bump accessibility), and #3401 (Suggestion: Share Center).

[MorrisJobke]

It should work - @jancborchardt recently looked into improving it. Maybe somebody from @nextcloud/accessibility can verify this as well.

[tyrylu]

Yeah, i should probably test the latest master, then. :-)

[jancborchardt]

@tyrylu sorry about that, we are working a lot on the sharing at the moment. :\ If you do have time, it would be great if you could test the pull request where we work on multiple share links: #11844 – as that will change stuff around a bit again.

(@skjnldsv and me will also test, but it’s always good to have feedback from others in @nextcloud/accessibility! :)

[javido]

I confirm this issue in 14.04 With Orca screen reader / Firefox 63.
Another related issue is with the popover menus, there is no keyboard alternative shortcut to show share options menu when you mark a public share.
I have to edit the dom tree and remove popover-menu class to get access to these options. Copy link, send by email, set password etc.
I would like to contribute testing a11y, I will look to install a fresh master version.

Thanks, regards

[skjnldsv]

I would like to contribute testing a11y, I will look to install a fresh master version.

@javido awesome! We're really looking forward to that!
If you need help setting things up, reach over the docs: https://docs.nextcloud.com/server/stable/developer_manual/general/devenv.html
If you need another help, come and join us on the irc channel #nextcloud-dev on freenode or just ask in these Github issues :) 👋

[jancborchardt]

@javido very cool, welcome to Nextcloud! Also added you to the accessibility team!

@tyrylu did you manage to test with latest master already? Nextcloud 15 will be released on Thursday but fixes we do afterwards could still be backported to be in a 15.0.1 release etc. :)

[javido]

Things has improved a lot on accessibility for the new Sharing UI.
Screen reader can present share options and form.
Tested on Nextcloud 16.0.1 with Orca screen reader on GNOME and JAWS / NVDA screen readers on Windows.
Great work!

A related issue may be with the share icon in Files application?
Screen reader doesn't present any accessible text for the "Share" link.
Do We need to open another issue on this? or it's related to the new Sharing UI?

[tyrylu]

Confirmed, but it only occurs when the file is not shared.

[javido]

In Sharing UI the h3 heading for file to be shared should be level 2 (h2) to don't break the heading hierarchy.
Also I don't see reason to use aria-described or title attribute since this is not a interactive or focusable element.
Would be nice to have more details for the input
E.G. which file it's to be shared
So when sscreen reader focus the input field, users could have feedback on which file it's to be shared.
You can use an id attribute to file name heading, id attribute to the "Share" label and then
use aria-labelledby="file_name lbl_share" in the input element as follow:

jsaccesible.zip

Compartir

[javido]

jsaccesible.zip

Compartir