Skip to content

Commit 6be69c8

Browse files
committed
Update custom elements web platform tests
https://bugs.webkit.org/show_bug.cgi?id=302435 Reviewed by Anne van Kesteren. Update custom elements web platform test as of d29d199654b6bcb04c39901066e99702dec35135. * LayoutTests/imported/w3c/web-platform-tests/custom-elements/behaves-like-button-with-popover.tentative-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/custom-elements/behaves-like-button-with-popover.tentative.html: Added. * LayoutTests/imported/w3c/web-platform-tests/custom-elements/behaves-like-button.tentative-expected.txt: Removed. * LayoutTests/imported/w3c/web-platform-tests/custom-elements/behaves-like-button.tentative.html: Removed. * LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/Element-innerHTML-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/Element-innerHTML.html: * LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/ShadowRoot-init-customElementRegistry-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/ShadowRoot-init-customElementRegistry.html: * LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/ShadowRoot-init-declarative-expected.txt: Removed. * LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/ShadowRoot-init-declarative.html: Removed. * LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/WEB_FEATURES.yml: * LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/element-mutation-expected.txt: Removed. * LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/element-mutation.html: Removed. * LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/scoped-registry-define-upgrade-criteria-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/scoped-registry-define-upgrade-criteria.html: * LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/valid-custom-element-names-expected.txt: * LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/valid-custom-element-names.html: * LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/w3c-import.log: * LayoutTests/imported/w3c/web-platform-tests/custom-elements/w3c-import.log: Canonical link: https://commits.webkit.org/303038@main
1 parent c8e499c commit 6be69c8

19 files changed

