Skip to content

Commit 2518df1

Browse files
dandclarkchromium-wpt-export-bot
dandclark
authored and
chromium-wpt-export-bot
committed
[ReferenceTarget] Split property reflection tests to avoid timeout flakiness
This test is flaky because it has a high number of subtests and is bumping against the timeout threshold. Avoid this by splitting it into two tests. Bug: 375337253 Change-Id: I9a79e0f05d4c1f8710535efa420f4cf4c6316022 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6433006 Commit-Queue: Dan Clark <[email protected]> Reviewed-by: Alex Keng <[email protected]> Cr-Commit-Position: refs/heads/main@{#1442917}
1 parent 18c417a commit 2518df1

File tree

3 files changed

+129
-113
lines changed

3 files changed

+129
-113
lines changed

‎shadow-dom/reference-target/tentative/property-reflection-imperative-setup.html

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
<!DOCTYPE HTML>
2+
<html>
3+
<head>
4+
<script src="/html/resources/common.js"></script>
5+
<script src="/resources/testharness.js"></script>
6+
<script src="/resources/testharnessreport.js"></script>
7+
<script src="/resources/testdriver.js"></script>
8+
<script src="/resources/testdriver-vendor.js"></script>
9+
<script src="/resources/testdriver-actions.js"></script>
10+
<script src="/wai-aria/scripts/aria-utils.js"></script>
11+
<script src="resources/property-reflection-helper.js"></script>
12+
</head>
13+
<body>
14+
<div id="host-container"></div>
15+
<script>
16+
function append_test_imperatively(host_container, referenced_element_type) {
17+
host_container.setHTMLUnsafe('<div id="host-id"></div>');
18+
const host = host_container.firstElementChild;
19+
host.attachShadow({ mode: 'open', referenceTarget: 'target' });
20+
host.shadowRoot.innerHTML = `<${referenced_element_type} id="target"></${referenced_element_type}>`;
21+
return host;
22+
}
23+
24+
run_test_for_all_reflecting_properties(append_test_imperatively, test_property_reflection, " with imperative setup");
25+
</script>
26+
</body>
27+
</html>

‎shadow-dom/reference-target/tentative/property-reflection.html

+16-113
Original file line numberDiff line numberDiff line change
@@ -8,122 +8,26 @@
88
<script src="/resources/testdriver-vendor.js"></script>
99
<script src="/resources/testdriver-actions.js"></script>
1010
<script src="/wai-aria/scripts/aria-utils.js"></script>
11+
<script src="resources/property-reflection-helper.js"></script>
1112
</head>
1213
<body>
1314
<div id="host-container"></div>
1415
<script>
15-
const Behavior = Object.freeze({
16-
ReflectsHost: 'ReflectsHost',
17-
ReflectsHostInArray: 'ReflectsHostInArray',
18-
IsNull: 'IsNull',
19-
ReflectsHostID: 'ReflectsHostID',
20-
ReflectsHostIDInDOMTokenList: 'ReflectsHostIDInDOMTokenList',
21-
});
22-
23-
function test_property_reflection(element_creation_method, referencing_element_type, referenced_element_type, attribute, reflected_property, expected_behavior) {
24-
// There's nothing to test if the referencing element type doesn't have the reflecting
25-
// property.
26-
if (!(reflected_property in document.createElement(referencing_element_type))) {
27-
return;
28-
}
29-
30-
test(function () {
31-
const referencing_element = document.createElement(referencing_element_type);
32-
document.body.appendChild(referencing_element);
33-
referencing_element.setAttribute(attribute, "host-id");
34-
const host_container = document.querySelector("#host-container");
35-
const host = element_creation_method(host_container, referenced_element_type);
36-
if (expected_behavior === Behavior.ReflectsHost) {
37-
assert_equals(referencing_element[reflected_property], host);
38-
} else if (expected_behavior === Behavior.ReflectsHostInArray) {
39-
assert_array_equals(referencing_element[reflected_property], [host]);
40-
} else if (expected_behavior === Behavior.IsNull) {
41-
assert_equals(referencing_element[reflected_property], null);
42-
} else if (expected_behavior === Behavior.ReflectsHostID) {
43-
assert_equals(referencing_element[reflected_property], "host-id");
44-
} else if (expected_behavior === Behavior.ReflectsHostIDInDOMTokenList) {
45-
assert_true(referencing_element[reflected_property] instanceof DOMTokenList);
46-
assert_array_equals(Array.from(referencing_element[reflected_property]), ["host-id"]);
47-
}
48-
referencing_element.remove();
49-
host_container.setHTMLUnsafe("");
50-
}, `${referencing_element_type}.${reflected_property} has reflection behavior ${expected_behavior} when pointing to ${referenced_element_type} with reference target${element_creation_method.method_name}`);
51-
}
52-
53-
function appendTestDeclaratively(host_container, referenced_element_type) {
54-
host_container.setHTMLUnsafe(`
55-
<div id="host-id">
56-
<template shadowrootmode="open" shadowrootreferencetarget="target">
57-
<${referenced_element_type} id="target"></${referenced_element_type}>
58-
</template>
59-
</div>`);
60-
const host = host_container.firstElementChild;
61-
return host;
62-
}
63-
function appendTestWithOptions(host_container, referenced_element_type) {
64-
host_container.setHTMLUnsafe('<div id="host-id"></div>');
65-
const host = host_container.firstElementChild;
66-
host.attachShadow({ mode: 'open', referenceTarget: 'target' });
67-
host.shadowRoot.innerHTML = `<${referenced_element_type} id="target"></${referenced_element_type}>`;
68-
return host;
16+
function append_test_declaratively(host_container, referenced_element_type) {
17+
host_container.setHTMLUnsafe(`
18+
<div id="host-id">
19+
<template shadowrootmode="open" shadowrootreferencetarget="target">
20+
<${referenced_element_type} id="target"></${referenced_element_type}>
21+
</template>
22+
</div>`);
23+
const host = host_container.firstElementChild;
24+
return host;
6925
}
70-
const element_creation_methods = [
71-
appendTestDeclaratively,
72-
appendTestWithOptions,
73-
];
74-
element_creation_methods[0].method_name = '';
75-
element_creation_methods[1].method_name = ' via options';
76-
// We want to test types of elements that are associated with properties that can reflect other
77-
// elements and can therefore interact with reference target in interesting ways.
78-
// The HTML5_LABELABLE_ELEMENTS are defined in https://html.spec.whatwg.org/#category-label,
79-
// while non_labelable_element_types is a manually curated list of other elements with
80-
// reflecting properties (plus div as representative of more "normal" elements).
81-
// We'll test all permutations of these element types being both the referencing element
82-
// pointing into the reference target shadow host, and being the referenced element inside
83-
// the shadow.
84-
const non_labelable_element_types = ["div", "object", "label", "fieldset", "legend", "option", "datalist", "form"];
85-
const element_types = HTML5_LABELABLE_ELEMENTS.concat(non_labelable_element_types);
86-
87-
for(let element_creation_method of element_creation_methods) {
88-
for(let referencing_element_type of element_types) {
89-
for(let referenced_element_type of element_types) {
90-
test_property_reflection(element_creation_method, referencing_element_type, referenced_element_type, "aria-controls", "ariaControlsElements", Behavior.ReflectsHostInArray);
91-
test_property_reflection(element_creation_method, referencing_element_type, referenced_element_type, "aria-activedescendant", "ariaActiveDescendantElement", Behavior.ReflectsHost);
92-
test_property_reflection(element_creation_method, referencing_element_type, referenced_element_type, "aria-describedby", "ariaDescribedByElements", Behavior.ReflectsHostInArray);
93-
test_property_reflection(element_creation_method, referencing_element_type, referenced_element_type, "aria-details", "ariaDetailsElements", Behavior.ReflectsHostInArray);
94-
test_property_reflection(element_creation_method, referencing_element_type, referenced_element_type, "aria-errormessage", "ariaErrorMessageElements", Behavior.ReflectsHostInArray);
95-
test_property_reflection(element_creation_method, referencing_element_type, referenced_element_type, "aria-flowto", "ariaFlowToElements", Behavior.ReflectsHostInArray);
96-
test_property_reflection(element_creation_method, referencing_element_type, referenced_element_type, "aria-labelledby", "ariaLabelledByElements", Behavior.ReflectsHostInArray);
97-
test_property_reflection(element_creation_method, referencing_element_type, referenced_element_type, "aria-owns", "ariaOwnsElements", Behavior.ReflectsHostInArray);
98-
99-
test_property_reflection(element_creation_method, referencing_element_type, referenced_element_type, "anchor", "anchorElement", Behavior.ReflectsHost);
100-
test_property_reflection(element_creation_method, referencing_element_type, referenced_element_type, "commandfor", "commandForElement", Behavior.ReflectsHost);
101-
test_property_reflection(element_creation_method, referencing_element_type, referenced_element_type, "popovertarget", "popoverTargetElement", Behavior.ReflectsHost);
102-
test_property_reflection(element_creation_method, referencing_element_type, referenced_element_type, "interesttarget", "interestTargetElement", Behavior.ReflectsHost);
103-
104-
const expected_htmlFor_property_behavior = (referencing_element_type == "output") ? Behavior.ReflectsHostIDInDOMTokenList : Behavior.ReflectsHostID;
105-
test_property_reflection(element_creation_method, referencing_element_type, referenced_element_type, "for", "htmlFor", expected_htmlFor_property_behavior);
10626

107-
// The form property of <label>, <legend>, and <option> reflects the form property of the associated labelable element,
108-
// the associated <fieldset>, and the associated <select>, respectively. Here since we don't have those associated elements,
109-
// the form property would return null.
110-
const expected_form_property_behavior = (referenced_element_type == 'form' &&
111-
referencing_element_type != "label" &&
112-
referencing_element_type != "legend" &&
113-
referencing_element_type != "option") ? Behavior.ReflectsHost : Behavior.IsNull;
114-
test_property_reflection(element_creation_method, referencing_element_type, referenced_element_type, "form", "form", expected_form_property_behavior);
115-
116-
const expected_list_property_behavior = (referenced_element_type == 'datalist') ? Behavior.ReflectsHost : Behavior.IsNull;
117-
test_property_reflection(element_creation_method, referencing_element_type, referenced_element_type, "list", "list", expected_list_property_behavior);
118-
119-
const expected_control_property_behavior = HTML5_LABELABLE_ELEMENTS.includes(referenced_element_type) ? Behavior.ReflectsHost : Behavior.IsNull;
120-
test_property_reflection(element_creation_method, referencing_element_type, referenced_element_type, "for", "control", expected_control_property_behavior);
121-
}
122-
}
123-
}
27+
run_test_for_all_reflecting_properties(append_test_declaratively, test_property_reflection, "");
12428

12529
// Test that the corresponding properties return null when the reference target has invalid ID.
126-
function appendTestDeclarativelyWithInvalidID(host_container, referenced_element_type) {
30+
function append_test_declaratively_with_invalid_id(host_container, referenced_element_type) {
12731
host_container.setHTMLUnsafe(`
12832
<div id="host-id">
12933
<template shadowrootmode="open" shadowrootreferencetarget="invalid-id">
@@ -135,9 +39,9 @@
13539
}
13640
for(let referencing_element_type of element_types) {
13741
for(let referenced_element_type of element_types) {
138-
test_property_reflection(appendTestDeclarativelyWithInvalidID, referencing_element_type, referenced_element_type, "form", "form", Behavior.IsNull);
139-
test_property_reflection(appendTestDeclarativelyWithInvalidID, referencing_element_type, referenced_element_type, "list", "list", Behavior.IsNull);
140-
test_property_reflection(appendTestDeclarativelyWithInvalidID, referencing_element_type, referenced_element_type, "for", "control", Behavior.IsNull);
42+
test_property_reflection(append_test_declaratively_with_invalid_id, referencing_element_type, referenced_element_type, "form", "form", Behavior.IsNull);
43+
test_property_reflection(append_test_declaratively_with_invalid_id, referencing_element_type, referenced_element_type, "list", "list", Behavior.IsNull);
44+
test_property_reflection(append_test_declaratively_with_invalid_id, referencing_element_type, referenced_element_type, "for", "control", Behavior.IsNull);
14145
}
14246
}
14347

@@ -146,13 +50,12 @@
14650
document.body.appendChild(referencing_element);
14751
referencing_element.setAttribute('for', "host-id");
14852
const host_container = document.querySelector("#host-container");
149-
const host = appendTestDeclaratively(host_container, 'input');
53+
const host = append_test_declaratively(host_container, 'input');
15054
const referenced_element = host.shadowRoot.getElementById('target');
15155
assert_array_equals(Array.from(referenced_element['labels']), [referencing_element]);
15256
referencing_element.remove();
15357
host_container.setHTMLUnsafe("");
15458
}, `The .labels property of the referenced input element should point to the referencing label element`);
15559
</script>
15660
</body>
157-
15861
</html>

‎shadow-dom/reference-target/tentative/resources/property-reflection-helper.js

+86
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,86 @@
1+
const Behavior = Object.freeze({
2+
ReflectsHost: 'ReflectsHost',
3+
ReflectsHostInArray: 'ReflectsHostInArray',
4+
IsNull: 'IsNull',
5+
ReflectsHostID: 'ReflectsHostID',
6+
ReflectsHostIDInDOMTokenList: 'ReflectsHostIDInDOMTokenList',
7+
});
8+
9+
// We want to test types of elements that are associated with properties that can reflect other
10+
// elements and can therefore interact with reference target in interesting ways.
11+
// The HTML5_LABELABLE_ELEMENTS are defined in https://html.spec.whatwg.org/#category-label,
12+
// while non_labelable_element_types is a manually curated list of other elements with
13+
// reflecting properties (plus div as representative of more "normal" elements).
14+
// We'll test all permutations of these element types being both the referencing element
15+
// pointing into the reference target shadow host, and being the referenced element inside
16+
// the shadow.
17+
const non_labelable_element_types = ["div", "object", "label", "fieldset", "legend", "option", "datalist", "form"];
18+
const element_types = HTML5_LABELABLE_ELEMENTS.concat(non_labelable_element_types);
19+
20+
function test_property_reflection(element_creation_method, test_name_suffix, referencing_element_type, referenced_element_type, attribute, reflected_property, expected_behavior) {
21+
// There's nothing to test if the referencing element type doesn't have the reflecting
22+
// property.
23+
if (!(reflected_property in document.createElement(referencing_element_type))) {
24+
return;
25+
}
26+
27+
test(function () {
28+
const referencing_element = document.createElement(referencing_element_type);
29+
document.body.appendChild(referencing_element);
30+
referencing_element.setAttribute(attribute, "host-id");
31+
const host_container = document.querySelector("#host-container");
32+
const host = element_creation_method(host_container, referenced_element_type);
33+
if (expected_behavior === Behavior.ReflectsHost) {
34+
assert_equals(referencing_element[reflected_property], host);
35+
} else if (expected_behavior === Behavior.ReflectsHostInArray) {
36+
assert_array_equals(referencing_element[reflected_property], [host]);
37+
} else if (expected_behavior === Behavior.IsNull) {
38+
assert_equals(referencing_element[reflected_property], null);
39+
} else if (expected_behavior === Behavior.ReflectsHostID) {
40+
assert_equals(referencing_element[reflected_property], "host-id");
41+
} else if (expected_behavior === Behavior.ReflectsHostIDInDOMTokenList) {
42+
assert_true(referencing_element[reflected_property] instanceof DOMTokenList);
43+
assert_array_equals(Array.from(referencing_element[reflected_property]), ["host-id"]);
44+
}
45+
referencing_element.remove();
46+
host_container.setHTMLUnsafe("");
47+
}, `${referencing_element_type}.${reflected_property} has reflection behavior ${expected_behavior} when pointing to ${referenced_element_type} with reference target${test_name_suffix}`);
48+
}
49+
50+
function run_test_for_all_reflecting_properties(setup_function, test_function, test_name_suffix) {
51+
for(let referencing_element_type of element_types) {
52+
for(let referenced_element_type of element_types) {
53+
test_function(setup_function, test_name_suffix, referencing_element_type, referenced_element_type, "aria-controls", "ariaControlsElements", Behavior.ReflectsHostInArray);
54+
test_function(setup_function, test_name_suffix, referencing_element_type, referenced_element_type, "aria-activedescendant", "ariaActiveDescendantElement", Behavior.ReflectsHost);
55+
test_function(setup_function, test_name_suffix, referencing_element_type, referenced_element_type, "aria-describedby", "ariaDescribedByElements", Behavior.ReflectsHostInArray);
56+
test_function(setup_function, test_name_suffix, referencing_element_type, referenced_element_type, "aria-details", "ariaDetailsElements", Behavior.ReflectsHostInArray);
57+
test_function(setup_function, test_name_suffix, referencing_element_type, referenced_element_type, "aria-errormessage", "ariaErrorMessageElements", Behavior.ReflectsHostInArray);
58+
test_function(setup_function, test_name_suffix, referencing_element_type, referenced_element_type, "aria-flowto", "ariaFlowToElements", Behavior.ReflectsHostInArray);
59+
test_function(setup_function, test_name_suffix, referencing_element_type, referenced_element_type, "aria-labelledby", "ariaLabelledByElements", Behavior.ReflectsHostInArray);
60+
test_function(setup_function, test_name_suffix, referencing_element_type, referenced_element_type, "aria-owns", "ariaOwnsElements", Behavior.ReflectsHostInArray);
61+
62+
test_function(setup_function, test_name_suffix, referencing_element_type, referenced_element_type, "anchor", "anchorElement", Behavior.ReflectsHost);
63+
test_function(setup_function, test_name_suffix, referencing_element_type, referenced_element_type, "commandfor", "commandForElement", Behavior.ReflectsHost);
64+
test_function(setup_function, test_name_suffix, referencing_element_type, referenced_element_type, "popovertarget", "popoverTargetElement", Behavior.ReflectsHost);
65+
test_function(setup_function, test_name_suffix, referencing_element_type, referenced_element_type, "interesttarget", "interestTargetElement", Behavior.ReflectsHost);
66+
67+
const expected_htmlFor_property_behavior = (referencing_element_type == "output") ? Behavior.ReflectsHostIDInDOMTokenList : Behavior.ReflectsHostID;
68+
test_function(setup_function, test_name_suffix, referencing_element_type, referenced_element_type, "for", "htmlFor", expected_htmlFor_property_behavior);
69+
70+
// The form property of <label>, <legend>, and <option> reflects the form property of the associated labelable element,
71+
// the associated <fieldset>, and the associated <select>, respectively. Here since we don't have those associated elements,
72+
// the form property would return null.
73+
const expected_form_property_behavior = (referenced_element_type == 'form' &&
74+
referencing_element_type != "label" &&
75+
referencing_element_type != "legend" &&
76+
referencing_element_type != "option") ? Behavior.ReflectsHost : Behavior.IsNull;
77+
test_function(setup_function, test_name_suffix, referencing_element_type, referenced_element_type, "form", "form", expected_form_property_behavior);
78+
79+
const expected_list_property_behavior = (referenced_element_type == 'datalist') ? Behavior.ReflectsHost : Behavior.IsNull;
80+
test_function(setup_function, test_name_suffix, referencing_element_type, referenced_element_type, "list", "list", expected_list_property_behavior);
81+
82+
const expected_control_property_behavior = HTML5_LABELABLE_ELEMENTS.includes(referenced_element_type) ? Behavior.ReflectsHost : Behavior.IsNull;
83+
test_function(setup_function, test_name_suffix, referencing_element_type, referenced_element_type, "for", "control", expected_control_property_behavior);
84+
}
85+
}
86+
}

0 commit comments

Comments
 (0)