1611428 - aria-label does not work in input field with VoiceOver

Status: RESOLVED FIXED

(Core :: Disability Access APIs, defect, P3)

Description

[bchristianson]

Attachment: noItemsInLandmarkMenu.png

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.14; rv:73.0) Gecko/20100101 Firefox/73.0

Steps to reproduce:

Overview:
I was following the WAI-ARIA tutorial on MDN, https://developer.mozilla.org/en-US/docs/Learn/Accessibility/WAI-ARIA_basics, and tried the live example at https://mdn.github.io/learning-area/accessibility/aria/website-aria-roles/. I activated macOS's VoiceOver to try it out, but it didn't appear to register any of the ARIA items. None of the Landmarks appeared in the landmark browser, and the aria-label in the search box was not read.

I tried the same using Chrome, and the landmarks and label both worked, so I am sure that this is related to Firefox and not just VoiceOver.

Steps:

1. Visit https://mdn.github.io/learning-area/accessibility/aria/website-aria-roles/ using Firefox in macOS
2. Activate VoiceOver
3. Activate VoiceOver’s Landmarks Menu
4. Move the VoiceOver cursor to the search input

Environment:
• macOS 10.14.6 Mojave
• Firefox Developer Edition, 73.0b2 64-bit

Actual results:

Steps 1 and 2: Behaved as expected

Step 3: The Landmarks menu was blank

Step 4: The text input was read out by VoiceOver as if it had no ARIA information associated with it.

Expected results:

Step 3: The Landmark menu should have had entries for banner, navigation, main, and complementary

Step 4: VoiceOver should have read out the aria-label, "Search through site content"

Comment 1

[Eitan Isaacson [:eeejay]]

These are two separate bugs. The first one (step 3) is that we don't show anything in the rotor, for anything. The second bug (step 4) is for some reason we don't speak the name of the input field.

Comment 2

[bchristianson]

It seems like ARIA in general is not working.

I’m new to ARIA, so when these two simple features weren’t working, I didn’t examine further. I probably should have looked at a few more items before blaming the entire feature. But now I’ve gone a little further ahead on the same tutorial. I went to the aria-live example, and that is not working in Firefox, but again, it does in Chrome.

It would be a good idea to verify the extent of the problems with ARIA.

Comment 3

[Eitan Isaacson [:eeejay]]

(In reply to bchristianson from comment #2)

It seems like ARIA in general is not working.

Our mac support is lacking and buggy. It has nothing to do specifically with ARIA. ARIA is a very large spec which is not implemented at the platform level.

I’m new to ARIA, so when these two simple features weren’t working, I didn’t examine further. I probably should have looked at a few more items before blaming the entire feature. But now I’ve gone a little further ahead on the same tutorial. I went to the aria-live example, and that is not working in Firefox, but again, it does in Chrome.

Yes, that is bug 1198336.

It would be a good idea to verify the extent of the problems with ARIA.

This bug report is helpful. It would be useful to have separate bugs for each of these issues. I opened a separate bug for the rotor issue. (bug 1613749).

I'm going to narrow this bug to the label issue you mentioned.

Comment 4

[Eitan Isaacson [:eeejay]]

aria-label on an input does not work.

STR:

1. Go to data:text/html,<input aria-label="Name" type="text">
2. Navigate with VoiceOver to input field.

Result:
VoiceOver says "text".

Expected:
VoiceOver should say "Name, text".

Also of note - it looks like a real DOM label works fine in this case which is very interesting.

data:text/html,<label for="i">Name</label><input id="i" type="text">

Comment 5

[bchristianson]

I'm going to narrow this bug to the label issue you mentioned.

Alright, if that's what works best for what the workflows and current bug-scoping is here, should be fine, then.

Thanks for the feedback.

Comment 6

[Marco Zehe (:MarcoZ)]

Note that this is a Mac-specific issue. On Windows, NVDA reads the aria-label just fine.

Comment 7

[Morgan Reschenberg [:morgan]]

Attachment: Bug 1611428: Add accessibilityLabel function to support aria-label on MacOS. r=eeejay

Comment 8

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

The priority flag is not set for this bug.
:asa, could you have a look please?

For more information, please visit auto_nag documentation.

Comment 9

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/4fc3839bbcde
Add accessibilityLabel function to support aria-label on MacOS. r=eeejay,Jamie

Comment 10

[Stefan Hindli [:stefan_hindli]]

https://hg.mozilla.org/mozilla-central/rev/4fc3839bbcde