+201
-2246
lines changed
Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
2+
PASS Autonomous custom element without ElementInternals.type=button does not support the popovertarget attribute.
3+
FAIL Custom element with type=button and popovertargetaction='toggle' toggles popover. assert_true: Toggle popover should open after first click expected true got false
4+
FAIL Custom element with type=button and popovertargetaction='show' only opens popover. assert_true: Show popover should open after first click expected true got false
5+
FAIL Custom element with type=button and popovertargetaction='hide' only closes popover. assert_false: Hide popover should close after first click expected false got true
6+
FAIL Custom element with type=button that is disabled does not support popovertarget. assert_true: Enabled button should open popover expected true got false
7+
Lines changed: 151 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,151 @@
1+
<!DOCTYPE HTML>
2+
<html>
3+
4+
<head>
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+
</head>
12+
13+
<body>
14+
<custom-element popovertarget="testPopover" id="testElement"></custom-element>
15+
<custom-button popovertarget="testPopover" id="testButton"></custom-button>
16+
<div id="testPopover" popover>
17+
Test popover for custom element button behavior
18+
</div>
19+
20+
<script>
21+
class CustomButton extends HTMLElement {
22+
static formAssociated = true;
23+
constructor() {
24+
super();
25+
this.internals_ = this.attachInternals();
26+
this.internals_.type = "button";
27+
}
28+
29+
get disabled() {
30+
return this.hasAttribute('disabled');
31+
}
32+
33+
set disabled(value) {
34+
if (value) {
35+
this.setAttribute('disabled', '');
36+
} else {
37+
this.removeAttribute('disabled');
38+
}
39+
}
40+
}
41+
customElements.define('custom-button', CustomButton);
42+
43+
class CustomElement extends HTMLElement {
44+
constructor() {
45+
super();
46+
this.internals_ = this.attachInternals();
47+
}
48+
}
49+
customElements.define('custom-element', CustomElement);
50+
51+
function resetState() {
52+
const testButton = document.getElementById("testButton");
53+
const popover = document.getElementById("testPopover");
54+
testButton.removeAttribute('popovertargetaction');
55+
testButton.removeAttribute('disabled');
56+
popover.hidePopover();
57+
}
58+
59+
test(t => {
60+
// Without type=button, popovertarget should not work.
61+
document.getElementById("testElement").click();
62+
assert_false(document.getElementById("testPopover").matches(':popover-open'), "The popover should not be shown when the custom element doesn't have type=button.");
63+
}, "Autonomous custom element without ElementInternals.type=button does not support the popovertarget attribute.");
64+
65+
test(t => {
66+
const popover = document.getElementById("testPopover");
67+
const testButton = document.getElementById("testButton");
68+
testButton.setAttribute('popovertargetaction', 'toggle');
69+
t.add_cleanup(() => resetState());
70+
71+
// Initially closed, first click should open.
72+
assert_false(popover.matches(':popover-open'), "Toggle popover should start closed");
73+
testButton.click();
74+
assert_true(popover.matches(':popover-open'), "Toggle popover should open after first click");
75+
76+
// Second click should close.
77+
testButton.click();
78+
assert_false(popover.matches(':popover-open'), "Toggle popover should close after second click");
79+
80+
// Third click should open again.
81+
testButton.click();
82+
assert_true(popover.matches(':popover-open'), "Toggle popover should open again after third click");
83+
}, "Custom element with type=button and popovertargetaction='toggle' toggles popover.");
84+
85+
test(t => {
86+
const popover = document.getElementById("testPopover");
87+
const testButton = document.getElementById("testButton");
88+
testButton.setAttribute('popovertargetaction', 'show');
89+
t.add_cleanup(() => resetState());
90+
91+
// Initially closed.
92+
assert_false(popover.matches(':popover-open'), "Show popover should start closed");
93+
94+
// First click should open.
95+
testButton.click();
96+
assert_true(popover.matches(':popover-open'), "Show popover should open after first click");
97+
98+
// Second click should not close (show action only opens).
99+
testButton.click();
100+
assert_true(popover.matches(':popover-open'), "Show popover should remain open after second click");
101+
}, "Custom element with type=button and popovertargetaction='show' only opens popover.");
102+
103+
test(t => {
104+
const popover = document.getElementById("testPopover");
105+
const testButton = document.getElementById("testButton");
106+
testButton.setAttribute('popovertargetaction', 'hide');
107+
t.add_cleanup(() => resetState());
108+
109+
// Start with popover open.
110+
popover.showPopover();
111+
assert_true(popover.matches(':popover-open'), "Hide popover should start open");
112+
113+
// First click should close.
114+
testButton.click();
115+
assert_false(popover.matches(':popover-open'), "Hide popover should close after first click");
116+
117+
// Second click should not open (hide action only closes).
118+
testButton.click();
119+
assert_false(popover.matches(':popover-open'), "Hide popover should remain closed after second click");
120+
}, "Custom element with type=button and popovertargetaction='hide' only closes popover.");
121+
122+
test(t => {
123+
const popover = document.getElementById("testPopover");
124+
const testButton = document.getElementById("testButton");
125+
testButton.setAttribute('disabled', '');
126+
popover.hidePopover();
127+
t.add_cleanup(() => resetState());
128+
129+
// Disabled button should not open popover.
130+
assert_true(testButton.disabled, "Button should be disabled");
131+
assert_false(popover.matches(':popover-open'), "Popover should start closed");
132+
133+
testButton.click();
134+
assert_false(popover.matches(':popover-open'), "Disabled button should not open popover");
135+
136+
// Enable the button and verify it works.
137+
testButton.disabled = false;
138+
assert_false(testButton.disabled, "Button should be enabled");
139+
140+
testButton.click();
141+
assert_true(popover.matches(':popover-open'), "Enabled button should open popover");
142+
143+
// Disable again and verify clicking doesn't close it.
144+
testButton.disabled = true;
145+
testButton.click();
146+
assert_true(popover.matches(':popover-open'), "Disabled button should not close popover");
147+
}, "Custom element with type=button that is disabled does not support popovertarget.");
148+
</script>
149+
</body>
150+
151+
</html>

LayoutTests/imported/w3c/web-platform-tests/custom-elements/behaves-like-button.tentative-expected.txt

Lines changed: 0 additions & 3 deletions
This file was deleted.

LayoutTests/imported/w3c/web-platform-tests/custom-elements/behaves-like-button.tentative.html

Lines changed: 0 additions & 55 deletions
This file was deleted.

LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/Element-innerHTML-expected.txt

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,4 @@ PASS innerHTML on a disconnected element should use the scoped registry it was c
33
PASS nested descendants in innerHTML on a disconnected element should use the scoped registry the element was created with
44
PASS innerHTML on a disconnected element should use the scoped registry it was created with when parsing a simple HTML
55
PASS innerHTML on an inserted element should continue to use the scoped registry it was created with
6-
FAIL nested descendants in innerHTML should use the null registry when the container element has null registry assert_false: expected false got true
7-
FAIL insertAdjacentHTML should use the element's registry even when the registry is null assert_false: expected false got true
86

LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/Element-innerHTML.html

Lines changed: 0 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -6,11 +6,6 @@
66
<script src="/resources/testharness.js"></script>
77
<script src="/resources/testharnessreport.js"></script>
88
</head>
9-
<div id="host">
10-
<template shadowrootmode="open" shadowrootclonable="true" shadowrootcustomelementregistry>
11-
<new-element></new-element>
12-
</template>
13-
</div>
149
<body>
1510
<script>
1611

