From d3646170713f03d4144a78d622faa7028abb6eb9 Mon Sep 17 00:00:00 2001
From: Mason Freed <masonf@chromium.org>
Date: Wed, 20 Nov 2024 18:02:23 +0000
Subject: [PATCH] Bug 1931937 [wpt PR 49232] - Implement new behavior for
 popovers contained within invokers, a=testonly

Automatic update from web-platform-tests
Implement new behavior for popovers contained within invokers

In this case:

```
<button popovertarget=foo>Activate
  <div popover id=foo>Clicking me shouldn't close me</div>
</button>
```

clicking the button properly activates the popover, however,
clicking on the popover itself after that should **not** close
the popover. It currently does because the popover click
bubbles to the `<button>` and activates the invoker, which
toggles the popover closed.

This CL changes that behavior so that clicks on the popover
in the case above no longer re-invoke the popover.

Spec PR:
  https://github.com/whatwg/html/pull/10770

Bug: 379241451
Change-Id: Iab67127c46a97a081a7818bfd917864729bf8b5c
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/6026982
Auto-Submit: Mason Freed <masonf@chromium.org>
Commit-Queue: Mason Freed <masonf@chromium.org>
Reviewed-by: David Baron <dbaron@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1384498}

--

wpt-commits: 50f7c0548260cdc2f11bface1816a283f9314de8
wpt-pr: 49232
---
 .../popover-nested-in-button.tentative.html   | 63 +++++++++++++++++++
 1 file changed, 63 insertions(+)
 create mode 100644 testing/web-platform/tests/html/semantics/popovers/popover-nested-in-button.tentative.html
diff --git a/testing/web-platform/tests/html/semantics/popovers/popover-nested-in-button.tentative.html b/testing/web-platform/tests/html/semantics/popovers/popover-nested-in-button.tentative.html
new file mode 100644
index 0000000000000..ed4cb78f8c8a8
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/popovers/popover-nested-in-button.tentative.html
@@ -0,0 +1,63 @@
+<!DOCTYPE html>
+<meta charset="utf-8" />
+<link rel="author" href="mailto:masonf@chromium.org">
+<link rel=help href="https://github.com/whatwg/html/pull/10770">
+<link rel=help href="https://issues.chromium.org/issues/379241451">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="resources/popover-utils.js"></script>
+
+<button id=case1 popovertarget=popover>Button
+  <div popover id=popover>
+    <span class=descendant>Popover</span>
+  </div>
+</button>
+
+<button id=case2 popovertarget=case2 popover>Self link</button>
+
+<button popovertarget=case3>Button
+  <div popover id=case3>
+    <span class=descendant>Popover</span>
+  </div>
+</button>
+
+<script>
+promise_test(async t => {
+  const invoker = document.querySelector('#case1');
+  const popover = invoker.querySelector('[popover]');
+  const descendant = invoker.querySelector('.descendant');
+  assert_false(popover.matches(':popover-open'));
+  invoker.click();
+  assert_true(popover.matches(':popover-open'));
+  popover.click();
+  assert_true(popover.matches(':popover-open'),'Should still be open');
+  descendant.click();
+  assert_true(popover.matches(':popover-open'),'Should still be open, even for descendant');
+  popover.hidePopover();
+},'clicking a popover nested inside a button should not re-invoke the popover');
+
+promise_test(async t => {
+  const element = document.querySelector('#case2');
+  assert_false(element.matches(':popover-open'));
+  element.showPopover();
+  assert_true(element.matches(':popover-open'));
+  element.click(); // This is a click on the button, which is also the popover
+  assert_false(element.matches(':popover-open'));
+  element.hidePopover();
+},'corner case: invoker that is also a popover');
+
+promise_test(async t => {
+  const popover = document.querySelector('#case3');
+  const outerInvoker = popover.parentElement;
+  const descendant = popover.querySelector('.descendant');
+  const innerInvoker = popover.appendChild(document.createElement('button'));
+  innerInvoker.popoverTargetElement = popover;
+  assert_false(popover.matches(':popover-open'));
+  outerInvoker.click();
+  assert_true(popover.matches(':popover-open'));
+  descendant.click();
+  assert_true(popover.matches(':popover-open'),'descendant doesn\'t close popover');
+  innerInvoker.click();
+  assert_false(popover.matches(':popover-open'),'inner invoker still works');
+},'invoker inside popover still works, even with weird nesting');
+</script>
