summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/close-watcher/user-activation
diff options
context:
space:
mode:
Diffstat (limited to 'testing/web-platform/tests/close-watcher/user-activation')
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/n-activate-preventDefault.html31
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/n-activate.html27
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/n-closerequest-n.html30
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/n-destroy-n.html31
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/n.html25
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/nn-activate-CloseWatcher.html30
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/nn-activate-dialog.html40
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/nn.html26
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/nnn-CloseWatcher-dialog-popover.html35
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/nnn-popovers.html37
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/nnn.html27
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/ny-activate-preventDefault.html37
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/ny.html30
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/nyn-popovers.html43
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/nyn.html30
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/nynn-destroy.html33
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/nynn.html31
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/nyyn.html36
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/nyyyn.html40
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/y.html25
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/yn-activate.html32
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/yn.html30
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/ynn.html31
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/yy.html30
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/yyn.html35
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/yyy-CloseWatcher-dialog-popover.html46
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/yyy-activate-CloseWatcher-dialog-popover.html49
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/yyy-popovers.html50
-rw-r--r--testing/web-platform/tests/close-watcher/user-activation/yyy.html35
29 files changed, 982 insertions, 0 deletions
diff --git a/testing/web-platform/tests/close-watcher/user-activation/n-activate-preventDefault.html b/testing/web-platform/tests/close-watcher/user-activation/n-activate-preventDefault.html
new file mode 100644
index 0000000000..531ef42599
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/n-activate-preventDefault.html
@@ -0,0 +1,31 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+ const watcher = createRecordingCloseWatcher(t, events, undefined, type);
+ watcher.addEventListener("cancel", e => e.preventDefault());
+
+ await maybeTopLayerBless(watcher);
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+
+ assert_array_equals(events, ["cancel"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["cancel", "close"]);
+}, "Create a close watcher without user activation that preventDefault()s cancel; send user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/n-activate.html b/testing/web-platform/tests/close-watcher/user-activation/n-activate.html
new file mode 100644
index 0000000000..babcf54c3c
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/n-activate.html
@@ -0,0 +1,27 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ const watcher = createRecordingCloseWatcher(t, events, undefined, type);
+
+ await maybeTopLayerBless(watcher);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["cancel", "close"]);
+}, "Create a close watcher without user activation; send user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/n-closerequest-n.html b/testing/web-platform/tests/close-watcher/user-activation/n-closerequest-n.html
new file mode 100644
index 0000000000..2424af7820
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/n-closerequest-n.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+promise_test(async t => {
+ const events = [];
+
+ createRecordingCloseWatcher(t, events, "watcher1", type);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher1 close"]);
+
+ createRecordingCloseWatcher(t, events, "watcher2", type);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher1 close", "watcher2 close"]);
+}, "Create a close watcher without user activation; send a close request; create a close watcher without user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/n-destroy-n.html b/testing/web-platform/tests/close-watcher/user-activation/n-destroy-n.html
new file mode 100644
index 0000000000..c26f87dd6f
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/n-destroy-n.html
@@ -0,0 +1,31 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ const watcher1 = createRecordingCloseWatcher(t, events, "watcher1", type);
+
+ destroyCloseWatcher(watcher1);
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, []);
+
+ createRecordingCloseWatcher(t, events, "watcher2", type);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher2 close"]);
+}, "Create a close watcher without user activation; destroy the close watcher; create a close watcher without user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/n.html b/testing/web-platform/tests/close-watcher/user-activation/n.html
new file mode 100644
index 0000000000..fe04e0dc1b
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/n.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ createRecordingCloseWatcher(t, events, undefined, type);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["close"]);
+}, "Create a close watcher without user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/nn-activate-CloseWatcher.html b/testing/web-platform/tests/close-watcher/user-activation/nn-activate-CloseWatcher.html
new file mode 100644
index 0000000000..8045f30b48
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/nn-activate-CloseWatcher.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<!--
+ See note in sibling -dialog.html file.
+-->
+
+<body>
+<script>
+const type = "CloseWatcher";
+
+promise_test(async t => {
+ const events = [];
+
+ createRecordingCloseWatcher(t, events, "watcher1", type);
+ const watcher2 = createRecordingCloseWatcher(t, events, "watcher2", type);
+
+ await maybeTopLayerBless(watcher2);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher2 cancel", "watcher2 close", "watcher1 cancel", "watcher1 close"]);
+}, "Create two CloseWatchers without user activation; send user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/nn-activate-dialog.html b/testing/web-platform/tests/close-watcher/user-activation/nn-activate-dialog.html
new file mode 100644
index 0000000000..5cc866044c
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/nn-activate-dialog.html
@@ -0,0 +1,40 @@
+<!doctype html>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<!--
+ This test has different expectations for dialogs vs. CloseWatchers because
+ dialogs queue a task to fire their close event, and do not do so for their
+ cancel event. Thus, when you have two dialogs grouped together, you get the
+ somewhat-strange behavior of both cancels firing first, then both closes.
+ Whereas CloseWatchers do not have this issue; both fire synchronously.
+
+ Note that scheduling the cancel event for dialogs is not really possible since
+ it would then fire after the dialog has been closed in the DOM and visually.
+ So the only reasonable fix for this would be to stop scheduling the close
+ event for dialogs. That's risky from a compat standpoint, so for now, test the
+ strange behavior.
+-->
+
+<body>
+<script>
+const type = "dialog";
+
+promise_test(async t => {
+ const events = [];
+
+ createRecordingCloseWatcher(t, events, "watcher1", type);
+ const watcher2 = createRecordingCloseWatcher(t, events, "watcher2", type);
+
+ await maybeTopLayerBless(watcher2);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher2 cancel", "watcher1 cancel", "watcher2 close", "watcher1 close"]);
+}, "Create two dialogs without user activation; send user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/nn.html b/testing/web-platform/tests/close-watcher/user-activation/nn.html
new file mode 100644
index 0000000000..beb63f1b4f
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/nn.html
@@ -0,0 +1,26 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ createRecordingCloseWatcher(t, events, "watcher1", type);
+ createRecordingCloseWatcher(t, events, "watcher2", type);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher2 close", "watcher1 close"]);
+}, "Create two close watchers without user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/nnn-CloseWatcher-dialog-popover.html b/testing/web-platform/tests/close-watcher/user-activation/nnn-CloseWatcher-dialog-popover.html
new file mode 100644
index 0000000000..f8b9061d01
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/nnn-CloseWatcher-dialog-popover.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<link rel=author href="mailto:jarhar@chromium.org">
+<link rel=help href="https://github.com/whatwg/html/pull/9462">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<button id=b0>button</button>
+
+<dialog id=dialog>
+ <button id=b1>button</button>
+ <div id=popover popover=auto>popover</div>
+</dialog>
+
+<script>
+promise_test(async t => {
+ const events = [];
+ const closeWatcher = createRecordingCloseWatcher(t, events, 'CloseWatcher', 'CloseWatcher');
+ const dialog = createRecordingCloseWatcher(t, events, 'dialog', 'dialog');
+ const popover = createRecordingCloseWatcher(t, events, 'popover', 'popover');
+ assert_true(dialog.hasAttribute('open'), 'The dialog should be open.');
+ assert_true(popover.matches(':popover-open'), 'The popover should be open.');
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+
+ assert_false(popover.matches(':popover-open'), 'The popover should be closed.');
+ assert_false(dialog.hasAttribute('open'), 'The dialog should be closed.');
+ assert_array_equals(events, ['CloseWatcher close', 'dialog close']);
+}, 'Create a CloseWatcher without user activation; create a dialog without user activation; create a popover without user activation');
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/nnn-popovers.html b/testing/web-platform/tests/close-watcher/user-activation/nnn-popovers.html
new file mode 100644
index 0000000000..ed5d15598f
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/nnn-popovers.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<link rel=author href="mailto:jarhar@chromium.org">
+<link rel=help href="https://github.com/whatwg/html/pull/9462">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<button id=b0>b0</button>
+
+<div id=p1 popover=auto>
+ <button id=b1>b1</button>
+
+ <div id=p2 popover=auto>
+ <button id=b2>b2</button>
+
+ <div id=p3 popover=auto>p3</div>
+ </div>
+</div>
+
+<script>
+promise_test(async () => {
+ p1.showPopover();
+ p2.showPopover();
+ p3.showPopover();
+ assert_true(p1.matches(':popover-open'), 'p1 should be open.');
+ assert_true(p2.matches(':popover-open'), 'p2 should be open.');
+ assert_true(p3.matches(':popover-open'), 'p3 should be open.');
+
+ await sendCloseRequest();
+ assert_false(p1.matches(':popover-open'), 'p1 should be closed.');
+ assert_false(p2.matches(':popover-open'), 'p2 should be closed.');
+ assert_false(p3.matches(':popover-open'), 'p3 should be closed.');
+}, 'Create three popovers without user activation');
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/nnn.html b/testing/web-platform/tests/close-watcher/user-activation/nnn.html
new file mode 100644
index 0000000000..9b604e91db
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/nnn.html
@@ -0,0 +1,27 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ createRecordingCloseWatcher(t, events, "watcher1", type);
+ createRecordingCloseWatcher(t, events, "watcher2", type);
+ createRecordingCloseWatcher(t, events, "watcher3", type);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher3 close", "watcher2 close", "watcher1 close"]);
+}, "Create three close watchers without user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/ny-activate-preventDefault.html b/testing/web-platform/tests/close-watcher/user-activation/ny-activate-preventDefault.html
new file mode 100644
index 0000000000..5ffb64b113
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/ny-activate-preventDefault.html
@@ -0,0 +1,37 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ const watcher1 = createRecordingCloseWatcher(t, events, "watcher1", type);
+ const watcher2 = await createBlessedRecordingCloseWatcher(t, events, "watcher2", type, watcher1);
+ watcher2.addEventListener("cancel", e => e.preventDefault());
+
+ await maybeTopLayerBless(watcher2);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher2 cancel"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher2 cancel", "watcher2 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher2 cancel", "watcher2 close", "watcher1 close"]);
+}, "Create a close watcher without user activation; create a close watcher with user activation that preventDefault()s cancel; send user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/ny.html b/testing/web-platform/tests/close-watcher/user-activation/ny.html
new file mode 100644
index 0000000000..226912233e
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/ny.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ const watcher1 = createRecordingCloseWatcher(t, events, "watcher1", type);
+ await createBlessedRecordingCloseWatcher(t, events, "watcher2", type, watcher1);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher2 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher2 close", "watcher1 close"]);
+}, "Create a close watcher without user activation; create a close watcher with user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/nyn-popovers.html b/testing/web-platform/tests/close-watcher/user-activation/nyn-popovers.html
new file mode 100644
index 0000000000..b6df610ae0
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/nyn-popovers.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<link rel=author href="mailto:jarhar@chromium.org">
+<link rel=help href="https://github.com/whatwg/html/pull/9462">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<button id=b0>b0</button>
+
+<div id=p1 popover=auto>
+ <button id=b1>b1</button>
+
+ <div id=p2 popover=auto>
+ <button id=b2>b2</button>
+
+ <div id=p3 popover=auto>p3</div>
+ </div>
+</div>
+
+<script>
+promise_test(async () => {
+ p1.showPopover();
+ await test_driver.click(b1);
+ p2.showPopover();
+ p3.showPopover();
+ assert_true(p1.matches(':popover-open'), 'p1 should be open.');
+ assert_true(p2.matches(':popover-open'), 'p2 should be open.');
+ assert_true(p3.matches(':popover-open'), 'p3 should be open.');
+
+ await sendCloseRequest();
+ assert_true(p1.matches(':popover-open'), 'first escape: p1 should be open.');
+ assert_false(p2.matches(':popover-open'), 'first escape: p2 should be closed.');
+ assert_false(p3.matches(':popover-open'), 'first escape: p3 should be closed.');
+
+ await sendCloseRequest();
+ assert_false(p1.matches(':popover-open'), 'second escape: p1 should be closed.');
+ assert_false(p2.matches(':popover-open'), 'second escape: p2 should be closed.');
+ assert_false(p3.matches(':popover-open'), 'second escape: p3 should be closed.');
+}, 'Create a popover without user activation; create a popover with user activation; create a popover without user activation');
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/nyn.html b/testing/web-platform/tests/close-watcher/user-activation/nyn.html
new file mode 100644
index 0000000000..ec5153c767
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/nyn.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ const watcher1 = createRecordingCloseWatcher(t, events, "watcher1");
+ await createBlessedRecordingCloseWatcher(t, events, "watcher2", type, watcher1);
+ createRecordingCloseWatcher(t, events, "watcher3");
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher3 close", "watcher2 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher3 close", "watcher2 close", "watcher1 close"]);
+}, "Create a close watcher without user activation; create a close watcher with user activation; create a close watcher without user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/nynn-destroy.html b/testing/web-platform/tests/close-watcher/user-activation/nynn-destroy.html
new file mode 100644
index 0000000000..8519c8a2a9
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/nynn-destroy.html
@@ -0,0 +1,33 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ const watcher1 = createRecordingCloseWatcher(t, events, "watcher1");
+ const watcher2 = await createBlessedRecordingCloseWatcher(t, events, "watcher2", type, watcher1);
+ createRecordingCloseWatcher(t, events, "watcher3");
+ createRecordingCloseWatcher(t, events, "watcher4");
+
+ destroyCloseWatcher(watcher2);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher4 close", "watcher3 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher4 close", "watcher3 close", "watcher1 close"]);
+}, "Create a close watcher without user activation; create a close watcher with user activation; create two close watchers without user activation; remove the second close watcher");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/nynn.html b/testing/web-platform/tests/close-watcher/user-activation/nynn.html
new file mode 100644
index 0000000000..f6e74a0ba1
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/nynn.html
@@ -0,0 +1,31 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ const watcher1 = createRecordingCloseWatcher(t, events, "watcher1");
+ await createBlessedRecordingCloseWatcher(t, events, "watcher2", type, watcher1);
+ createRecordingCloseWatcher(t, events, "watcher3");
+ createRecordingCloseWatcher(t, events, "watcher4");
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher4 close", "watcher3 close", "watcher2 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher4 close", "watcher3 close", "watcher2 close", "watcher1 close"]);
+}, "Create a close watcher without user activation; create a close watcher with user activation; create two close watchers without user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/nyyn.html b/testing/web-platform/tests/close-watcher/user-activation/nyyn.html
new file mode 100644
index 0000000000..f3987c1a21
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/nyyn.html
@@ -0,0 +1,36 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ const watcher1 = createRecordingCloseWatcher(t, events, "watcher1", type);
+ const watcher2 = await createBlessedRecordingCloseWatcher(t, events, "watcher2", type, watcher1);
+ const watcher3 = await createBlessedRecordingCloseWatcher(t, events, "watcher3", type, watcher2);
+ createRecordingCloseWatcher(t, events, "watcher4", type);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher4 close", "watcher3 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher4 close", "watcher3 close", "watcher2 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher4 close", "watcher3 close", "watcher2 close", "watcher1 close"]);
+}, "Create a close watcher without user activation; create two close watchers with user activation; create a close watcher without user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/nyyyn.html b/testing/web-platform/tests/close-watcher/user-activation/nyyyn.html
new file mode 100644
index 0000000000..6cb8f3a445
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/nyyyn.html
@@ -0,0 +1,40 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+ const watcher1 = createRecordingCloseWatcher(t, events, "watcher1", type);
+ const watcher2 = await createBlessedRecordingCloseWatcher(t, events, "watcher2", type, watcher1);
+ const watcher3 = await createBlessedRecordingCloseWatcher(t, events, "watcher3", type, watcher2);
+ await createBlessedRecordingCloseWatcher(t, events, "watcher4", type, watcher3);
+ createRecordingCloseWatcher(t, events, "watcher5", type);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher5 close", "watcher4 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher5 close", "watcher4 close", "watcher3 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher5 close", "watcher4 close", "watcher3 close", "watcher2 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher5 close", "watcher4 close", "watcher3 close", "watcher2 close", "watcher1 close"]);
+}, "Create a close watcher without user activation; create three close watchers with user activation; create a close watcher without user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/y.html b/testing/web-platform/tests/close-watcher/user-activation/y.html
new file mode 100644
index 0000000000..ee58a92293
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/y.html
@@ -0,0 +1,25 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ await createBlessedRecordingCloseWatcher(t, events, undefined, type);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["cancel", "close"]);
+}, "Create a close watcher with user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/yn-activate.html b/testing/web-platform/tests/close-watcher/user-activation/yn-activate.html
new file mode 100644
index 0000000000..af7289aa28
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/yn-activate.html
@@ -0,0 +1,32 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ await createBlessedRecordingCloseWatcher(t, events, "watcher1", type);
+ const watcher2 = createRecordingCloseWatcher(t, events, "watcher2", type);
+
+ await maybeTopLayerBless(watcher2);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher2 cancel", "watcher2 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher2 cancel", "watcher2 close", "watcher1 cancel", "watcher1 close"]);
+}, "Create a close watcher with user activation; create a close watcher without user activation; send user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/yn.html b/testing/web-platform/tests/close-watcher/user-activation/yn.html
new file mode 100644
index 0000000000..8f7e90e2d8
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/yn.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ await createBlessedRecordingCloseWatcher(t, events, "watcher1", type);
+ createRecordingCloseWatcher(t, events, "watcher2", type);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher2 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher2 close", "watcher1 close"]);
+}, "Create a close watcher with user activation; create a close watcher without user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/ynn.html b/testing/web-platform/tests/close-watcher/user-activation/ynn.html
new file mode 100644
index 0000000000..8cc7f5bfb6
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/ynn.html
@@ -0,0 +1,31 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ await createBlessedRecordingCloseWatcher(t, events, "watcher1", type);
+ createRecordingCloseWatcher(t, events, "watcher2", type);
+ createRecordingCloseWatcher(t, events, "watcher3", type);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher3 close", "watcher2 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher3 close", "watcher2 close", "watcher1 close"]);
+}, "Create a close watcher with user activation; create two close watchers without user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/yy.html b/testing/web-platform/tests/close-watcher/user-activation/yy.html
new file mode 100644
index 0000000000..0aa03cdd05
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/yy.html
@@ -0,0 +1,30 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ const watcher1 = await createBlessedRecordingCloseWatcher(t, events, "watcher1", type);
+ await createBlessedRecordingCloseWatcher(t, events, "watcher2", type, watcher1);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher2 cancel", "watcher2 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher2 cancel", "watcher2 close", "watcher1 cancel", "watcher1 close"]);
+}, "Create two close watchers with user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/yyn.html b/testing/web-platform/tests/close-watcher/user-activation/yyn.html
new file mode 100644
index 0000000000..b87cf7a7e3
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/yyn.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ const watcher1 = await createBlessedRecordingCloseWatcher(t, events, "watcher1", type);
+ await createBlessedRecordingCloseWatcher(t, events, "watcher2", type, watcher1);
+ createRecordingCloseWatcher(t, events, "watcher3", type);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher3 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher3 close", "watcher2 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher3 close", "watcher2 close", "watcher1 close"]);
+}, "Create two close watchers with user activation; create a close watcher without user activation");
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/yyy-CloseWatcher-dialog-popover.html b/testing/web-platform/tests/close-watcher/user-activation/yyy-CloseWatcher-dialog-popover.html
new file mode 100644
index 0000000000..f0a1cb06d1
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/yyy-CloseWatcher-dialog-popover.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<link rel=author href="mailto:jarhar@chromium.org">
+<link rel=help href="https://github.com/whatwg/html/pull/9462">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<button id=b0>button</button>
+
+<dialog id=dialog>
+ <button id=b1>button</button>
+ <div id=popover popover=auto>popover</div>
+</dialog>
+
+<script>
+promise_test(async t => {
+ const events = [];
+ const closeWatcher = await createBlessedRecordingCloseWatcher(t, events, 'CloseWatcher', 'CloseWatcher');
+ const dialog = await createBlessedRecordingCloseWatcher(t, events, 'dialog', 'dialog');
+ const popover = await createBlessedRecordingCloseWatcher(t, events, 'popover', 'popover', dialog);
+ assert_true(dialog.hasAttribute('open'), 'The dialog should be open.');
+ assert_true(popover.matches(':popover-open'), 'The popover should be open.');
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_false(popover.matches(':popover-open'), 'First close request: The popover should be closed.');
+ assert_true(dialog.hasAttribute('open'), 'First close request: The dialog should be open.');
+ assert_array_equals(events, []);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_false(popover.matches(':popover-open'), 'Second close request: The popover should be closed.');
+ assert_false(dialog.hasAttribute('open'), 'Second close request: The dialog should be closed.');
+ assert_array_equals(events, ['dialog cancel', 'dialog close']);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_false(popover.matches(':popover-open'), 'Third close request: The popover should be closed.');
+ assert_false(dialog.hasAttribute('open'), 'Third close request: The dialog should be closed.');
+ assert_array_equals(events, ['dialog cancel', 'dialog close', 'CloseWatcher cancel', 'CloseWatcher close']);
+}, 'Create a CloseWatcher with user activation; create a dialog with user activation; create a popover with user activation');
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/yyy-activate-CloseWatcher-dialog-popover.html b/testing/web-platform/tests/close-watcher/user-activation/yyy-activate-CloseWatcher-dialog-popover.html
new file mode 100644
index 0000000000..ed41d1bc32
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/yyy-activate-CloseWatcher-dialog-popover.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<link rel=author href="mailto:jarhar@chromium.org">
+<link rel=help href="https://github.com/whatwg/html/pull/9462">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<button id=b0>button</button>
+
+<dialog id=dialog>
+ <button id=b1>button</button>
+ <div id=popover popover=auto>popover</div>
+</dialog>
+
+<script>
+promise_test(async t => {
+ const events = [];
+ const closeWatcher = await createBlessedRecordingCloseWatcher(t, events, 'CloseWatcher', 'CloseWatcher');
+ const dialog = await createBlessedRecordingCloseWatcher(t, events, 'dialog', 'dialog');
+ const popover = await createBlessedRecordingCloseWatcher(t, events, 'popover', 'popover', dialog);
+ assert_true(dialog.hasAttribute('open'), 'The dialog should be open.');
+ assert_true(popover.matches(':popover-open'), 'The popover should be open.');
+
+ await blessTopLayer(popover);
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_false(popover.matches(':popover-open'), 'First close request: The popover should be closed.');
+ assert_true(dialog.hasAttribute('open'), 'First close request: The dialog should be open.');
+ assert_array_equals(events, []);
+
+ await blessTopLayer(dialog);
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_false(popover.matches(':popover-open'), 'Second close request: The popover should be closed.');
+ assert_false(dialog.hasAttribute('open'), 'Second close request: The dialog should be closed.');
+ assert_array_equals(events, ['dialog cancel', 'dialog close']);
+
+ await test_driver.bless();
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_false(popover.matches(':popover-open'), 'Third close request: The popover should be closed.');
+ assert_false(dialog.hasAttribute('open'), 'Third close request: The dialog should be closed.');
+ assert_array_equals(events, ['dialog cancel', 'dialog close', 'CloseWatcher cancel', 'CloseWatcher close']);
+}, 'Create a CloseWatcher with user activation; create a dialog with user activation; create a popover with user activation; sending user activation before each close request');
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/yyy-popovers.html b/testing/web-platform/tests/close-watcher/user-activation/yyy-popovers.html
new file mode 100644
index 0000000000..6f1b739465
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/yyy-popovers.html
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<link rel=author href="mailto:jarhar@chromium.org">
+<link rel=help href="https://github.com/whatwg/html/pull/9462">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<button id=b0>b0</button>
+
+<div id=p1 popover=auto>
+ <button id=b1>b1</button>
+
+ <div id=p2 popover=auto>
+ <button id=b2>b2</button>
+
+ <div id=p3 popover=auto>p3</div>
+ </div>
+</div>
+
+<script>
+promise_test(async () => {
+ await test_driver.click(b0);
+ p1.showPopover();
+ await test_driver.click(b1);
+ p2.showPopover();
+ await test_driver.click(b2);
+ p3.showPopover();
+ assert_true(p1.matches(':popover-open'), 'p1 should be open.');
+ assert_true(p2.matches(':popover-open'), 'p2 should be open.');
+ assert_true(p3.matches(':popover-open'), 'p3 should be open.');
+
+ await sendCloseRequest();
+ assert_true(p1.matches(':popover-open'), 'first escape: p1 should be open.');
+ assert_true(p2.matches(':popover-open'), 'first escape: p2 should be open.');
+ assert_false(p3.matches(':popover-open'), 'first escape: p3 should be closed.');
+
+ await sendCloseRequest();
+ assert_true(p1.matches(':popover-open'), 'second escape: p1 should be open.');
+ assert_false(p2.matches(':popover-open'), 'second escape: p2 should be closed.');
+ assert_false(p3.matches(':popover-open'), 'second escape: p3 should be closed.');
+
+ await sendCloseRequest();
+ assert_false(p1.matches(':popover-open'), 'third escape: p1 should be closed.');
+ assert_false(p2.matches(':popover-open'), 'third escape: p2 should be closed.');
+ assert_false(p3.matches(':popover-open'), 'third escape: p3 should be closed.');
+}, 'Create three popovers with user activation');
+</script>
diff --git a/testing/web-platform/tests/close-watcher/user-activation/yyy.html b/testing/web-platform/tests/close-watcher/user-activation/yyy.html
new file mode 100644
index 0000000000..f16767a86b
--- /dev/null
+++ b/testing/web-platform/tests/close-watcher/user-activation/yyy.html
@@ -0,0 +1,35 @@
+<!doctype html>
+<meta name=variant content="?dialog">
+<meta name=variant content="?CloseWatcher">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/common/top-layer.js"></script>
+<script src="../resources/helpers.js"></script>
+
+<body>
+<script>
+const type = location.search.substring(1);
+
+promise_test(async t => {
+ const events = [];
+
+ const watcher1 = await createBlessedRecordingCloseWatcher(t, events, "watcher1", type);
+ const watcher2 = await createBlessedRecordingCloseWatcher(t, events, "watcher2", type, watcher1);
+ await createBlessedRecordingCloseWatcher(t, events, "watcher3", type, watcher2);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher3 cancel", "watcher3 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher3 cancel", "watcher3 close", "watcher2 cancel", "watcher2 close"]);
+
+ await sendCloseRequest();
+ await waitForPotentialCloseEvent();
+ assert_array_equals(events, ["watcher3 cancel", "watcher3 close", "watcher2 cancel", "watcher2 close", "watcher1 cancel", "watcher1 close"]);
+}, "Create three close watchers with user activation");
+</script>