WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Relationship between WCAG and the ARIA in HTMLspecification

for

From: Steve Green
Date: Aug 8, 2023 7:44AM

It sounds like you are basing your comments on screen reader behaviour rather than the accessibility tree. That's not wrong, but it's important to specify the method because it has a profound effect on the results.

I just tested a button inside a link using the following code:

<p><a href="#">Home</a></p>
<p>Test code</p>
<a href="#">Foo<span role="button" tabindex="0 ">Bar</span></a>
<p>End of test code</p>

The accessibility tree looks the same in Chrome and Firefox insofar as the link and button roles are conveyed correctly. The link's accessible name is the concatenation of the link and button labels, so I can report this as a non-conformance of WCAG SC 4.1.2. It sounds like a trivial issue, but the effect on JAWS and NVDA is extraordinary - they don't seem to be taking any notice of the accessibility tree.

JAWS 2021 gives the following behaviours with Chrome and Firefox:
In virtual cursor mode the word "Foo" just appears to be text, not a link.
When tabbing, the "Foo" link is announced as the previously focusable element i.e. neither its name nor role is announced. In my test page it is announced as "Home link" when tabbing forwards and as "Bar button" when tabbing backwards.
When tabbing forwards, the "Bar" button is correctly announced as "Bar button". But tabbing backwards, it is announced as "FooBar link Bar button".
In both cases, the "Bar" button is announced correctly.

With NVDA 2021 (with Screen Layout turned off), I get the following with Chrome and Firefox:
In virtual cursor mode the "Foo" link is announced as "Link Foo". The "Bar" button is announced as "Link button Bar".
When tabbing forwards, the "Foo" link is announced as "Foo Bar link". The "Bar" button is announced as "Bar button link".
When tabbing backwards, the "Foo" link is a silent tab stop. The "Bar" button is announced as "Bar button link".

Steve

-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of Birkir R. Gunnarsson
Sent: Tuesday, August 8, 2023 1:04 PM
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: Re: [WebAIM] Relationship between WCAG and the ARIA in HTML specification

I did a very rudimentary test and saw that Firefox and Chrome treat links with a nested button differently.
* Firefox does not expose a link at all
* Chrome half-exposes a link (Jaws announces the link in browse mode but not when you open a list of links) Neither browser exposed the presence of a link nested in a button.
I'll do more comprehensive testing when I have time and throw the example code up on CodePen or similar.

On 8/8/23, Steve Green < <EMAIL REMOVED> > wrote:
> I will assume that's a comprehensive list of error conditions - it's
> certainly a long list. However, it doesn't say anything about the
> accessibility tree. Is there a specification for how it is
> constructed? If there is, I can't find it.
>
> Is it possible that different browsers could generate different
> accessibility trees from the same DOM if the HTML is well formed, but
> contains invalid nesting? Or does the accessibility tree not take
> account of an element's nesting?
>
> Steve
>
>
> -----Original Message-----
> From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of
> Patrick H. Lauke
> Sent: Tuesday, August 8, 2023 9:18 AM
> To: <EMAIL REMOVED>
> Subject: Re: [WebAIM] Relationship between WCAG and the ARIA in HTML
> specification
>
>
>
> On 08/08/2023 09:15, Patrick H. Lauke wrote:
>> https://html.spec.whatwg.org/#parse-errors
>
> Oops, fat finger...meant to point to the overall section
> https://html.spec.whatwg.org/#parsing
>
> (this is the part that was never defined in the original HTML spec,
> which caused browser engines to just implement their own secret sauce
> heuristics when they encountered misnested markup like
> <b><i>foo</b></i>
> - the latter being what 4.1.1 means when it talks about "nested
> according to the specification")
>
> P
> --
> Patrick H. Lauke
>
> https://www.splintered.co.uk/ | https://github.com/patrickhlauke
> https://flickr.com/photos/redux/ | https://www.deviantart.com/redux
> https://mastodon.social/@patrick_h_lauke | skype: patrick_h_lauke
> > > archives at http://webaim.org/discussion/archives
> > > > archives at http://webaim.org/discussion/archives
> >


--
Work hard. Have fun. Make history.