@@ -28,9 +23,6 @@
2823
class GlobalOtherElement extends HTMLElement { };
2924
customElements.define('other-element', GlobalOtherElement);
3025

31-
class WrongNewElement extends HTMLElement{ };
32-
customElements.define('new-element', WrongNewElement);
33-
3426
test((test) => {
3527
const registry = new CustomElementRegistry;
3628

@@ -116,29 +108,6 @@
116108
assert_true(someElement.querySelector('other-element') instanceof ScopedOtherElement1);
117109
}, 'innerHTML on an inserted element should continue to use the scoped registry it was created with');
118110

119-
test((test) => {
120-
const shadowRoot = host.cloneNode(true).shadowRoot;
121-
const container_element = shadowRoot.lastElementChild;
122-
assert_equals(container_element.customElementRegistry, null);
123-
assert_false(container_element instanceof WrongNewElement);
124-
125-
container_element.innerHTML = '<new-element><new-element></new-element></new-element>';
126-
const outer_element = container_element.querySelector('new-element');
127-
const inner_element = outer_element.querySelector('new-element');
128-
assert_equals(outer_element.customElementRegistry, null);
129-
assert_false(outer_element instanceof WrongNewElement);
130-
assert_equals(inner_element.customElementRegistry, null);
131-
assert_false(inner_element instanceof WrongNewElement);
132-
}, 'nested descendants in innerHTML should use the null registry when the container element has null registry');
133-
134-
test((test) => {
135-
const shadowRoot = host.cloneNode(true).shadowRoot;
136-
shadowRoot.firstElementChild.insertAdjacentHTML('afterend', '<new-element></new-element>');
137-
const container_element = shadowRoot.lastElementChild;
138-
assert_equals(container_element.customElementRegistry, null);
139-
assert_false(container_element instanceof WrongNewElement);
140-
}, 'insertAdjacentHTML should use the element\'s registry even when the registry is null');
141-
142111
</script>
143112
</body>
144113
</html>

LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/ShadowRoot-init-customElementRegistry-expected.txt

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ PASS A newly attached disconnected ShadowRoot should use the global registry by
33
PASS A newly attached connected ShadowRoot should use the global registry by default
44
PASS A newly attached disconnected ShadowRoot should use the scoped registry if explicitly specified in attachShadow
55
PASS A newly attached connected ShadowRoot should use the scoped registry if explicitly specified in attachShadow
6-
PASS attachShadow() should use the global registry when customElementRegistry is null (host uses global registry)
7-
PASS attachShadow() should use the global registry when customElementRegistry is null (host uses custom registry)
6+
PASS attachShadow() should use the global registry when customElementRegistry is null
7+
FAIL attachShadow() should use the shadow host's registry when customElementRegistry is null assert_equals: expected object "[object CustomElementRegistry]" but got object "[object CustomElementRegistry]"
88
PASS attachShadow() should use the null registry when the shadow host uses null registry and customElementRegistry is null
99

LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/ShadowRoot-init-customElementRegistry.html

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -37,14 +37,14 @@
3737
const host = document.body.appendChild(document.createElement('div'));
3838
const shadowRoot = host.attachShadow({mode: 'closed', customElementRegistry: null});
3939
assert_equals(shadowRoot.customElementRegistry, window.customElements);
40-
}, 'attachShadow() should use the global registry when customElementRegistry is null (host uses global registry)');
40+
}, 'attachShadow() should use the global registry when customElementRegistry is null');
4141

4242
test(() => {
4343
const registry = new CustomElementRegistry;
4444
const host = document.body.appendChild(document.createElement('div', {customElementRegistry: registry}));
4545
const shadowRoot = host.attachShadow({mode: 'closed', customElementRegistry: null});
46-
assert_equals(shadowRoot.customElementRegistry, window.customElements);
47-
}, 'attachShadow() should use the global registry when customElementRegistry is null (host uses custom registry)');
46+
assert_equals(shadowRoot.customElementRegistry, registry);
47+
}, 'attachShadow() should use the shadow host\'s registry when customElementRegistry is null');
4848

4949
test(() => {
5050
const registry = new CustomElementRegistry;

LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/ShadowRoot-init-declarative-expected.txt

Lines changed: 0 additions & 4 deletions
This file was deleted.

LayoutTests/imported/w3c/web-platform-tests/custom-elements/registries/ShadowRoot-init-declarative.html

Lines changed: 0 additions & 29 deletions
This file was deleted.

0 commit comments

Comments
 (0)