Bug 211176 - AX: support alternative text for "content" property
Summary: AX: support alternative text for "content" property
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Accessibility (show other bugs)
Version: Safari Technology Preview
Hardware: All All
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2020-04-29 02:41 PDT by Haroen Viaene
Modified: 2020-05-12 09:46 PDT (History)
5 users (show)

See Also:


Attachments
Picture (90.10 KB, image/png)
2020-05-12 09:46 PDT, chris fleizach
no flags Details

Note You need to log in before you can comment on or make changes to this bug.
Description Haroen Viaene 2020-04-29 02:41:32 PDT
By default, the text in a "before" or "after" generated content will be read by a screen reader, but it's often used for things like "★", which, if they were a DOM element would warrant an aria-label. Giving alternative text in the generated content directly will help people to give a better alternative, or to suppress certain decorative character

Chrome seems to have shipped this: https://groups.google.com/a/chromium.org/forum/#!topic/blink-dev/nC5p6W8nM3g

Issue in FireFox: https://bugzilla.mozilla.org/show_bug.cgi?id=1281158

The spec seems to be here: https://drafts.csswg.org/css-content-3/#alt
Comment 1 Radar WebKit Bug Importer 2020-04-29 02:41:42 PDT
<rdar://problem/62585984>
Comment 2 chris fleizach 2020-04-29 09:47:23 PDT
It looks like we support

[aria-expanded="test6"]::before {
    content: "\25BC";
    alt: "test";
}

but probably not this style

.new::before {
 content: url(./img/star.png) / "New!";
  /* or a localized attribute from the DOM: attr("data-alt") */
}
Comment 3 Jorge Fernandes 2020-05-12 00:21:54 PDT
(In reply to chris fleizach from comment #2)
> It looks like we support
> 
> [aria-expanded="test6"]::before {
>     content: "\25BC";
>     alt: "test";
> }
> 
> but probably not this style
> 
> .new::before {
>  content: url(./img/star.png) / "New!";
>   /* or a localized attribute from the DOM: attr("data-alt") */
> }

I tried 

> [aria-expanded="test6"]::before {
>     content: "\25BC";
>     alt: "test";
> }

and VO don't read the alt.
Comment 4 chris fleizach 2020-05-12 09:45:47 PDT
This appears to work for me. see the screen shot

<style>
.new::before {
    content: "\25BC";
     alt: "test";
 }
</style>

<div class="new">hello</div>
Comment 5 chris fleizach 2020-05-12 09:46:08 PDT
Created attachment 399136 [details]
Picture