Skip to content

Commit ea921fe

Browse files
janewmanchromium-wpt-export-bot
janewman
authored and
chromium-wpt-export-bot
committed
[focusgroup] Align ParseFocusgroup with latest spec draft
Align the focusgroup attribute parsing with the formal "determine the focusgroup state" algorithm defined in the HTML spec PR: whatwg/html#11723. With this change, "none" and the behavior token can appear at any position. Before, the these were required to be the first token or parsing would fire an error. Bug: 4021071 Change-Id: Ic258d4fc39f9850c5cabac2b4afa0dbcf6c32d95 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/7871960 Commit-Queue: Jacques Newman <janewman@microsoft.com> Reviewed-by: Mason Freed <masonf@chromium.org> Cr-Commit-Position: refs/heads/main@{#1637192}
1 parent 6a1875d commit ea921fe

2 files changed

Lines changed: 117 additions & 0 deletions

File tree

‎html/interaction/focus/focusgroup/tentative/behavior-token-anywhere.html‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
<!DOCTYPE html>
2+
<meta charset="utf-8">
3+
<title>HTML Test: focusgroup - Behavior token recognized at any position</title>
4+
<link rel="author" title="Microsoft" href="http://www.microsoft.com/">
5+
<link rel="help" href="https://html.spec.whatwg.org/multipage/interaction.html#the-focusgroup-attribute">
6+
<script src="/resources/testharness.js"></script>
7+
<script src="/resources/testharnessreport.js"></script>
8+
<script src="/resources/testdriver.js"></script>
9+
<script src="/resources/testdriver-vendor.js"></script>
10+
<script src="/resources/testdriver-actions.js"></script>
11+
<script src="/shadow-dom/focus-navigation/resources/focus-utils.js"></script>
12+
<script src="resources/focusgroup-utils.js"></script>
13+
14+
<div id=modifier-first focusgroup="wrap toolbar">
15+
<span id=item1 tabindex=0>item1</span>
16+
<span id=item2 tabindex=0>item2</span>
17+
</div>
18+
19+
<script>
20+
promise_test(async t => {
21+
await focusAndSendDirectionalInput(item1, kRight);
22+
assert_equals(document.activeElement, item2,
23+
"'wrap toolbar' should parse toolbar as the behavior; arrow key should navigate");
24+
}, "Behavior token after a modifier enables focusgroup navigation");
25+
</script>
26+
27+
<div id=invalid-first focusgroup="invalid toolbar">
28+
<span id=item3 tabindex=0>item3</span>
29+
<span id=item4 tabindex=0>item4</span>
30+
</div>
31+
32+
<script>
33+
promise_test(async t => {
34+
await focusAndSendDirectionalInput(item3, kRight);
35+
assert_equals(document.activeElement, item4,
36+
"'invalid toolbar' should find toolbar as the first recognized behavior");
37+
}, "Unrecognized token before behavior token does not prevent focusgroup");
38+
</script>
39+
40+
<div id=wrap-before focusgroup="wrap toolbar">
41+
<span id=item5 tabindex=0>item5</span>
42+
<span id=item6 tabindex=0>item6</span>
43+
</div>
44+
45+
<script>
46+
promise_test(async t => {
47+
// Toolbar defaults to inline axis. Wrap should enable wrapping.
48+
// Navigate forward past the last item to test wrap behavior.
49+
await focusAndSendDirectionalInput(item6, kRight);
50+
assert_equals(document.activeElement, item5,
51+
"'wrap toolbar' should wrap from last item to first");
52+
}, "Modifier before behavior token applies correctly (wrap works)");
53+
</script>
54+
55+
<div id=no-behavior focusgroup="wrap block">
56+
<span id=item7 tabindex=0>item7</span>
57+
<span id=item8 tabindex=0>item8</span>
58+
</div>
59+
60+
<script>
61+
promise_test(async t => {
62+
await focusAndSendDirectionalInput(item7, kDown);
63+
assert_equals(document.activeElement, item7,
64+
"'wrap block' with no behavior token should not enable navigation");
65+
}, "Modifier-only focusgroup attribute without behavior token has no effect");
66+
</script>

‎html/interaction/focus/focusgroup/tentative/none-anywhere-opts-out.html‎

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
<!DOCTYPE html>
2+
<meta charset="utf-8">
3+
<title>HTML Test: focusgroup - 'none' anywhere in token list opts out</title>
4+
<link rel="author" title="Microsoft" href="http://www.microsoft.com/">
5+
<link rel="help" href="https://html.spec.whatwg.org/multipage/interaction.html#the-focusgroup-attribute">
6+
<script src="/resources/testharness.js"></script>
7+
<script src="/resources/testharnessreport.js"></script>
8+
<script src="/resources/testdriver.js"></script>
9+
<script src="/resources/testdriver-vendor.js"></script>
10+
<script src="/resources/testdriver-actions.js"></script>
11+
<script src="/shadow-dom/focus-navigation/resources/focus-utils.js"></script>
12+
<script src="resources/focusgroup-utils.js"></script>
13+
14+
<div id=none-after focusgroup="toolbar none">
15+
<span id=item1 tabindex=0>item1</span>
16+
<span id=item2 tabindex=0>item2</span>
17+
</div>
18+
19+
<script>
20+
promise_test(async t => {
21+
await focusAndSendDirectionalInput(item1, kRight);
22+
assert_equals(document.activeElement, item1,
23+
"'toolbar none' should opt out; arrow key should not move focus");
24+
}, "'none' after a behavior token opts out of focusgroup navigation");
25+
</script>
26+
27+
<div id=none-between focusgroup="toolbar wrap none block">
28+
<span id=item3 tabindex=0>item3</span>
29+
<span id=item4 tabindex=0>item4</span>
30+
</div>
31+
32+
<script>
33+
promise_test(async t => {
34+
await focusAndSendDirectionalInput(item3, kRight);
35+
assert_equals(document.activeElement, item3,
36+
"'toolbar wrap none block' should opt out; arrow key should not move focus");
37+
}, "'none' between other tokens opts out of focusgroup navigation");
38+
</script>
39+
40+
<div id=none-alone focusgroup="none">
41+
<span id=item5 tabindex=0>item5</span>
42+
<span id=item6 tabindex=0>item6</span>
43+
</div>
44+
45+
<script>
46+
promise_test(async t => {
47+
await focusAndSendDirectionalInput(item5, kRight);
48+
assert_equals(document.activeElement, item5,
49+
"'none' alone should opt out; arrow key should not move focus");
50+
}, "'none' alone opts out of focusgroup navigation (baseline)");
51+
</script>

0 commit comments

Comments
 (0)