Skip to content

Commit 555b64a

Browse files
josepharharchromium-wpt-export-bot
josepharhar
authored and
chromium-wpt-export-bot
committed
Move disabled check for popover*target attributes
Anne asked for this here: whatwg/html#8221 (comment) Change-Id: I129cf2768abc717292b86ea26f7522019ce36d33
1 parent 2bc6950 commit 555b64a

File tree

1 file changed

+126
-0
lines changed

1 file changed

+126
-0
lines changed

‎html/semantics/popovers/popover-target-element-disabled.html

+126
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,126 @@
1+
<!DOCTYPE html>
2+
<link rel=author href="mailto:[email protected]">
3+
<link rel=help href="https://github.com/whatwg/html/pull/8221#discussion_r1049379113">
4+
<script src="/resources/testharness.js"></script>
5+
<script src="/resources/testharnessreport.js"></script>
6+
7+
<div id=outerpopover popover=auto>
8+
<button popovertoggletarget=innerpopover disabled>toggle popover</button>
9+
</div>
10+
<div id=innerpopover popover=auto>popover</div>
11+
<script>
12+
test(() => {
13+
outerpopover.showPopover();
14+
innerpopover.showPopover();
15+
assert_true(innerpopover.matches(':open'),
16+
'The inner popover should be able to open successfully.');
17+
assert_false(outerpopover.matches(':open'),
18+
'The outer popover should be closed by opening the inner one.');
19+
}, 'Disabled popover*target buttons should not affect the popover heirarchy.');
20+
</script>
21+
22+
<div id=outerpopover2 popover=auto>
23+
<button id=togglebutton2 popovertoggletarget=innerpopover2>toggle popover</button>
24+
</div>
25+
<div id=innerpopover2 popover=auto>popover</div>
26+
<script>
27+
test(() => {
28+
outerpopover2.showPopover();
29+
innerpopover2.showPopover();
30+
assert_true(innerpopover2.matches(':open'),
31+
'The inner popover should be able to open successfully.');
32+
assert_true(outerpopover2.matches(':open'),
33+
'The outer popover should stay open when opening the inner one.');
34+
35+
togglebutton2.disabled = true;
36+
assert_false(innerpopover2.matches(':open'),
37+
'The inner popover should be closed when the hierarchy is broken.');
38+
assert_false(outerpopover2.matches(':open'),
39+
'The outer popover should be closed when the hierarchy is broken.');
40+
}, 'Disabling popover*target buttons when popovers are open should still cause all popovers to be closed when the formerly outer popover is closed.');
41+
</script>
42+
43+
<div id=outerpopover3 popover=auto>
44+
<button id=togglebutton3 popovertoggletarget=innerpopover3>toggle popover</button>
45+
</div>
46+
<div id=innerpopover3 popover=auto>popover</div>
47+
<script>
48+
test(() => {
49+
outerpopover3.showPopover();
50+
innerpopover3.showPopover();
51+
assert_true(innerpopover3.matches(':open'),
52+
'The inner popover should be able to open successfully.');
53+
assert_true(outerpopover3.matches(':open'),
54+
'The outer popover should stay open when opening the inner one.');
55+
56+
togglebutton3.disabled = true;
57+
assert_false(innerpopover3.matches(':open'),
58+
'The inner popover be should be closed when the hierarchy is broken.');
59+
assert_false(outerpopover3.matches(':open'),
60+
'The outer popover be should be closed when the hierarchy is broken.');
61+
}, 'Disabling popover*target buttons when popovers are open should still cause all popovers to be closed when the formerly inner popover is closed.');
62+
</script>
63+
64+
<div id=outerpopover4 popover=auto>
65+
<button id=togglebutton4 popovertoggletarget=innerpopover4>toggle popover</button>
66+
</div>
67+
<div id=innerpopover4 popover=auto>popover</div>
68+
<form id=submitform>form</form>
69+
<script>
70+
test(() => {
71+
outerpopover4.showPopover();
72+
innerpopover4.showPopover();
73+
assert_true(innerpopover4.matches(':open'),
74+
'The inner popover should be able to open successfully.');
75+
assert_true(outerpopover4.matches(':open'),
76+
'The outer popover should stay open when opening the inner one.');
77+
78+
togglebutton4.setAttribute('form', 'submitform');
79+
assert_false(innerpopover4.matches(':open'),
80+
'The inner popover be should be closed when the hierarchy is broken.');
81+
assert_false(outerpopover4.matches(':open'),
82+
'The outer popover be should be closed when the hierarchy is broken.');
83+
}, 'Setting the form attribute on popover*target buttons when popovers are open should close all popovers.');
84+
</script>
85+
86+
<div id=outerpopover5 popover=auto>
87+
<input type=button id=togglebutton5 popovertoggletarget=innerpopover5>toggle popover</button>
88+
</div>
89+
<div id=innerpopover5 popover=auto>popover</div>
90+
<script>
91+
test(() => {
92+
outerpopover5.showPopover();
93+
innerpopover5.showPopover();
94+
assert_true(innerpopover5.matches(':open'),
95+
'The inner popover should be able to open successfully.');
96+
assert_true(outerpopover5.matches(':open'),
97+
'The outer popover should stay open when opening the inner one.');
98+
99+
togglebutton5.setAttribute('type', 'text');
100+
assert_false(innerpopover5.matches(':open'),
101+
'The inner popover be should be closed when the hierarchy is broken.');
102+
assert_false(outerpopover5.matches(':open'),
103+
'The outer popover be should be closed when the hierarchy is broken.');
104+
}, 'Changing the input type on a popover*target button when popovers are open should close all popovers.');
105+
</script>
106+
107+
<div id=outerpopover6 popover=auto>
108+
<button id=togglebutton6 popovertoggletarget=innerpopover6>toggle popover</button>
109+
</div>
110+
<div id=innerpopover6 popover=auto>popover</div>
111+
<script>
112+
test(() => {
113+
outerpopover6.showPopover();
114+
innerpopover6.showPopover();
115+
assert_true(innerpopover6.matches(':open'),
116+
'The inner popover should be able to open successfully.');
117+
assert_true(outerpopover6.matches(':open'),
118+
'The outer popover should stay open when opening the inner one.');
119+
120+
togglebutton6.remove();
121+
assert_false(innerpopover6.matches(':open'),
122+
'The inner popover be should be closed when the hierarchy is broken.');
123+
assert_false(outerpopover6.matches(':open'),
124+
'The outer popover be should be closed when the hierarchy is broken.');
125+
}, 'Disconnecting popover*target buttons when popovers are open should close all popovers.');
126+
</script>

0 commit comments

Comments
 (0)