Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

AccName: additional text node tests #42407

Merged
merged 11 commits into from
Nov 3, 2023
Merged

AccName: additional text node tests #42407

Show file tree
Hide file tree
Changes from 9 commits
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
2209875
text node tests for whitespace, etc.
cookiecrook Oct 6, 2023
a324df1
normalize interior whitespace after discussion with accname editors a…
cookiecrook Oct 11, 2023
9e28d6e
m. trailing whitespace lint
cookiecrook Oct 11, 2023
9a7f8a9
update whitespace normalization to match 'ascii whitespace' as define…
cookiecrook Oct 13, 2023
35f41ee
m. extraneous comment from local testing
cookiecrook Oct 13, 2023
a9b092b
m. lint
cookiecrook Oct 13, 2023
955df07
Apply suggestions from code review
cookiecrook Oct 13, 2023
d51d6b1
m. typo
cookiecrook Oct 13, 2023
c8399e7
Apply suggestions from code review
cookiecrook Oct 18, 2023
f1b2ca4
m. editorial from jugglinmike
cookiecrook Oct 26, 2023
260d5e5
review feedback from rahimabdi; add tests using explicit role assignment
cookiecrook Nov 2, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
91 changes: 82 additions & 9 deletions accname/name/comp_text_node.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,23 +13,96 @@

<p>Tests the <a href="https://w3c.github.io/accname/#comp_text_node">#comp_text_node</a> portions of the AccName <em>Name Computation</em> algorithm.</p>
cookiecrook marked this conversation as resolved.
Show resolved Hide resolved

<!-- I'm not certain whether #comp_text_node requires a lot of testing outside of the #comp_name_from_content contexts, -->
<!-- but I did think of one example where text node versus comment node may make a difference when joining text nodes with a space vs innerText. -->
<!-- Note: some overlap with the tests in ./comp_name_from_content.html -->
cookiecrook marked this conversation as resolved.
Show resolved Hide resolved

<!-- Skipped (class="ex" removed) until https://github.com/w3c/accname/issues/193 is resolved -->
<h2 class="ex-skipped" data-expectedlabel="heading label" data-testname="heading with text/comment/text nodes, no space">
heading<!-- with non-text node splitting concatenated text nodes -->label<!-- [sic] no extra spaces around first comment -->
</h2>

<h1>text/element/text nodes, no space</h1>
cookiecrook marked this conversation as resolved.
Show resolved Hide resolved
<button class="ex" data-expectedlabel="buttonlabel" data-testname="button with text/element/text nodes, no space">button<span></span>label</button>
<h3 class="ex" data-expectedlabel="headinglabel" data-testname="heading with text/element/text nodes, no space">heading<span></span>label</h3>
<a href="#" class="ex" data-expectedlabel="linklabel" data-testname="link with text/element/text nodes, no space">link<span></span>label</a>
<br>

<h1>text/comment/text nodes, no space</h1>
<!-- Note: This set is not currently to spec until https://github.com/w3c/accname/issues/193 is resolved. -->
<button class="ex" data-expectedlabel="buttonlabel" data-testname="button with text/comment/text nodes, no space">
button<!-- with non-text node splitting concatenated text nodes -->label<!-- [sic] no extra spaces around first comment -->
</button>
<h3 class="ex" data-expectedlabel="headinglabel" data-testname="heading with text/comment/text nodes, no space">
heading<!-- with non-text node splitting concatenated text nodes -->label<!-- [sic] no extra spaces around first comment -->
</h3>
<a href="#" class="ex" data-expectedlabel="linklabel" data-testname="link with text/comment/text nodes, no space">
link<!-- with non-text node splitting concatenated text nodes -->label<!-- [sic] no extra spaces around first comment -->
</a>
<br>

<h2 class="ex" data-expectedlabel="heading label" data-testname="heading with text/comment/text nodes, with space">
<h1>text/comment/text nodes, with space</h1>
<button class="ex" data-expectedlabel="button label" data-testname="button with text/comment/text nodes, with space">
button
<!-- comment node between text nodes with leading/trailing whitespace -->
label
</button>
<h3 class="ex" data-expectedlabel="heading label" data-testname="heading with text/comment/text nodes, with space">
heading
<!-- comment node between text nodes with leading/trailing whitespace -->
label
</h2>
</h3>
<a href="#" class="ex" data-expectedlabel="link label" data-testname="link with text/comment/text nodes, with space">
link
<!-- comment node between text nodes with leading/trailing whitespace -->
label
</a>
<br>

<h1>text node, with tab char</h1>
<button class="ex" data-expectedlabel="button label" data-testname="button with text node, with tab char">button label</button>
<h3 class="ex" data-expectedlabel="heading label" data-testname="heading with text node, with tab char">heading label</h3>
<a href="#" class="ex" data-expectedlabel="link label" data-testname="link with text node, with tab char">link label</a>
<br>

