From 250893cc40076d903c6ac7413d2a502ff8b878e7 Mon Sep 17 00:00:00 2001
From: Mason Freed <masonf@chromium.org>
Date: Sat, 3 Sep 2022 09:40:35 +0000
Subject: [PATCH] Bug 1786053 [wpt PR 35535] - Simplify pop-up CSS rules, and
 add !important to display:none, a=testonly

Automatic update from web-platform-tests
Simplify pop-up CSS rules, and add !important to display:none

Per the resolution and discussion at [1], we've decided to simplify
the UA rules for pop-up attribute selectors, to capture *any*
`popup` attribute value. Additionally (and this part is tentative),
it looks like we'll likely resolve to put back `!important` on
display:none, so that `[popup] {display:flex}` can work.

[1] https://github.com/openui/open-ui/issues/561#issuecomment-1219836523

Bug: 1307772
Change-Id: If3d52cce0c9cbd3c6134ff57836d65c93eb12c48
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3840811
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@{#1037921}

--

wpt-commits: a0ece3bbdbfdf1bd0f66f841b06d54c1d927af0a
wpt-pr: 35535
---
 .../popups/popup-appearance-ref.tentative.html        |  3 +--
 .../semantics/popups/popup-appearance.tentative.html  |  4 ++--
 .../popups/popup-attribute-basic.tentative.html       | 10 ++++++----
 .../popups/popup-hidden-display-ref.tentative.html    | 11 -----------
 .../popups/popup-hidden-display.tentative.html        |  5 +++--
 .../html/semantics/popups/resources/popup-styles.css  |  7 +------
 6 files changed, 13 insertions(+), 27 deletions(-)

diff --git a/testing/web-platform/tests/html/semantics/popups/popup-appearance-ref.tentative.html b/testing/web-platform/tests/html/semantics/popups/popup-appearance-ref.tentative.html
index 95f43dba293b4..b8ebba794d2ce 100644
--- a/testing/web-platform/tests/html/semantics/popups/popup-appearance-ref.tentative.html
+++ b/testing/web-platform/tests/html/semantics/popups/popup-appearance-ref.tentative.html
@@ -12,9 +12,8 @@
 </style>
 
 <p>There should be four pop-ups with similar appearance, and
-  the word Unknown with no special styling.</p>
+   the word "Unknown" should not be visible on the page.</p>
 <div class="fake-pop-up" id=blank>Blank</div>
 <div class="fake-pop-up" id=auto>Auto</div>
 <div class="fake-pop-up" id=hint><span>Hint</span></div>
 <div class="fake-pop-up" id=manual>Manual</div>
-<div class="not-a-pop-up!" id=unknown>Unknown</div>
diff --git a/testing/web-platform/tests/html/semantics/popups/popup-appearance.tentative.html b/testing/web-platform/tests/html/semantics/popups/popup-appearance.tentative.html
index 84421317e5a1c..4acc276c16c36 100644
--- a/testing/web-platform/tests/html/semantics/popups/popup-appearance.tentative.html
+++ b/testing/web-platform/tests/html/semantics/popups/popup-appearance.tentative.html
@@ -14,13 +14,13 @@
 </style>
 
 <p>There should be four pop-ups with similar appearance, and
-   the word Unknown with no special styling.</p>
+   the word "Unknown" should not be visible on the page.</p>
 <div popup>Blank
   <div popup=auto>Auto</div>
 </div>
 <div popup=hint>Hint</div>
 <div popup=manual>Manual</div>
-<!-- This ensures unsupported popup values don't receive styling -->
+<!-- This ensures unsupported popup values are hidden -->
 <div popup=unknown>Unknown</div>
 <script>
   document.querySelectorAll('[popup]').forEach(p => {
diff --git a/testing/web-platform/tests/html/semantics/popups/popup-attribute-basic.tentative.html b/testing/web-platform/tests/html/semantics/popups/popup-attribute-basic.tentative.html
index d6090486aa276..1ff7f13c61d84 100644
--- a/testing/web-platform/tests/html/semantics/popups/popup-attribute-basic.tentative.html
+++ b/testing/web-platform/tests/html/semantics/popups/popup-attribute-basic.tentative.html
@@ -57,12 +57,14 @@
     parent.appendChild(popUp);
   }
   function assertNotAPopUp(nonPopUp) {
-    // Non-popup elements should already be visible.
-    assert_true(popUpVisible(nonPopUp, /*isPopUp*/false));
+    // If the non-pop-up element nonetheless has a 'popup' attribute, it should
+    // be invisible. Otherwise, it should be visible.
+    const expectVisible = !nonPopUp.hasAttribute('popup');
+    assert_equals(popUpVisible(nonPopUp, /*isPopUp*/false),expectVisible);
     assert_throws_dom("NotSupportedError",() => nonPopUp.showPopUp(),'Calling showPopUp on a non-pop-up should throw NotSupportedError');
-    assert_true(popUpVisible(nonPopUp, /*isPopUp*/false));
+    assert_equals(popUpVisible(nonPopUp, /*isPopUp*/false),expectVisible);
     assert_throws_dom("NotSupportedError",() => nonPopUp.hidePopUp(),'Calling hidePopUp on a non-pop-up should throw NotSupportedError');
-    assert_true(popUpVisible(nonPopUp, /*isPopUp*/false));
+    assert_equals(popUpVisible(nonPopUp, /*isPopUp*/false),expectVisible);
   }
 
   Array.from(document.getElementById('popups').children).forEach(popUp => {
diff --git a/testing/web-platform/tests/html/semantics/popups/popup-hidden-display-ref.tentative.html b/testing/web-platform/tests/html/semantics/popups/popup-hidden-display-ref.tentative.html
index bb321b17ba8e0..adfcfbf204e21 100644
--- a/testing/web-platform/tests/html/semantics/popups/popup-hidden-display-ref.tentative.html
+++ b/testing/web-platform/tests/html/semantics/popups/popup-hidden-display-ref.tentative.html
@@ -2,14 +2,3 @@
 <meta charset="utf-8">
 <link rel=author href="mailto:masonf@chromium.org">
 <link rel="stylesheet" href="resources/popup-styles.css">
-
-<div class=fake-pop-up>This content should be visible</div>
-
-<style>
-  .fake-pop-up {
-    top: 0;
-    left: 0;
-    width: 300px;
-    height: 200px;
-  }
-</style>
diff --git a/testing/web-platform/tests/html/semantics/popups/popup-hidden-display.tentative.html b/testing/web-platform/tests/html/semantics/popups/popup-hidden-display.tentative.html
index 69c82b24827ef..45c1f91ed43d4 100644
--- a/testing/web-platform/tests/html/semantics/popups/popup-hidden-display.tentative.html
+++ b/testing/web-platform/tests/html/semantics/popups/popup-hidden-display.tentative.html
@@ -4,11 +4,12 @@
 <link rel=help href="https://open-ui.org/components/popup.research.explainer">
 <link rel=match href="popup-hidden-display-ref.tentative.html">
 
-<div popup>This content should be visible</div>
+<div popup>This content should *not* be visible</div>
+<div popup=invalid>This content should *not* be visible</div>
 
 <style>
   [popup] {
-    display: block; /* This should make the popup visible */
+    display: block !important; /* This should *not* make the popup visible */
     top: 0;
     width: 300px;
     height: 200px;
diff --git a/testing/web-platform/tests/html/semantics/popups/resources/popup-styles.css b/testing/web-platform/tests/html/semantics/popups/resources/popup-styles.css
index 1a99019f060df..e1d3e43dccc25 100644
--- a/testing/web-platform/tests/html/semantics/popups/resources/popup-styles.css
+++ b/testing/web-platform/tests/html/semantics/popups/resources/popup-styles.css
@@ -9,16 +9,11 @@
   margin: auto;
   border: solid;
   overflow: auto;
-  padding: 1em;
   color: CanvasText;
   background-color: Canvas;
 }
 .fake-pop-up-backdrop {
   position: fixed;
-  inset-inline-start: 0;
-  inset-inline-end: 0;
-  inset-block-start: 0;
-  inset-block-end: 0;
-  background: transparent;
+  top:0; right:0; bottom:0; left:0;
   pointer-events: none !important;
 }