Skip to content

Commit cde4ad4

Browse files
handling review thread act-rules#2075 (comment) like this:
- changing the visible-inner-text definition to treat <p> w/ "display: inline" differently. (treats it differently effectively, not explicitly.) - adding a passed example which shows a corresponding <p> w/ "display: inline" case.
1 parent b2df021 commit cde4ad4

2 files changed

Lines changed: 17 additions & 7 deletions

File tree

_rules/visible-label-in-accessible-name-2ee8b8.md

Lines changed: 17 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -141,21 +141,31 @@ Similar to the previous example.
141141

142142
#### Passed Example 9
143143

144+
The [visible inner text][] of this link is "ACT" (with no spaces) because of the explicit styles of "display: inline" on the &lt;p&gt; elements and the absence of whitespace between the &lt;p&gt; elements. The cases of "display: inline" and "display: block" are handled by the definition of [visible inner text of an element][]. This example shows that the definition agrees with the visual rendering done by the browser.
145+
146+
```html
147+
<a href="#" aria-label="ACT">
148+
<p style="display: inline">A</p><p style="display: inline">C</p><p style="display: inline">T</p>
149+
</a>
150+
```
151+
152+
#### Passed Example 10
153+
144154
The [visible inner text][] is "Download specification". The words "the" and "gizmo" aren't part of it.
145155

146156
```html
147157
<a aria-label="Download specification" href="#">Download <span style="visibility: hidden">the</span> <span style="display: none">gizmo</span> specification</a>
148158
```
149159

150-
#### Passed Example 10
160+
#### Passed Example 11
151161

152162
The [visible inner text][] is "Download specification", which includes a space character between the two words due to the second clause of the definition of [visible inner text of a text node][].
153163

154164
```html
155165
<a aria-label="Download specification" href="#"><span>Download</span><span id="space"> </span><span>specification</span></a>
156166
```
157167

158-
#### Passed Example 11
168+
#### Passed Example 12
159169

160170
This example shows that the [visible inner text][] isn't always the same as the [innerText][https://html.spec.whatwg.org/multipage/dom.html#the-innertext-idl-attribute]. The visible inner text is "Download specification". The innerText is 'Download \ngizmo\nspecification'. This rule uses the visible inner text - not innerText.
161171

@@ -174,31 +184,31 @@ This example shows that the [visible inner text][] isn't always the same as the
174184
<a aria-label="Download specification" href="#">Download <span class="visually-hidden">gizmo</span> specification</a>
175185
```
176186

177-
#### Passed Example 12
187+
#### Passed Example 13
178188

179189
This example shows that the [label in name algorithm][] handles many kinds of whitespace.
180190

181191
```html
182192
<a aria-label="compose email" href="#">compose &nbsp;&nbsp;<br> email</a>
183193
```
184194

185-
#### Passed Example 13
195+
#### Passed Example 14
186196

187197
This example passes the rule because "YYYY-MM-DD" is in brackets. Text in brackets is removed by the [label in name algorithm][], because its not normally spoken by speech-input users.
188198

189199
```html
190200
<button aria-label="Search by date">Search by date (YYYY-MM-DD)</button>
191201
```
192202

193-
#### Passed Example 14
203+
#### Passed Example 15
194204

195205
The passes for two reasons: 1) because the ellipsis ("…") is [non-text content][], and 2) because the ellipsis is neither a letter nor a digit and so is filtered out by the [label in name algorithm][].
196206

197207
```html
198208
<button aria-label="Next">Next…</button>
199209
```
200210

201-
#### Passed Example 15
211+
#### Passed Example 16
202212

203213
This passes because the [label in name algorithm][] effectively ignores all punctuation and emoji, in both the visible inner text and the accessible name, as long as they don't break up words.
204214

@@ -392,6 +402,7 @@ This link has no [visible inner text][].
392402
[visible]: #visible 'Definition of visible'
393403
[visible inner text]: #visible-inner-text 'Definition of Visible inner text'
394404
[visible inner text of a text node]: #visible-inner-text:for-text 'Definition of Visible inner text of a text node'
405+
[visible inner text of an element]: #visible-inner-text:for-element 'Definition of Visible inner text of an element'
395406
[visible text content]: #visible-text-content 'Definition of Visible text content'
396407
[whitespace]: #whitespace 'Definition of Whitespace'
397408
[widget role]: https://www.w3.org/TR/wai-aria-1.1/#widget_roles 'Definition of Widget role'

pages/glossary/visible-inner-text.md

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,6 @@ The <dfn id="visible-inner-text:for-text">visible inner text of a [text node][]<
2121
The <dfn id="visible-inner-text:for-element">visible inner text of an [element][]</dfn> is:
2222
- if the [element][] is not [rendered][], its visible inner text is the empty string (`""`);
2323
- if the [element][] is a [`<br>`][<br>] element, its visible inner text is a newline character (`"\n"`);
24-
- if the [element][] is a [`<p>`][<p>] element, its visible inner text is the concatenation a newline character (`"\n"`) plus the visible inner text of its children (in [tree order][] in the [flat tree][]), plus a newline character (`"\n"`);
2524
- if the [computed][] [`display`][display] property of the [element][] has an [outer display type][] of `block`, or an [inner display type][] of `table-caption`, the visible inner text of the [element][] is the concatenation of a newline character (`"\n"`) plus the visible inner text of its children (in [tree order][] in the [flat tree][]) plus a newline character (`"\n"`);
2625
- if the [computed][] [`display`][display] property of the [element][] has an [inner display type][] of `table-cell` or `table-row`, the visible inner text of the [element][] is the concatenation of an ASCII space character (`" "`) plus the visible inner text of its children (in [tree order][] in the [flat tree][]) plus an ASCII space character (`" "`);
2726
- otherwise, the visible inner text of the [element][] is the concatenation of the visible inner text of its children (in [tree order][] in the [flat tree][]).

0 commit comments

Comments
 (0)