<h1>text node, with non-breaking space</h1>
<button class="ex" data-expectedlabel="button&nbsp;label" data-testname="button with text node, with non-breaking space">button&nbsp;label</button>
<h3 class="ex" data-expectedlabel="heading&nbsp;label" data-testname="heading with text node, with non-breaking space">heading&nbsp;label</h3>
<a href="#" class="ex" data-expectedlabel="link&nbsp;label" data-testname="link with text node, with non-breaking space">link&nbsp;label</a>
<br>

<h1>text node, with extra non-breaking space</h1>
<button class="ex" data-expectedlabel="button&nbsp;&nbsp;&nbsp;label" data-testname="button with text node, with extra non-breaking space">button&nbsp;&nbsp;&nbsp;label</button>
<h3 class="ex" data-expectedlabel="heading&nbsp;&nbsp;&nbsp;label" data-testname="heading with text node, with extra non-breaking space">heading&nbsp;&nbsp;&nbsp;label</h3>
<a href="#" class="ex" data-expectedlabel="link&nbsp;&nbsp;&nbsp;label" data-testname="link with text node, with extra non-breaking space">link&nbsp;&nbsp;&nbsp;label</a>
<br>

<h1>text node, with leading/trailing non-breaking space</h1>
<button class="ex" data-expectedlabel="button&nbsp;label" data-testname="button with text node, with leading/trailing non-breaking space">&nbsp;button&nbsp;label&nbsp;</button>
<h3 class="ex" data-expectedlabel="heading&nbsp;label" data-testname="heading with text node, with leading/trailing non-breaking space">&nbsp;heading&nbsp;label&nbsp;</h3>
<a href="#" class="ex" data-expectedlabel="link&nbsp;label" data-testname="link with text node, with leading/trailing non-breaking space">&nbsp;link&nbsp;label&nbsp;</a>
<br>

<h1>text node, with leading/trailing non-breaking space</h1>
cookiecrook marked this conversation as resolved.
Show resolved Hide resolved
<button class="ex" data-expectedlabel="button &nbsp; label" data-testname="button with text node, with mixed space and non-breaking space">button &nbsp; label</button>
cookiecrook marked this conversation as resolved.
Show resolved Hide resolved
<h3 class="ex" data-expectedlabel="heading &nbsp; label" data-testname="heading with text node, with mixed space and non-breaking space">heading &nbsp; label</h3>
<a href="#" class="ex" data-expectedlabel="link &nbsp; label" data-testname="link with text node, with mixed space and non-breaking space">link &nbsp; label</a>
<br>

<h1>text nodes, with deeply nested space</h1>
<button class="ex" data-expectedlabel="button label" data-testname="button with text node, with deeply nested space">
button<span><span><span><span><span><span><span> </span></span></span></span></span></span></span>label
</button>
<h3 class="ex" data-expectedlabel="heading label" data-testname="heading with text node, with deeply nested space">
heading<span><span><span><span><span><span><span> </span></span></span></span></span></span></span>label
</h3>
<a href="#" class="ex" data-expectedlabel="link label" data-testname="link with text node, with deeply nested space">
link<span><span><span><span><span><span><span> </span></span></span></span></span></span></span>label
</a>
<br>

<!-- Todo: test all remaining cases of https://w3c.github.io/accname/#comp_text_node -->
<h1>text nodes, with single line break</h1>
<button class="ex" data-expectedlabel="button label" data-testname="button with text node, with single line break">button
label</button>
<h3 class="ex" data-expectedlabel="heading label" data-testname="heading with text node, with single line break">heading
label</h3>
<a href="#" class="ex" data-expectedlabel="link label" data-testname="link with text node, with single line break">link
label</a>
<br>

<script>
AriaUtils.verifyLabelsBySelector(".ex");
Expand Down
15 changes: 13 additions & 2 deletions wai-aria/scripts/aria-utils.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -138,8 +138,19 @@ const AriaUtils = {
promise_test(async t => {
const expectedLabel = el.getAttribute("data-expectedlabel");
let computedLabel = await test_driver.get_computed_label(el);
// Todo: Remove whitespace normalization after https://github.com/w3c/accname/issues/192 is addressed. Change prior line back to `const`, too.
computedLabel = computedLabel.trim()

// See:
// - https://github.com/w3c/accname/pull/165
// - https://github.com/w3c/accname/issues/192
// - https://github.com/w3c/accname/issues/208
//
// AccName references HTML's definition of ASCII Whitespace
// https://infra.spec.whatwg.org/#ascii-whitespace
// which matches tab (\t), newline (\n), formfeed (\f), return (\r), and regular space (\u0020).
// but it does NOT match non-breaking space (\xA0,\u00A0) and others matched by \s
const asciiWhitespace = /[\t\n\f\r\u0020]+/g;
computedLabel = computedLabel.replace(asciiWhitespace, '\u0020').replace(/^\u0020|\u0020$/g, '');

assert_equals(computedLabel, expectedLabel, el.outerHTML);
}, `${testName}`);
}
Expand Down