1193018 - [Accessibility] Improve accessibility for non-natively-focusable controls.

Status: RESOLVED FIXED

(Firefox OS Graveyard :: Gaia, defect)

Description

[Yura Zenevich [:yzen] (please use "needinfo")]

Right now there are cases of elements that should be focusable (have correct roles etc) but are not universally focusable (no tabindex). They work because our screen reader handles such elements as if they are but it's not the case for other assistive technologies and especially accessibility evaluation tools. We need to add tabindex wherever necessary.

Comment 1

[GitHub Autolander Bot]

Attachment: [gaia] yzen:bug-1193018-gallery > mozilla-b2g:master

Comment 2

[Yura Zenevich [:yzen] (please use "needinfo")]

Attachment: Gallery Github pull request.

Comment 3

[GitHub Autolander Bot]

Attachment: [gaia] yzen:bug-1193018-music > mozilla-b2g:master

Comment 4

[Yura Zenevich [:yzen] (please use "needinfo")]

Attachment: Music Github Pull Request.

Comment 5

[GitHub Autolander Bot]

Attachment: [gaia] yzen:bug-1193018-system > mozilla-b2g:master

Comment 6

[Dominic Kuo [:dkuo]]

Comment on attachment 8645962 [details] [review]
[gaia] yzen:bug-1193018-music > mozilla-b2g:master

The changes are trivial and no harm so looks good to me.

Comment 7

[Yura Zenevich [:yzen] (please use "needinfo")]

Music: https://github.com/mozilla-b2g/gaia/commit/9d5694629526f96d30b9bdd16c4e1c548ad49aee

Comment 8

[Yura Zenevich [:yzen] (please use "needinfo")]

System: https://github.com/mozilla-b2g/gaia/commit/2052b591db7af90341012ea780bcca3f54d100e0

Comment 9

[GitHub Autolander Bot]

Attachment: [gaia] yzen:bug-1193018-vertical-home-gaia-grid > mozilla-b2g:master

Comment 10

[Yura Zenevich [:yzen] (please use "needinfo")]

Comment on attachment 8646392 [details] [review]
[gaia] yzen:bug-1193018-vertical-home-gaia-grid > mozilla-b2g:master

Another small fix for gaia-grid that affects a number of vertical homescreen tests.

Comment 11

[GitHub Autolander Bot]

Attachment: [gaia] yzen:bug-1193018-video > mozilla-b2g:master

Comment 12

[Tim Guan-tin Chien [:timdream] (please needinfo)]

Comment on attachment 8646392 [details] [review]
[gaia] yzen:bug-1193018-vertical-home-gaia-grid > mozilla-b2g:master

I think we should upstream the change in shared/elements/

Comment 13

[Yura Zenevich [:yzen] (please use "needinfo")]

(In reply to Tim Guan-tin Chien [:timdream] (slow response; please ni? to queue) from comment #12)
> Comment on attachment 8646392 [details] [review]
> [gaia] yzen:bug-1193018-vertical-home-gaia-grid > mozilla-b2g:master
> 
> I think we should upstream the change in shared/elements/

Yeah I was going to do that too, but could not find the component repository. Would you know where it is, Tim?

Comment 14

[Yura Zenevich [:yzen] (please use "needinfo")]

Vertical home: https://github.com/mozilla-b2g/gaia/commit/29e8f1034b92d387912f45d65690ad6937a16509

Comment 15

[Tim Guan-tin Chien [:timdream] (please needinfo)]

(In reply to Yura Zenevich [:yzen] from comment #13)
> (In reply to Tim Guan-tin Chien [:timdream] (slow response; please ni? to
> queue) from comment #12)
> > Comment on attachment 8646392 [details] [review]
> > [gaia] yzen:bug-1193018-vertical-home-gaia-grid > mozilla-b2g:master
> > 
> > I think we should upstream the change in shared/elements/
> 
> Yeah I was going to do that too, but could not find the component
> repository. Would you know where it is, Tim?

https://github.com/gaia-components

Ping :wilsonpage for detail.

Comment 16

[Yura Zenevich [:yzen] (please use "needinfo")]

Hi David, let me know if I can forward this to someone else in case you're too busy atm.

Comment 17

[Punam Dahiya [:pdahiya]]

Comment on attachment 8645960 [details] [review]
[gaia] yzen:bug-1193018-gallery > mozilla-b2g:master

Patch looks good on first glance, my only question is why do we need to comment delete image test in the patch?

Comment 18

[Yura Zenevich [:yzen] (please use "needinfo")]

(In reply to Punam Dahiya from comment #17)
> Comment on attachment 8645960 [details] [review]
> [gaia] yzen:bug-1193018-gallery > mozilla-b2g:master
> 
> Patch looks good on first glance, my only question is why do we need to
> comment delete image test in the patch?

Ah, apologies, I did not clean it up after testing, should be all set now.

Comment 19

[Russ Nicoletti [:russn]]

Comment on attachment 8646406 [details] [review]
[gaia] yzen:bug-1193018-video > mozilla-b2g:master

Looks ok to me.

Comment 20

[Yura Zenevich [:yzen] (please use "needinfo")]

Video: https://github.com/mozilla-b2g/gaia/commit/331956d992ec4231fd19980201e86fd0d3067b2a

Comment 21

[Punam Dahiya [:pdahiya]]

Comment on attachment 8645960 [details] [review]
[gaia] yzen:bug-1193018-gallery > mozilla-b2g:master

Hi Yura

Thanks for the updated patch. After adding tab index to thumbnail container element, a dotted border shows on selecting thumbnail. To replicate easily,
1) Click select button in footer
2) Tap on thumbnail, it will show dotted border along with blue outline on last selected thumbnail

This can be fixed by setting outline: none on containing div element where we are setting tab index 
https://github.com/mozilla-b2g/gaia/blob/master/apps/gallery/style/gallery.css#L266


I see a unit test failing but that's definitely unrelated to the changes in this patch. Thanks!

Comment 22

[Wilson Page [:wilsonpage]]

This seems to have introduced CSS outlines on all the affected elements. This patch should have come with `outline: 0` styling too.

Comment 23

[Yura Zenevich [:yzen] (please use "needinfo")]

Comment on attachment 8645960 [details] [review]
[gaia] yzen:bug-1193018-gallery > mozilla-b2g:master

Should be addressed now.

Comment 24

[Punam Dahiya [:pdahiya]]

Comment on attachment 8645960 [details] [review]
[gaia] yzen:bug-1193018-gallery > mozilla-b2g:master

Thanks Yura, Patch looks good and has my r+.

Comment 25

[Yura Zenevich [:yzen] (please use "needinfo")]

Gallery: https://github.com/mozilla-b2g/gaia/commit/95f72813408f75084693d8ffd64cd1c804918a29