1565159 - Add keyboard access for messages without a CTA link

Status: RESOLVED FIXED

(Firefox :: Messaging System, enhancement, P1)

Description

[Andrei Oprea [:andreio]]

The button is the only element you can focus on, without it you just skip the message when navigating only with the keyboard.

Comment 1

[BugBot [:suhaib / :marco/ :calixte]]

Bugbug thinks this bug is a task, but please change it back in case of error.

Comment 2

[Ed Lee :Mardak]

Do we want keyboard focus to go to both the link and the message for those that do have links? Probably not?

Comment 3

[Ed Lee :Mardak]

A quick test shows setting tabindex=0 doesn't seem to work (and curiously the text-link gets tabindex=-1 ? But setting text-link class on the div or whatever makes it tabbable although it also comes with the styling of a text-link. So perhaps alternatively, make the desired tabbable thing a <button> instead of a <div> ?

Comment 4

[Marco Zehe (:MarcoZ)]

Making sure this shows up on the Skyline Accessibility radar.

Comment 5

[Marco Zehe (:MarcoZ)]

Why can't you just use an a with a href attribute, AKA a normal link where a link is due? Because of restrictions with sandboxing? If that's the case, a button is probably the more appropriate element. Or a div with role="link" and tabindex="0" instead of -1. 0 will make it tabable by default. Of course, then you'd need to make sure that Enter opens the link, AKA does the same as OnClick.

Comment 6

[Andrei Oprea [:andreio]]

We're capturing click events in order to track the events for telemetry. We're then opening the link programmatically.

Comment 7

[Marco Zehe (:MarcoZ)]

Hm, then using something similar to what Jamie suggests in bug 1561334 comment #3 might help here, have you investigated that?

Comment 8

[Emily McMinn :emcminn]

Attachment: Bug 1565159 - Added keyboard access to WhatsNew panel messages

Replaced the message body div with an unstyled button element, which creates the correct tabbing behavior.

Comment 9

[Emily McMinn :emcminn]

Attachment: Added a listener to trigger a click on Enter press

Comment 10

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/875e7754b202
Added keyboard access to WhatsNew panel messages r=k88hudson,andreio

Comment 11

[Cristina Coroiu [:ccoroiu]]

https://hg.mozilla.org/mozilla-central/rev/875e7754b202