WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Chrome 80 Bug

for

From: JP Jamous
Date: Mar 16, 2020 7:01AM


Steve,

I cannot leave the <span> out. That is a markup that was generated by
developers. The <span> has a class to show the * in a certain way in the
original markup. I trimmed the markup down to troubleshoot the problem and
keep things simple. However, the <label> includes way more than what I
listed.

In either case, the semantic does not fail the HTML validator on W3C. Since
it works on all other browsers too, it should be Google's responsibility to
fix it.

I already filed the bug with them. I just wanted to check if anyone else has
experienced it. It came at me out of nowhere and I was surprised when JAWS
went silent on me as I tested it.

Thank you for taking a look at it.



==================================================
Jean-Pierre Jamous
Principal Digital Accessibility Engineer
Jepelsy LLC
==================================================

-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of Steve
Green
Sent: Monday, March 16, 2020 2:27 AM
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: Re: [WebAIM] Chrome 80 Bug

I have replicated this issue, and it is simpler than you say, at least on my
machine, which also has Chrome 80. I am looking at the <input> element's
accessible name in the developer tools rather than relying on a screen
reader, and the issue is just that the contents of the <strong> element are
not included in the <input> element's accessible name.

All your examples work as described, but you could have left out the <span>
elements.

I get the same behaviour whether the <label> is wrapped around the <input>
element or if they are associated by means of "for" and "id" attributes.

Steve Green
Managing Director
Test Partners Ltd


-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of JP
Jamous
Sent: 15 March 2020 19:55
To: 'WebAIM Discussion List' < <EMAIL REMOVED> >
Subject: [WebAIM] Chrome 80 Bug
Importance: High

When Chrome 80 was installed on my personal and work machines, running Win
10, I discovered that all Windows screen readers for the blind are not
reading label text that is inside a <strong> tag if a <span> tag in present
inside the <label>. When the Screen Reader user tabs through the form, only
the <span> text is announced. This was not present in any previous Chrome
versions. Here is an example:
<label for="first-name">
<strong>First Name</strong> <span>*</span>
<!-- Only the "*" is spoken. -->
</label>
<input type="text" id="first-name" required="required">

If I place the <span> before the <strong>, only the <span> text is spoken.
<label for="first-name">
<span*</span> <strong>First Name</strong
<!-- Only the "*" is spoken. -->
</label>
<input type="text" id="first-name" required="required">

If I insert the <span> inside the <strong>, then nothing is spoken.
<label for="first-name">
<strong>First Name <span>*</span></strong>
<!-- Nothing is spoken. -->
</label>
<input type="text" id="first-name" required="required">

I found this bug by accident. I have tried to figure out if it was a screen
reader bug, but all of my evaluations only failed in Chrome Version
80.0.3987.132 (Official Build) (64-bit). All 3 versions, of the markup
above, work fine with IE11, Edge, and Firefox 74.0 (64-bit) using both JAWS
2019, 2020 and NVDA 2019.1.1, 2019.3.1.

I have filed a bug with Google and was wondering if any of you have faced
this issue.




==================================================
Jean-Pierre Jamous
Principal Digital Accessibility Engineer Jepelsy LLC

W: (952) 666-2930
M: (952) 666-2930
<EMAIL REMOVED>

"The only limitations in life are those we set for ourselves"
==================================================


http://webaim.org/discussion/archives
http://webaim.org/discussion/archives