diff --git a/blink/renderer/core/css/css_selector.cc b/blink/renderer/core/css/css_selector.cc
index 2c0e2491817..ab07633484a 100644
--- a/blink/renderer/core/css/css_selector.cc
+++ b/blink/renderer/core/css/css_selector.cc
@@ -258,106 +258,106 @@ PseudoId CSSSelector::GetPseudoId(PseudoType type) {
       return kPseudoIdPageTransitionOutgoingImage;
     case kPseudoPageTransitionIncomingImage:
       return kPseudoIdPageTransitionIncomingImage;
-    case kPseudoUnknown:
-    case kPseudoEmpty:
-    case kPseudoFirstChild:
-    case kPseudoFirstOfType:
-    case kPseudoLastChild:
-    case kPseudoLastOfType:
-    case kPseudoOnlyChild:
-    case kPseudoOnlyOfType:
-    case kPseudoNthChild:
-    case kPseudoNthOfType:
-    case kPseudoNthLastChild:
-    case kPseudoNthLastOfType:
-    case kPseudoLink:
-    case kPseudoVisited:
+    case kPseudoActive:
     case kPseudoAny:
-    case kPseudoIs:
-    case kPseudoWhere:
     case kPseudoAnyLink:
-    case kPseudoWebkitAnyLink:
     case kPseudoAutofill:
-    case kPseudoWebKitAutofill:
     case kPseudoAutofillPreviewed:
     case kPseudoAutofillSelected:
-    case kPseudoHover:
+    case kPseudoBlinkInternalElement:
+    case kPseudoChecked:
+    case kPseudoCornerPresent:
+    case kPseudoCue:
+    case kPseudoDecrement:
+    case kPseudoDefault:
+    case kPseudoDefined:
+    case kPseudoDir:
+    case kPseudoDisabled:
+    case kPseudoDoubleButton:
     case kPseudoDrag:
+    case kPseudoEmpty:
+    case kPseudoEnabled:
+    case kPseudoEnd:
+    case kPseudoFileSelectorButton:
+    case kPseudoFirstChild:
+    case kPseudoFirstOfType:
+    case kPseudoFirstPage:
     case kPseudoFocus:
     case kPseudoFocusVisible:
     case kPseudoFocusWithin:
-    case kPseudoActive:
-    case kPseudoChecked:
-    case kPseudoEnabled:
     case kPseudoFullPageMedia:
-    case kPseudoDefault:
-    case kPseudoDisabled:
-    case kPseudoOptional:
-    case kPseudoPlaceholder:
-    case kPseudoPlaceholderShown:
-    case kPseudoFileSelectorButton:
-    case kPseudoRequired:
-    case kPseudoReadOnly:
-    case kPseudoReadWrite:
-    case kPseudoValid:
-    case kPseudoInvalid:
+    case kPseudoFullScreen:
+    case kPseudoFullScreenAncestor:
+    case kPseudoFullscreen:
+    case kPseudoFutureCue:
+    case kPseudoHas:
+    case kPseudoHasDatalist:
+    case kPseudoHorizontal:
+    case kPseudoHost:
+    case kPseudoHostContext:
+    case kPseudoHostHasAppearance:
+    case kPseudoHover:
+    case kPseudoInRange:
+    case kPseudoIncrement:
     case kPseudoIndeterminate:
-    case kPseudoTarget:
+    case kPseudoInvalid:
+    case kPseudoIs:
+    case kPseudoIsHtml:
     case kPseudoLang:
-    case kPseudoDir:
-    case kPseudoNot:
-    case kPseudoRoot:
-    case kPseudoScope:
-    case kPseudoWindowInactive:
-    case kPseudoCornerPresent:
-    case kPseudoDecrement:
-    case kPseudoIncrement:
-    case kPseudoHorizontal:
-    case kPseudoVertical:
-    case kPseudoStart:
-    case kPseudoEnd:
-    case kPseudoDoubleButton:
-    case kPseudoSingleButton:
-    case kPseudoNoButton:
-    case kPseudoFirstPage:
+    case kPseudoLastChild:
+    case kPseudoLastOfType:
     case kPseudoLeftPage:
-    case kPseudoRightPage:
-    case kPseudoInRange:
+    case kPseudoLink:
+    case kPseudoListBox:
+    case kPseudoModal:
+    case kPseudoMultiSelectFocus:
+    case kPseudoNoButton:
+    case kPseudoNot:
+    case kPseudoNthChild:
+    case kPseudoNthLastChild:
+    case kPseudoNthLastOfType:
+    case kPseudoNthOfType:
+    case kPseudoOnlyChild:
+    case kPseudoOnlyOfType:
+    case kPseudoOpen:
+    case kPseudoOptional:
     case kPseudoOutOfRange:
-    case kPseudoToggle:
-    case kPseudoWebKitCustomElement:
-    case kPseudoBlinkInternalElement:
-    case kPseudoCue:
-    case kPseudoFutureCue:
-    case kPseudoPastCue:
-    case kPseudoDefined:
-    case kPseudoHost:
-    case kPseudoHostContext:
     case kPseudoPart:
-    case kPseudoState:
-    case kPseudoFullScreen:
-    case kPseudoFullScreenAncestor:
-    case kPseudoFullscreen:
+    case kPseudoPastCue:
     case kPseudoPaused:
     case kPseudoPictureInPicture:
+    case kPseudoPlaceholder:
+    case kPseudoPlaceholderShown:
     case kPseudoPlaying:
+    case kPseudoPopupHidden:
+    case kPseudoReadOnly:
+    case kPseudoReadWrite:
+    case kPseudoRelativeAnchor:
+    case kPseudoRequired:
+    case kPseudoRightPage:
+    case kPseudoRoot:
+    case kPseudoScope:
+    case kPseudoSelectorFragmentAnchor:
+    case kPseudoSingleButton:
+    case kPseudoSlotted:
     case kPseudoSpatialNavigationFocus:
     case kPseudoSpatialNavigationInterest:
-    case kPseudoHasDatalist:
-    case kPseudoIsHtml:
-    case kPseudoListBox:
-    case kPseudoMultiSelectFocus:
-    case kPseudoHostHasAppearance:
-    case kPseudoSlotted:
-    case kPseudoTopLayer:
-    case kPseudoPopupHidden:
+    case kPseudoStart:
+    case kPseudoState:
+    case kPseudoTarget:
+    case kPseudoToggle:
+    case kPseudoUnknown:
+    case kPseudoValid:
+    case kPseudoVertical:
     case kPseudoVideoPersistent:
     case kPseudoVideoPersistentAncestor:
+    case kPseudoVisited:
+    case kPseudoWebKitAutofill:
+    case kPseudoWebKitCustomElement:
+    case kPseudoWebkitAnyLink:
+    case kPseudoWhere:
+    case kPseudoWindowInactive:
     case kPseudoXrOverlay:
-    case kPseudoModal:
-    case kPseudoSelectorFragmentAnchor:
-    case kPseudoHas:
-    case kPseudoRelativeAnchor:
       return kPseudoIdNone;
   }
 
@@ -454,6 +454,7 @@ const static NameToPseudoStruct kPseudoTypeWithoutArgumentsMap[] = {
     {"no-button", CSSSelector::kPseudoNoButton},
     {"only-child", CSSSelector::kPseudoOnlyChild},
     {"only-of-type", CSSSelector::kPseudoOnlyOfType},
+    {"open", CSSSelector::kPseudoOpen},
     {"optional", CSSSelector::kPseudoOptional},
     {"out-of-range", CSSSelector::kPseudoOutOfRange},
     {"page-transition", CSSSelector::kPseudoPageTransition},
@@ -475,7 +476,6 @@ const static NameToPseudoStruct kPseudoTypeWithoutArgumentsMap[] = {
     {"start", CSSSelector::kPseudoStart},
     {"target", CSSSelector::kPseudoTarget},
     {"target-text", CSSSelector::kPseudoTargetText},
-    {"top-layer", CSSSelector::kPseudoTopLayer},
     {"valid", CSSSelector::kPseudoValid},
     {"vertical", CSSSelector::kPseudoVertical},
     {"visited", CSSSelector::kPseudoVisited},
@@ -573,7 +573,7 @@ CSSSelector::PseudoType CSSSelector::NameToPseudoType(
   bool popup_attribute_enabled =
       !document || RuntimeEnabledFeatures::HTMLPopupAttributeEnabled(
                        document->GetExecutionContext());
-  if (match->type == CSSSelector::kPseudoTopLayer && !popup_attribute_enabled)
+  if (match->type == CSSSelector::kPseudoOpen && !popup_attribute_enabled)
     return CSSSelector::kPseudoUnknown;
 
   if (match->type == CSSSelector::kPseudoPopupHidden &&
@@ -771,6 +771,7 @@ void CSSSelector::UpdatePseudoType(const AtomicString& value,
     case kPseudoNthOfType:
     case kPseudoOnlyChild:
     case kPseudoOnlyOfType:
+    case kPseudoOpen:
     case kPseudoOptional:
     case kPseudoOutOfRange:
     case kPseudoPastCue:
@@ -791,7 +792,6 @@ void CSSSelector::UpdatePseudoType(const AtomicString& value,
     case kPseudoState:
     case kPseudoTarget:
     case kPseudoToggle:
-    case kPseudoTopLayer:
     case kPseudoUnknown:
     case kPseudoValid:
     case kPseudoVertical:
diff --git a/blink/renderer/core/css/css_selector.h b/blink/renderer/core/css/css_selector.h
index a8a6a7f4e47..66bdd878516 100644
--- a/blink/renderer/core/css/css_selector.h
+++ b/blink/renderer/core/css/css_selector.h
@@ -173,64 +173,65 @@ class CORE_EXPORT CSSSelector {
   };
 
   enum PseudoType {
-    kPseudoUnknown,
-    kPseudoEmpty,
-    kPseudoFirstChild,
-    kPseudoFirstOfType,
-    kPseudoLastChild,
-    kPseudoLastOfType,
-    kPseudoOnlyChild,
-    kPseudoOnlyOfType,
-    kPseudoFirstLine,
-    kPseudoFirstLetter,
-    kPseudoNthChild,
-    kPseudoNthOfType,
-    kPseudoNthLastChild,
-    kPseudoNthLastOfType,
-    kPseudoPart,
-    kPseudoState,
-    kPseudoLink,
-    kPseudoVisited,
+    kPseudoActive,
+    kPseudoAfter,
     kPseudoAny,
-    kPseudoIs,
-    kPseudoWhere,
     kPseudoAnyLink,
-    kPseudoWebkitAnyLink,
     kPseudoAutofill,
-    kPseudoWebKitAutofill,
     kPseudoAutofillPreviewed,
     kPseudoAutofillSelected,
-    kPseudoHover,
+    kPseudoBackdrop,
+    kPseudoBefore,
+    kPseudoChecked,
+    kPseudoCornerPresent,
+    kPseudoDecrement,
+    kPseudoDefault,
+    kPseudoDisabled,
+    kPseudoDoubleButton,
     kPseudoDrag,
+    kPseudoEmpty,
+    kPseudoEnabled,
+    kPseudoEnd,
+    kPseudoFileSelectorButton,
+    kPseudoFirstChild,
+    kPseudoFirstLetter,
+    kPseudoFirstLine,
+    kPseudoFirstOfType,
+    kPseudoFirstPage,
     kPseudoFocus,
     kPseudoFocusVisible,
     kPseudoFocusWithin,
-    kPseudoActive,
-    kPseudoChecked,
-    kPseudoEnabled,
     kPseudoFullPageMedia,
-    kPseudoDefault,
-    kPseudoDisabled,
-    kPseudoOptional,
-    kPseudoPlaceholderShown,
-    kPseudoRequired,
-    kPseudoReadOnly,
-    kPseudoReadWrite,
-    kPseudoValid,
-    kPseudoInvalid,
+    kPseudoHorizontal,
+    kPseudoHover,
+    kPseudoIncrement,
     kPseudoIndeterminate,
-    kPseudoTarget,
-    kPseudoBefore,
-    kPseudoAfter,
+    kPseudoInvalid,
+    kPseudoIs,
+    kPseudoLang,
+    kPseudoLastChild,
+    kPseudoLastOfType,
+    kPseudoLeftPage,
+    kPseudoLink,
     kPseudoMarker,
     kPseudoModal,
-    kPseudoSelectorFragmentAnchor,
-    kPseudoBackdrop,
-    kPseudoLang,
+    kPseudoNoButton,
     kPseudoNot,
+    kPseudoNthChild,
+    kPseudoNthLastChild,
+    kPseudoNthLastOfType,
+    kPseudoNthOfType,
+    kPseudoOnlyChild,
+    kPseudoOnlyOfType,
+    kPseudoOptional,
+    kPseudoPart,
     kPseudoPlaceholder,
-    kPseudoFileSelectorButton,
+    kPseudoPlaceholderShown,
+    kPseudoReadOnly,
+    kPseudoReadWrite,
+    kPseudoRequired,
     kPseudoResizer,
+    kPseudoRightPage,
     kPseudoRoot,
     kPseudoScope,
     kPseudoScrollbar,
@@ -239,21 +240,20 @@ class CORE_EXPORT CSSSelector {
     kPseudoScrollbarThumb,
     kPseudoScrollbarTrack,
     kPseudoScrollbarTrackPiece,
-    kPseudoWindowInactive,
-    kPseudoCornerPresent,
-    kPseudoDecrement,
-    kPseudoIncrement,
-    kPseudoHorizontal,
-    kPseudoVertical,
-    kPseudoStart,
-    kPseudoEnd,
-    kPseudoDoubleButton,
-    kPseudoSingleButton,
-    kPseudoNoButton,
     kPseudoSelection,
-    kPseudoLeftPage,
-    kPseudoRightPage,
-    kPseudoFirstPage,
+    kPseudoSelectorFragmentAnchor,
+    kPseudoSingleButton,
+    kPseudoStart,
+    kPseudoState,
+    kPseudoTarget,
+    kPseudoUnknown,
+    kPseudoValid,
+    kPseudoVertical,
+    kPseudoVisited,
+    kPseudoWebKitAutofill,
+    kPseudoWebkitAnyLink,
+    kPseudoWhere,
+    kPseudoWindowInactive,
     // TODO(foolip): When the unprefixed Fullscreen API is enabled, merge
     // kPseudoFullScreen and kPseudoFullscreen into one. (kPseudoFullscreen is
     // controlled by the FullscreenUnprefixed REF, but is otherwise an alias.)
@@ -284,7 +284,7 @@ class CORE_EXPORT CSSSelector {
     kPseudoListBox,
     kPseudoMultiSelectFocus,
     kPseudoHostHasAppearance,
-    kPseudoTopLayer,
+    kPseudoOpen,
     kPseudoPopupHidden,
     kPseudoSlotted,
     kPseudoVideoPersistent,
diff --git a/blink/renderer/core/css/parser/css_proto_converter.cc b/blink/renderer/core/css/parser/css_proto_converter.cc
index 64aadd42b8f..b289249b6d8 100644
--- a/blink/renderer/core/css/parser/css_proto_converter.cc
+++ b/blink/renderer/core/css/parser/css_proto_converter.cc
@@ -100,6 +100,7 @@ const std::string Converter::kPseudoLookupTable[] = {
     "no-button",
     "only-child",
     "only-of-type",
+    "open",
     "optional",
     "out-of-range",
     "past",
@@ -115,7 +116,6 @@ const std::string Converter::kPseudoLookupTable[] = {
     "single-button",
     "start",
     "target",
-    "top-layer",
     "valid",
     "vertical",
     "visited",
diff --git a/blink/renderer/core/css/rule_feature_set.cc b/blink/renderer/core/css/rule_feature_set.cc
index e8c3e0d0e01..fdc37e68643 100644
--- a/blink/renderer/core/css/rule_feature_set.cc
+++ b/blink/renderer/core/css/rule_feature_set.cc
@@ -176,7 +176,7 @@ bool SupportsInvalidation(CSSSelector::PseudoType type) {
     case CSSSelector::kPseudoListBox:
     case CSSSelector::kPseudoMultiSelectFocus:
     case CSSSelector::kPseudoHostHasAppearance:
-    case CSSSelector::kPseudoTopLayer:
+    case CSSSelector::kPseudoOpen:
     case CSSSelector::kPseudoPopupHidden:
     case CSSSelector::kPseudoSlotted:
     case CSSSelector::kPseudoVideoPersistent:
@@ -652,7 +652,7 @@ InvalidationSet* RuleFeatureSet::InvalidationSetForSimpleSelector(
       case CSSSelector::kPseudoInRange:
       case CSSSelector::kPseudoOutOfRange:
       case CSSSelector::kPseudoDefined:
-      case CSSSelector::kPseudoTopLayer:
+      case CSSSelector::kPseudoOpen:
       case CSSSelector::kPseudoPopupHidden:
       case CSSSelector::kPseudoVideoPersistent:
       case CSSSelector::kPseudoVideoPersistentAncestor:
diff --git a/blink/renderer/core/css/selector_checker.cc b/blink/renderer/core/css/selector_checker.cc
index b113230a524..36f8c991b88 100644
--- a/blink/renderer/core/css/selector_checker.cc
+++ b/blink/renderer/core/css/selector_checker.cc
@@ -1498,7 +1498,7 @@ bool SelectorChecker::CheckPseudoClass(const SelectorCheckingContext& context,
       }
       break;
     }
-    case CSSSelector::kPseudoTopLayer:
+    case CSSSelector::kPseudoOpen:
       if (element.HasValidPopupAttribute()) {
         return element.popupOpen();
       }
diff --git a/blink/renderer/core/dom/element.cc b/blink/renderer/core/dom/element.cc
index 0713ac92cf3..323e07afd18 100644
--- a/blink/renderer/core/dom/element.cc
+++ b/blink/renderer/core/dom/element.cc
@@ -2486,7 +2486,7 @@ PopupValueType Element::PopupType() const {
   return GetPopupData() ? GetPopupData()->type() : PopupValueType::kNone;
 }
 
-// This should be true when :top-layer should match.
+// This should be true when `:open` should match.
 bool Element::popupOpen() const {
   DCHECK(RuntimeEnabledFeatures::HTMLPopupAttributeEnabled(
       GetDocument().GetExecutionContext()));
@@ -2501,7 +2501,7 @@ bool Element::popupOpen() const {
 //     style.
 // 2. Update style. (Transition initial style can be specified in this
 //    state.)
-// 3. Set the :top-layer pseudo class.
+// 3. Set the `:open` pseudo class.
 // 4. Update style. (Animations/transitions happen here.)
 void Element::showPopUp(ExceptionState& exception_state) {
   DCHECK(RuntimeEnabledFeatures::HTMLPopupAttributeEnabled(
@@ -2584,14 +2584,14 @@ void Element::showPopUp(ExceptionState& exception_state) {
   PseudoStateChanged(CSSSelector::kPseudoPopupHidden);
 
   // Force a style update. This ensures that base property values are set prior
-  // to `:top-layer` matching, so that transitions can start on the change to
+  // to `:open` matching, so that transitions can start on the change to
   // top layer.
   document.UpdateStyleAndLayoutTreeForNode(this);
   EnsureComputedStyle();
 
-  // Make the popup match :top-layer:
+  // Make the popup match `:open`:
   GetPopupData()->setVisibilityState(PopupVisibilityState::kShowing);
-  PseudoStateChanged(CSSSelector::kPseudoTopLayer);
+  PseudoStateChanged(CSSSelector::kPseudoOpen);
 
   SetPopupFocusOnShow();
 
@@ -2691,7 +2691,7 @@ void Element::hidePopUp(ExceptionState& exception_state) {
 // transitions:
 // 1. Capture any already-running animations via getAnimations(), including
 //    animations on descendant elements.
-// 2. Remove the :top-layer pseudo class.
+// 2. Remove the `:open` pseudo class.
 // 3. Fire the 'hide' event.
 // 4. If the hidePopup() call is *not* the result of the pop-up being "forced
 //    out" of the top layer, e.g. by a modal dialog or fullscreen element:
@@ -2744,9 +2744,9 @@ void Element::HidePopUpInternal(HidePopupFocusBehavior focus_behavior,
 
   GetPopupData()->setInvoker(nullptr);
   GetPopupData()->setNeedsRepositioningForSelectMenu(false);
-  // Stop matching :top-layer:
+  // Stop matching `:open`:
   GetPopupData()->setVisibilityState(PopupVisibilityState::kTransitioning);
-  PseudoStateChanged(CSSSelector::kPseudoTopLayer);
+  PseudoStateChanged(CSSSelector::kPseudoOpen);
 
   // Fire the hide event (bubbles, not cancelable).
   Event* event = Event::CreateBubble(event_type_names::kHide);
@@ -2771,7 +2771,7 @@ void Element::HidePopUpInternal(HidePopupFocusBehavior focus_behavior,
 
   // Grab all animations, so that we can "finish" the hide operation once
   // they complete. This will *also* force a style update, ensuring property
-  // values are set after `:top-layer` stops matching, so that transitions
+  // values are set after `:open` stops matching, so that transitions
   // can start.
   HeapHashSet<Member<EventTarget>> animations;
   for (const auto& animation : GetAnimationsInternal(
diff --git a/blink/renderer/core/inspector/inspector_trace_events.cc b/blink/renderer/core/inspector/inspector_trace_events.cc
index 04ebc82fc2a..934d02ca0c3 100644
--- a/blink/renderer/core/inspector/inspector_trace_events.cc
+++ b/blink/renderer/core/inspector/inspector_trace_events.cc
@@ -381,7 +381,7 @@ const char* PseudoTypeToString(CSSSelector::PseudoType pseudo_type) {
     DEFINE_STRING_MAPPING(PseudoIsHtml)
     DEFINE_STRING_MAPPING(PseudoListBox)
     DEFINE_STRING_MAPPING(PseudoMultiSelectFocus)
-    DEFINE_STRING_MAPPING(PseudoTopLayer)
+    DEFINE_STRING_MAPPING(PseudoOpen)
     DEFINE_STRING_MAPPING(PseudoPopupHidden)
     DEFINE_STRING_MAPPING(PseudoHostHasAppearance)
     DEFINE_STRING_MAPPING(PseudoVideoPersistent)
diff --git a/blink/web_tests/external/wpt/html/semantics/forms/the-selectmenu-element/selectmenu-parts-structure.tentative.html b/blink/web_tests/external/wpt/html/semantics/forms/the-selectmenu-element/selectmenu-parts-structure.tentative.html
index 2f907c4fb53..e7b0bf77055 100644
--- a/blink/web_tests/external/wpt/html/semantics/forms/the-selectmenu-element/selectmenu-parts-structure.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/forms/the-selectmenu-element/selectmenu-parts-structure.tentative.html
@@ -208,13 +208,13 @@
     const selectMenu1Popup = document.getElementById("selectMenu1-popup");
     const selectMenu1Button = document.getElementById("selectMenu1-button");
     const selectMenu1Child2 = document.getElementById("selectMenu1-child2");
-    assert_false(selectMenu1Popup.matches(':top-layer'));
+    assert_false(selectMenu1Popup.matches(':open'));
     selectMenu1Button.click();
-    assert_false(selectMenu1Popup.matches(':top-layer'), "Clicking a button part that is a descendant of the listbox part should have no effect");
+    assert_false(selectMenu1Popup.matches(':open'), "Clicking a button part that is a descendant of the listbox part should have no effect");
 
     assert_equals(selectMenu1.value, "one");
     await clickOn(selectMenu1);
-    assert_true(selectMenu1Popup.matches(':top-layer'));
+    assert_true(selectMenu1Popup.matches(':open'));
     await clickOn(selectMenu1Child2);
     assert_equals(selectMenu1.value, "two", "Clicking an <option> should change the value");
   }, "To receive button part controller code, an element labeled as a button must not be a descendant of the listbox part in a flat tree traversal");
@@ -226,9 +226,9 @@
     const selectMenu2Child2 = document.getElementById("selectMenu2-child2");
     const selectMenu2Child4 = document.getElementById("selectMenu2-child4");
 
-    assert_false(selectMenu2Popup.matches(':top-layer'));
+    assert_false(selectMenu2Popup.matches(':open'));
     await clickOn(selectMenu2Button);
-    assert_false(selectMenu2Popup.matches(':top-layer'), "Clicking a button part should not show an invalid listbox part");
+    assert_false(selectMenu2Popup.matches(':open'), "Clicking a button part should not show an invalid listbox part");
 
     assert_equals(selectMenu2.value, "three");
     await clickOn(selectMenu2Button);
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-anchor-nesting.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-anchor-nesting.tentative.html
index aa43dd9aea0..d4982949006 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-anchor-nesting.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-anchor-nesting.tentative.html
@@ -46,15 +46,15 @@
     setup({ explicit_done: true });
 
     popup2.showPopUp();
-    assert_false(popup1.matches(':top-layer'));
-    assert_true(popup2.matches(':top-layer'));
+    assert_false(popup1.matches(':open'));
+    assert_true(popup2.matches(':open'));
     await clickOn(button1);
     test(t => {
       // Button1 is the anchor for popup1, and an ancestor of popup2.
       // Since popup2 is open, but not popup1, button1 should not be
       // the anchor of any open popup. So popup2 should be closed.
-      assert_false(popup2.matches(':top-layer'));
-      assert_true(popup1.matches(':top-layer'));
+      assert_false(popup2.matches(':open'));
+      assert_true(popup1.matches(':open'));
     },'Nested popups (inside anchor elements) do not affect light dismiss');
 
     done();
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-animated-hide-cleanup.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-animated-hide-cleanup.tentative.html
index 00ff0db6f57..778b384f420 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-animated-hide-cleanup.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-animated-hide-cleanup.tentative.html
@@ -17,7 +17,7 @@
 [popup].animation {
   left: 0px;
 }
-[popup].animation:top-layer {
+[popup].animation:open {
   animation: move 1000s;
 }
 @keyframes move {
@@ -29,7 +29,7 @@
   opacity: 0;
   transition: opacity 5s;
 }
-[popup].transition:top-layer {
+[popup].transition:open {
   opacity: 1;
 }
 
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-animated-hide-display.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-animated-hide-display.tentative.html
index 0d9ff4a511b..0bbc6b23893 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-animated-hide-display.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-animated-hide-display.tentative.html
@@ -16,7 +16,7 @@
     left: 0;
     transition: left 20s steps(2, jump-end) -10s;
   }
-  [popup]:top-layer {
+  [popup]:open {
     left: 200px;
   }
   .topmost {
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-animated-hide-finishes.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-animated-hide-finishes.tentative.html
index 1213f4fefe4..a594ecad3f2 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-animated-hide-finishes.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-animated-hide-finishes.tentative.html
@@ -17,7 +17,7 @@
     /* Immediate transition: */
     transition: left 1s -1s;
   }
-  [popup]:top-layer {
+  [popup]:open {
     left: 200px;
   }
   [popup]::backdrop {
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-animated-show-display.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-animated-show-display.tentative.html
index 9bcc130d8de..f11529c4b75 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-animated-show-display.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-animated-show-display.tentative.html
@@ -16,7 +16,7 @@
     left: 0;
     transition: left 20s steps(2, jump-end) -10s;
   }
-  [popup]:top-layer {
+  [popup]:open {
     left: 200px;
   }
   .topmost {
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-animation-corner-cases.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-animation-corner-cases.tentative.html
index e85d1f72f2f..e2298fc1752 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-animation-corner-cases.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-animation-corner-cases.tentative.html
@@ -10,15 +10,15 @@
 <body>
 <style>
 .animation { opacity: 0; }
-.animation:top-layer { opacity: 1; }
-.animation:not(:top-layer) { animation: fade-out 1000s; }
+.animation:open { opacity: 1; }
+.animation:not(:open) { animation: fade-out 1000s; }
 @keyframes fade-out {
   from { opacity: 1; }
   to { opacity: 0; }
 }
 
 .animation>div>div { left: 0; }
-.animation:not(:top-layer)>div>div { animation: rotate 1000s; color:red;}
+.animation:not(:open)>div>div { animation: rotate 1000s; color:red;}
 @keyframes rotate {
   from { transform: rotate(0); }
   to { transform: rotate(360deg); }
@@ -46,13 +46,13 @@
   assert_false(isElementVisible(popUp));
   assert_equals(descendent.parentElement.parentElement,popUp);
   popUp.showPopUp();
-  assert_true(popUp.matches(':top-layer'));
+  assert_true(popUp.matches(':open'));
   assert_true(isElementVisible(popUp));
   assert_equals(popUp.getAnimations({subtree: true}).length,0);
   popUp.hidePopUp();
   const animations = popUp.getAnimations({subtree: true});
   assert_equals(animations.length,2,'There should be two animations running');
-  assert_false(popUp.matches(':top-layer'),'popUp should not match :top-layer as soon as hidden');
+  assert_false(popUp.matches(':open'),'popUp should not match :open as soon as hidden');
   assert_true(isElementVisible(popUp),'but animations should keep the popUp visible');
   assert_true(isElementVisible(descendent),'The descendent should also be visible');
   await waitForRender();
@@ -61,7 +61,7 @@
   assert_true(isElementVisible(popUp),'PopUp should still be visible due to animation');
   animations.forEach(animation => animation.finish()); // Force the animations to finish
   await waitForRender(); // Wait one frame
-  assert_false(popUp.matches(':top-layer'),'The pop up still shouldn\'t match :top-layer');
+  assert_false(popUp.matches(':open'),'The pop up still shouldn\'t match :open');
   assert_false(isElementVisible(popUp),'The pop up should now be invisible');
   assert_false(isElementVisible(descendent),'The descendent should also be invisible');
   assert_equals(popUp.getAnimations({subtree: true}).length,0);
@@ -72,7 +72,7 @@
   assert_equals(popUp.classList.length, 0);
   assert_false(isElementVisible(popUp));
   popUp.showPopUp();
-  assert_true(popUp.matches(':top-layer'));
+  assert_true(popUp.matches(':open'));
   assert_true(isElementVisible(popUp));
   assert_equals(popUp.getAnimations({subtree: true}).length,0);
   // Start an animation on the popUp and its descendent.
@@ -81,7 +81,7 @@
   assert_equals(popUp.getAnimations({subtree: true}).length,2);
   // Then hide the popUp.
   popUp.hidePopUp();
-  assert_false(popUp.matches(':top-layer'),'pop up should not match :top-layer as soon as hidden');
+  assert_false(popUp.matches(':open'),'pop up should not match :open as soon as hidden');
   assert_equals(popUp.getAnimations({subtree: true}).length,2,'animations should still be running');
   await waitForRender();
   assert_equals(popUp.getAnimations({subtree: true}).length,2,'animations should still be running');
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-attribute-basic.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-attribute-basic.tentative.html
index 1ff7f13c61d..4554162c3cc 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-attribute-basic.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-attribute-basic.tentative.html
@@ -26,7 +26,7 @@
   opacity: 0;
   transition: opacity 10s;
 }
-[popup].animated:top-layer {
+[popup].animated:open {
   opacity: 1;
 }
 </style>
@@ -36,10 +36,10 @@
     const isVisible = isElementVisible(popUp);
     if (isVisible) {
       assert_not_equals(window.getComputedStyle(popUp).display,'none');
-      assert_equals(popUp.matches(':top-layer'),isPopUp);
+      assert_equals(popUp.matches(':open'),isPopUp);
     } else {
       assert_equals(window.getComputedStyle(popUp).display,'none');
-      assert_false(popUp.matches(':top-layer'));
+      assert_false(popUp.matches(':open'));
     }
     return isVisible;
   }
@@ -166,17 +166,17 @@
   test((t) => {
     const popUp = createPopUp(t);
     popUp.showPopUp();
-    assert_true(popUp.matches(':top-layer'));
+    assert_true(popUp.matches(':open'));
     popUp.setAttribute('popup','hint'); // Change pop-up type
-    assert_false(popUp.matches(':top-layer'));
+    assert_false(popUp.matches(':open'));
     popUp.showPopUp();
-    assert_true(popUp.matches(':top-layer'));
+    assert_true(popUp.matches(':open'));
     popUp.setAttribute('popup','manual');
-    assert_false(popUp.matches(':top-layer'));
+    assert_false(popUp.matches(':open'));
     popUp.showPopUp();
-    assert_true(popUp.matches(':top-layer'));
+    assert_true(popUp.matches(':open'));
     popUp.setAttribute('popup','invalid');
-    assert_false(popUp.matches(':top-layer'));
+    assert_false(popUp.matches(':open'));
   },'Changing attribute values should close open pop-ups');
 
   function modalPseudoSupported() {
@@ -193,11 +193,11 @@
       const popUp = createPopUp(t);
       popUp.setAttribute('popup',type);
       popUp.showPopUp();
-      assert_true(popUp.matches(':top-layer'));
+      assert_true(popUp.matches(':open'));
       popUp.remove();
-      assert_false(popUp.matches(':top-layer'));
+      assert_false(popUp.matches(':open'));
       document.body.appendChild(popUp);
-      assert_false(popUp.matches(':top-layer'));
+      assert_false(popUp.matches(':open'));
     },`Removing a visible popup=${type} element from the document should close the pop-up`);
 
     if (modalPseudoSupported()) {
@@ -205,7 +205,7 @@
         const popUp = createPopUp(t);
         popUp.setAttribute('popup',type);
         popUp.showPopUp();
-        assert_true(popUp.matches(':top-layer'));
+        assert_true(popUp.matches(':open'));
         assert_false(popUp.matches(':modal'));
         popUp.hidePopUp();
       },`A showing popup=${type} does not match :modal`);
@@ -217,14 +217,14 @@
     assert_true(!!popUp);
     assert_false(isElementVisible(popUp));
     popUp.showPopUp();
-    assert_true(popUp.matches(':top-layer'));
+    assert_true(popUp.matches(':open'));
     assert_true(getComputedStyle(popUp).opacity < 0.1,'Animations should start on show');
     assert_throws_dom("InvalidStateError",() => popUp.showPopUp(),'Calling showPopUp on a popup that is in the process of animating show should throw InvalidStateError');
     await finishAnimations(popUp);
     assert_true(getComputedStyle(popUp).opacity > 0.9);
     assert_true(isElementVisible(popUp));
     popUp.hidePopUp();
-    assert_false(popUp.matches(':top-layer'));
+    assert_false(popUp.matches(':open'));
     assert_true(getComputedStyle(popUp).opacity > 0.9,'Animations should start on hide');
     assert_throws_dom("InvalidStateError",() => popUp.hidePopUp(),'Calling hidePopUp on a popup that is in the process of animating hide should throw InvalidStateError');
     popUp.showPopUp(); // But showPopUp should still be ok.
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-defaultopen-2.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-defaultopen-2.tentative.html
index 36b621f2cf0..83cc160c6c3 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-defaultopen-2.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-defaultopen-2.tentative.html
@@ -16,8 +16,8 @@
   requestAnimationFrame(() => {
     requestAnimationFrame(() => {
       test(function(){
-        assert_true(p1.matches(':top-layer'),'The first (outermost) popup should be the one that opens in this case');
-        assert_false(p2.matches(':top-layer'),'The inner popup should not be open');
+        assert_true(p1.matches(':open'),'The first (outermost) popup should be the one that opens in this case');
+        assert_false(p2.matches(':open'),'The inner popup should not be open');
       }, "The defaultopen attribute should cause only the first popup to open");
     });
   });
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-defaultopen-hints.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-defaultopen-hints.tentative.html
index 9bc841eb772..a7535fab203 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-defaultopen-hints.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-defaultopen-hints.tentative.html
@@ -13,7 +13,7 @@
     await waitForRender();
     await waitForRender();
     const popUp = document.querySelector('[popup]');
-    assert_false(popUp.matches(':top-layer'),'defaultopen does not apply to hint pop-ups');
+    assert_false(popUp.matches(':open'),'defaultopen does not apply to hint pop-ups');
     assert_true(popUp.hasAttribute('defaultopen'),'attribute should still be present');
     assert_true(popUp.defaultOpen,'defaultopen should be present/true, even if not opened');
   }, "The defaultopen attribute should not apply to popup=hint");
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-defaultopen.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-defaultopen.tentative.html
index f673d1d8320..beb8c7468c6 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-defaultopen.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-defaultopen.tentative.html
@@ -17,24 +17,24 @@
   requestAnimationFrame(() => {
     requestAnimationFrame(() => {
       test(function(){
-        assert_true(p1.matches(':top-layer'),'defaultopen should open the popup');
+        assert_true(p1.matches(':open'),'defaultopen should open the popup');
         assert_true(p1.hasAttribute('defaultopen'));
         assert_true(p1.defaultOpen,'defaultopen should be reflected in the IDL attribute');
-        assert_false(p2.matches(':top-layer'), 'Only the first popup with defaultopen should be open on load');
+        assert_false(p2.matches(':open'), 'Only the first popup with defaultopen should be open on load');
         assert_true(p2.hasAttribute('defaultopen'),'defaultopen should be present/true, even if not opened');
         assert_true(p2.defaultOpen,'defaultopen should be present/true, even if not opened');
 
-        assert_true(p4.matches(':top-layer'),'defaultopen should open all manual popups');
-        assert_true(p5.matches(':top-layer'),'defaultopen should open all manual popups');
+        assert_true(p4.matches(':open'),'defaultopen should open all manual popups');
+        assert_true(p5.matches(':open'),'defaultopen should open all manual popups');
 
-        assert_false(p3.matches(':top-layer'));
+        assert_false(p3.matches(':open'));
         p3.setAttribute('defaultopen','');
-        assert_false(p3.matches(':top-layer'), 'Changing defaultopen should not affect open status');
+        assert_false(p3.matches(':open'), 'Changing defaultopen should not affect open status');
         assert_true(p3.hasAttribute('defaultopen'));
         assert_true(p3.defaultOpen,'defaultopen should still reflect to IDL');
 
         p1.removeAttribute('defaultopen');
-        assert_true(p1.matches(':top-layer'),'removing defaultopen should not close the popup');
+        assert_true(p1.matches(':open'),'removing defaultopen should not close the popup');
         assert_false(p1.hasAttribute('defaultopen'),'...but it should reflect to IDL');
 
         p1.hidePopUp();
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-events.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-events.tentative.html
index 4e2051f275d..441980177c3 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-events.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-events.tentative.html
@@ -15,7 +15,7 @@
     const popup = document.querySelector('[popup]');
     let showCount = 0;
     let hideCount = 0;
-    assert_false(popup.matches(':top-layer'));
+    assert_false(popup.matches(':open'));
     const controller = new AbortController();
     const signal = controller.signal;
     t.add_cleanup(() => controller.abort());
@@ -24,18 +24,18 @@
     assert_equals(0,showCount);
     assert_equals(0,hideCount);
     popup.showPopUp();
-    assert_true(popup.matches(':top-layer'));
+    assert_true(popup.matches(':open'));
     assert_equals(1,showCount);
     assert_equals(0,hideCount);
     await waitForRender();
-    assert_true(popup.matches(':top-layer'));
+    assert_true(popup.matches(':open'));
     popup.hidePopUp();
-    assert_false(popup.matches(':top-layer'));
+    assert_false(popup.matches(':open'));
     assert_equals(1,showCount);
     assert_equals(1,hideCount);
     await waitForRender();
     // No additional events after animation frame
-    assert_false(popup.matches(':top-layer'));
+    assert_false(popup.matches(':open'));
     assert_equals(1,showCount);
     assert_equals(1,hideCount);
   }, 'Show and hide events get properly dispatched for popups');
@@ -50,14 +50,14 @@
       if (cancel)
         e.preventDefault();
     }, {signal});
-    assert_false(popUp.matches(':top-layer'));
+    assert_false(popUp.matches(':open'));
     popUp.showPopUp();
-    assert_false(popUp.matches(':top-layer'),'The "show" event should be cancelable');
+    assert_false(popUp.matches(':open'),'The "show" event should be cancelable');
     cancel = false;
     popUp.showPopUp();
-    assert_true(popUp.matches(':top-layer'));
+    assert_true(popUp.matches(':open'));
     popUp.hidePopUp();
-    assert_false(popUp.matches(':top-layer'));
+    assert_false(popUp.matches(':open'));
   }, 'Show event is cancelable');
 };
 </script>
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-focus.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-focus.tentative.html
index 4290b7dda50..f88f4c2ad83 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-focus.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-focus.tentative.html
@@ -56,12 +56,12 @@
     left:150px;
     opacity: 0;
   }
-  [popup]:not(:top-layer) {
+  [popup]:not(:open) {
     /* Add a *hide* transition to all popups, to make sure animations don't
        affect focus management */
     transition: opacity 10s;
   }
-  [popup]:top-layer {
+  [popup]:open {
     opacity: 1;
   }
   :focus-within { border: 5px dashed red; }
@@ -104,7 +104,7 @@
         expectedFocusedElement = priorFocus;
       }
       assert_true(!!expectedFocusedElement);
-      assert_false(popUp.matches(':top-layer'));
+      assert_false(popUp.matches(':open'));
 
       // Directly show and hide the pop-up:
       priorFocus.focus();
@@ -130,7 +130,7 @@
       assert_equals(document.activeElement, expectedFocusedElement, `${testName} activated by popUp.showPopUp()`);
       assert_equals(popUp.popUp, 'auto', 'All pop-ups in this test should start as popup=auto');
       popUp.popUp = 'hint';
-      assert_false(popUp.matches(':top-layer'), 'Changing the pop-up type should hide the pop-up');
+      assert_false(popUp.matches(':open'), 'Changing the pop-up type should hide the pop-up');
       assert_equals(document.activeElement, priorFocus, 'prior element should get focus when the type is changed');
       await finishAnimationsAndVerifyHide(popUp);
       popUp.popUp = 'auto';
@@ -161,14 +161,14 @@
       const button = addInvoker(t, popUp);
       priorFocus.focus();
       button.click();
-      assert_true(popUp.matches(':top-layer'));
+      assert_true(popUp.matches(':open'));
       assert_equals(document.activeElement, expectedFocusedElement, `${testName} activated by button.click()`);
 
       // Make sure we can directly focus the (already open) pop-up:
       popUp.focus();
       assert_equals(document.activeElement, popUp.hasAttribute('tabindex') ? popUp : expectedFocusedElement, `${testName} directly focus with popUp.focus()`);
       button.click(); // Button is set to toggle the pop-up
-      assert_false(popUp.matches(':top-layer'));
+      assert_false(popUp.matches(':open'));
       assert_equals(document.activeElement, priorFocus, 'prior element should get focus on button-toggled hide');
       await finishAnimationsAndVerifyHide(popUp);
 
@@ -179,14 +179,14 @@
       popUp.showPopUp();
       assert_equals(document.activeElement, expectedFocusedElement, `${testName} activated by popUp.showPopUp()`);
       anotherFocus.focus();
-      assert_false(popUp.matches(':top-layer'),'focusing another element should hide the pop-up');
+      assert_false(popUp.matches(':open'),'focusing another element should hide the pop-up');
       assert_equals(document.activeElement, anotherFocus, 'prior element should *not* get focus in this case');
       await finishAnimationsAndVerifyHide(popUp);
     }, "Popup focus test: " + testName);
 
     promise_test(async t => {
       const priorFocus = addPriorFocus(t);
-      assert_false(popUp.matches(':top-layer'), 'pop-up should start out hidden');
+      assert_false(popUp.matches(':open'), 'pop-up should start out hidden');
       let button = addInvoker(t, popUp);
       assert_equals(button.getAttribute('popuptoggletarget'), popUp.id, 'This test assumes the button uses `popuptoggletarget`.');
       assert_not_equals(button, priorFocus, 'Stranger things have happened');
@@ -194,9 +194,9 @@
       priorFocus.focus();
       assert_equals(document.activeElement, priorFocus);
       popUp.showPopUp();
-      assert_true(popUp.matches(':top-layer'));
+      assert_true(popUp.matches(':open'));
       await clickOn(button); // This will *not* light dismiss, but will "toggle" the popUp.
-      assert_false(popUp.matches(':top-layer'));
+      assert_false(popUp.matches(':open'));
       const changesFocus = !popUp.hasAttribute('data-no-focus');
       if (changesFocus)
         assert_equals(document.activeElement, priorFocus, 'focus should return to the prior focus, if focus moved on show');
@@ -211,12 +211,12 @@
       t.add_cleanup(() => button.remove());
       priorFocus.focus();
       popUp.showPopUp();
-      assert_true(popUp.matches(':top-layer'));
+      assert_true(popUp.matches(':open'));
       if (changesFocus) {
         assert_not_equals(document.activeElement, priorFocus, 'focus should shift for this element');
       }
       await clickOn(button);
-      assert_false(popUp.matches(':top-layer'), 'clicking button should hide the pop-up');
+      assert_false(popUp.matches(':open'), 'clicking button should hide the pop-up');
       if (changesFocus) {
         assert_equals(document.activeElement, priorFocus, 'Contained button should return focus to the previously focused element, if focus moved on show');
       }
@@ -227,9 +227,9 @@
       document.body.appendChild(button);
       priorFocus.focus();
       popUp.showPopUp();
-      assert_true(popUp.matches(':top-layer'));
+      assert_true(popUp.matches(':open'));
       await clickOn(button); // This will light dismiss the pop-up, focus the prior focus, then focus this button.
-      assert_false(popUp.matches(':top-layer'), 'clicking button should hide the pop-up (via light dismiss)');
+      assert_false(popUp.matches(':open'), 'clicking button should hide the pop-up (via light dismiss)');
       assert_equals(document.activeElement, button, 'Focus should go to unrelated button on light dismiss');
       await finishAnimationsAndVerifyHide(popUp);
     }, "Popup button click focus test: " + testName);
@@ -240,12 +240,12 @@
         return;
       }
       const priorFocus = addPriorFocus(t);
-      assert_false(popUp.matches(':top-layer'), 'pop-up should start out hidden');
+      assert_false(popUp.matches(':open'), 'pop-up should start out hidden');
 
       // Move the prior focus out of the document
       priorFocus.focus();
       popUp.showPopUp();
-      assert_true(popUp.matches(':top-layer'));
+      assert_true(popUp.matches(':open'));
       const newFocus = document.activeElement;
       assert_not_equals(newFocus, priorFocus, 'focus should shift for this element');
       priorFocus.remove();
@@ -258,11 +258,11 @@
       // Move the prior focus inside the (already open) pop-up
       priorFocus.focus();
       popUp.showPopUp();
-      assert_true(popUp.matches(':top-layer'));
+      assert_true(popUp.matches(':open'));
       assert_false(popUp.contains(priorFocus), 'Start with a non-contained prior focus');
       popUp.appendChild(priorFocus); // Move inside the pop-up
       assert_true(popUp.contains(priorFocus));
-      assert_true(popUp.matches(':top-layer'), 'pop-up should stay open');
+      assert_true(popUp.matches(':open'), 'pop-up should stay open');
       popUp.hidePopUp();
       await waitForRender();
       assert_true(isElementVisible(popUp),'Animations should keep the pop-up visible');
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-hidden-display.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-hidden-display.tentative.html
index b3845f82707..d66611a08f5 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-hidden-display.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-hidden-display.tentative.html
@@ -22,10 +22,10 @@
   [popup].toplayer {
     background: red;
   }
-  [popup].toplayer:top-layer {
+  [popup].toplayer:open {
     background: green;
   }
-  [popup].nottoplayer:top-layer {
+  [popup].nottoplayer:open {
     background: red;
   }
 </style>
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-inside-display-none.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-inside-display-none.tentative.html
index d60b0df9068..189ffdd5ffd 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-inside-display-none.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-inside-display-none.tentative.html
@@ -13,6 +13,6 @@
 <script>
   const popup = document.querySelector('[popup]');
   popup.showPopUp();
-  if (!popup.matches(':top-layer'))
+  if (!popup.matches(':open'))
     document.body.appendChild(document.createTextNode('FAIL'));
 </script>
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-invoking-attribute.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-invoking-attribute.tentative.html
index bdfa0fe1a12..b676eed5405 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-invoking-attribute.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-invoking-attribute.tentative.html
@@ -105,7 +105,7 @@
                 const otherId = expectedId !== 1 ? 1 : 2;
                 function assertPopUpShowing(num,state,message) {
                   assert_true(num>0,`Invalid expectedId ${num}`);
-                  assert_equals((num===1 ? popUp1 : popUp2).matches(':top-layer'),state,message || "");
+                  assert_equals((num===1 ? popUp1 : popUp2).matches(':open'),state,message || "");
                 }
                 assertPopUpShowing(expectedId,false);
                 assertPopUpShowing(otherId,false);
@@ -179,7 +179,7 @@
 popUp.addEventListener('hide',() => ++hideCount);
 
 async function assertState(expectOpen,expectShow,expectHide) {
-  assert_equals(popUp.matches(':top-layer'),expectOpen,'Popup open state is incorrect');
+  assert_equals(popUp.matches(':open'),expectOpen,'Popup open state is incorrect');
   await new Promise(resolve => requestAnimationFrame(resolve));
   assert_equals(showCount,expectShow,'Show count is incorrect');
   assert_equals(hideCount,expectHide,'Hide count is incorrect');
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-light-dismiss-on-scroll.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-light-dismiss-on-scroll.tentative.html
index 3c32a6dc6a9..d48f1b4b63f 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-light-dismiss-on-scroll.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-light-dismiss-on-scroll.tentative.html
@@ -39,7 +39,7 @@
   const popups = document.querySelectorAll('[popup]');
   function assertAll(showing) {
     for(let popup of popups) {
-      assert_equals(popup.matches(':top-layer'),showing);
+      assert_equals(popup.matches(':open'),showing);
     }
   }
   async_test(t => {
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-light-dismiss.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-light-dismiss.tentative.html
index 7f8f32b645e..7cd95d8dc23 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-light-dismiss.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-light-dismiss.tentative.html
@@ -56,47 +56,47 @@
     e.preventDefault(); // 'hide' should not be cancellable.
   });
   promise_test(async () => {
-    assert_false(popup1.matches(':top-layer'));
+    assert_false(popup1.matches(':open'));
     popup1.showPopUp();
-    assert_true(popup1.matches(':top-layer'));
+    assert_true(popup1.matches(':open'));
     let p1HideCount = popup1HideCount;
     await clickOn(outside);
-    assert_false(popup1.matches(':top-layer'));
+    assert_false(popup1.matches(':open'));
     assert_equals(popup1HideCount,p1HideCount+1);
   },'Clicking outside a popup will dismiss the popup');
 
   promise_test(async () => {
-    assert_false(popup1.matches(':top-layer'));
+    assert_false(popup1.matches(':open'));
     popup1.showPopUp();
     await waitForRender();
     p1HideCount = popup1HideCount;
     await clickOn(inside1);
-    assert_true(popup1.matches(':top-layer'));
+    assert_true(popup1.matches(':open'));
     assert_equals(popup1HideCount,p1HideCount);
     popup1.hidePopUp();
   },'Clicking inside a popup does not close that popup');
 
   promise_test(async () => {
-    assert_false(popup1.matches(':top-layer'));
+    assert_false(popup1.matches(':open'));
     popup1.showPopUp();
     await waitForRender();
-    assert_true(popup1.matches(':top-layer'));
+    assert_true(popup1.matches(':open'));
     outside.dispatchEvent(new Event('mousedown'));
     await waitForRender();
-    assert_true(popup1.matches(':top-layer'),'mousedown (outside the pop-up) should not hide the pop-up');
+    assert_true(popup1.matches(':open'),'mousedown (outside the pop-up) should not hide the pop-up');
     outside.dispatchEvent(new Event('mouseup'));
     await waitForRender();
-    assert_false(popup1.matches(':top-layer'),'mouseup (outside the pop-up) should trigger light dismiss');
+    assert_false(popup1.matches(':open'),'mouseup (outside the pop-up) should trigger light dismiss');
   },'Pop-ups close on mouseup, not mousedown');
 
   promise_test(async () => {
-    assert_false(popup1.matches(':top-layer'));
+    assert_false(popup1.matches(':open'));
     popup1.showPopUp();
     await clickOn(inside1After);
-    assert_true(popup1.matches(':top-layer'));
+    assert_true(popup1.matches(':open'));
     await sendTab();
     assert_equals(document.activeElement,afterp1,'Focus should move to a button outside the popup');
-    assert_false(popup1.matches(':top-layer'));
+    assert_false(popup1.matches(':open'));
   },'Moving focus outside the popup will dismiss the popup');
 
   promise_test(async () => {
@@ -106,13 +106,13 @@
     p1HideCount = popup1HideCount;
     let p2HideCount = popup2HideCount;
     await clickOn(inside2);
-    assert_true(popup1.matches(':top-layer'),'popup1 should be open');
-    assert_true(popup2.matches(':top-layer'),'popup2 should be open');
+    assert_true(popup1.matches(':open'),'popup1 should be open');
+    assert_true(popup2.matches(':open'),'popup2 should be open');
     assert_equals(popup1HideCount,p1HideCount,'popup1');
     assert_equals(popup2HideCount,p2HideCount,'popup2');
     popup1.hidePopUp();
-    assert_false(popup1.matches(':top-layer'));
-    assert_false(popup2.matches(':top-layer'));
+    assert_false(popup1.matches(':open'));
+    assert_false(popup2.matches(':open'));
   },'Clicking inside a child popup shouldn\'t close either popup');
 
   promise_test(async () => {
@@ -122,93 +122,93 @@
     p1HideCount = popup1HideCount;
     p2HideCount = popup2HideCount;
     await clickOn(inside1);
-    assert_true(popup1.matches(':top-layer'));
+    assert_true(popup1.matches(':open'));
     assert_equals(popup1HideCount,p1HideCount);
-    assert_false(popup2.matches(':top-layer'));
+    assert_false(popup2.matches(':open'));
     assert_equals(popup2HideCount,p2HideCount+1);
     popup1.hidePopUp();
   },'Clicking inside a parent popup should close child popup');
 
   promise_test(async () => {
     await clickOn(button1show);
-    assert_true(popup1.matches(':top-layer'));
+    assert_true(popup1.matches(':open'));
     await waitForRender();
     p1HideCount = popup1HideCount;
     await clickOn(button1show);
-    assert_true(popup1.matches(':top-layer'),'popup1 should stay open');
+    assert_true(popup1.matches(':open'),'popup1 should stay open');
     assert_equals(popup1HideCount,p1HideCount,'popup1 should not get hidden and reshown');
     popup1.hidePopUp(); // Cleanup
-    assert_false(popup1.matches(':top-layer'));
+    assert_false(popup1.matches(':open'));
   },'Clicking on invoking element, after using it for activation, shouldn\'t close its popup');
 
   promise_test(async () => {
     popup1.showPopUp();
-    assert_true(popup1.matches(':top-layer'));
-    assert_false(popup2.matches(':top-layer'));
+    assert_true(popup1.matches(':open'));
+    assert_false(popup2.matches(':open'));
     await clickOn(button2);
-    assert_true(popup2.matches(':top-layer'),'button2 should activate popup2');
+    assert_true(popup2.matches(':open'),'button2 should activate popup2');
     p2HideCount = popup2HideCount;
     await clickOn(button2);
-    assert_true(popup2.matches(':top-layer'),'popup2 should stay open');
+    assert_true(popup2.matches(':open'),'popup2 should stay open');
     assert_equals(popup2HideCount,p2HideCount,'popup2 should not get hidden and reshown');
     popup1.hidePopUp(); // Cleanup
-    assert_false(popup1.matches(':top-layer'));
-    assert_false(popup2.matches(':top-layer'));
+    assert_false(popup1.matches(':open'));
+    assert_false(popup2.matches(':open'));
   },'Clicking on invoking element, after using it for activation, shouldn\'t close its popup (nested case)');
 
   promise_test(async () => {
     popup1.showPopUp();
     popup2.showPopUp();
-    assert_true(popup1.matches(':top-layer'));
-    assert_true(popup2.matches(':top-layer'));
+    assert_true(popup1.matches(':open'));
+    assert_true(popup2.matches(':open'));
     p2HideCount = popup2HideCount;
     await clickOn(button2);
-    assert_true(popup2.matches(':top-layer'),'popup2 should stay open');
+    assert_true(popup2.matches(':open'),'popup2 should stay open');
     assert_equals(popup2HideCount,p2HideCount,'popup2 should not get hidden and reshown');
     popup1.hidePopUp(); // Cleanup
-    assert_false(popup1.matches(':top-layer'));
-    assert_false(popup2.matches(':top-layer'));
+    assert_false(popup1.matches(':open'));
+    assert_false(popup2.matches(':open'));
   },'Clicking on invoking element, after using it for activation, shouldn\'t close its popup (nested case, not used for invocation)');
 
   promise_test(async () => {
     popup1.showPopUp(); // Directly show the popup
-    assert_true(popup1.matches(':top-layer'));
+    assert_true(popup1.matches(':open'));
     await waitForRender();
     p1HideCount = popup1HideCount;
     await clickOn(button1show);
-    assert_true(popup1.matches(':top-layer'),'popup1 should stay open');
+    assert_true(popup1.matches(':open'),'popup1 should stay open');
     assert_equals(popup1HideCount,p1HideCount,'popup1 should not get hidden and reshown');
     popup1.hidePopUp(); // Cleanup
-    assert_false(popup1.matches(':top-layer'));
+    assert_false(popup1.matches(':open'));
   },'Clicking on invoking element, even if it wasn\'t used for activation, shouldn\'t close its popup');
 
   promise_test(async () => {
     popup1.showPopUp(); // Directly show the popup
-    assert_true(popup1.matches(':top-layer'));
+    assert_true(popup1.matches(':open'));
     await waitForRender();
     p1HideCount = popup1HideCount;
     await clickOn(button1toggle);
-    assert_false(popup1.matches(':top-layer'),'popup1 should be hidden by popuptoggletarget');
+    assert_false(popup1.matches(':open'),'popup1 should be hidden by popuptoggletarget');
     assert_equals(popup1HideCount,p1HideCount+1,'popup1 should get hidden only once by popuptoggletarget');
   },'Clicking on popuptoggletarget element, even if it wasn\'t used for activation, should hide it exactly once');
 
   promise_test(async () => {
     popup1.showPopUp();
-    assert_true(popup1.matches(':top-layer'));
+    assert_true(popup1.matches(':open'));
     await waitForRender();
     p1HideCount = popup1HideCount;
     await clickOn(popup1anchor);
-    assert_true(popup1.matches(':top-layer'),'popup1 not open');
+    assert_true(popup1.matches(':open'),'popup1 not open');
     assert_equals(popup1HideCount,p1HideCount);
     popup1.hidePopUp(); // Cleanup
-    assert_false(popup1.matches(':top-layer'));
+    assert_false(popup1.matches(':open'));
   },'Clicking on anchor element (that isn\'t an invoking element) shouldn\'t close its popup');
 
   promise_test(async () => {
     popup1.showPopUp();
     popup2.showPopUp(); // Popup1 is an ancestral element for popup2.
-    assert_true(popup1.matches(':top-layer'));
-    assert_true(popup2.matches(':top-layer'));
+    assert_true(popup1.matches(':open'));
+    assert_true(popup2.matches(':open'));
     const drag_actions = new test_driver.Actions();
     // Drag *from* popup2 *to* popup1 (its ancestor).
     await drag_actions.pointerMove(0,0,{origin: popup2})
@@ -216,10 +216,10 @@
       .pointerMove(0,0,{origin: popup1})
       .pointerUp({button: drag_actions.ButtonType.LEFT})
       .send();
-    assert_true(popup1.matches(':top-layer'),'popup1 should be open');
-    assert_true(popup2.matches(':top-layer'),'popup1 should be open');
+    assert_true(popup1.matches(':open'),'popup1 should be open');
+    assert_true(popup2.matches(':open'),'popup1 should be open');
     popup1.hidePopUp();
-    assert_false(popup2.matches(':top-layer'));
+    assert_false(popup2.matches(':open'));
   },'Dragging from an open popup outside an open popup should leave the popup open');
 </script>
 
@@ -242,28 +242,28 @@
   const button3 = document.querySelector('#b3');
   promise_test(async () => {
     await clickOn(button3);
-    assert_true(popup3.matches(':top-layer'),'invoking element should open popup');
+    assert_true(popup3.matches(':open'),'invoking element should open popup');
     popup4.showPopUp();
-    assert_true(popup4.matches(':top-layer'));
-    assert_true(popup3.matches(':top-layer'));
+    assert_true(popup4.matches(':open'));
+    assert_true(popup3.matches(':open'));
     popup3.hidePopUp(); // Cleanup
-    assert_false(popup3.matches(':top-layer'));
-    assert_false(popup4.matches(':top-layer'));
+    assert_false(popup3.matches(':open'));
+    assert_false(popup4.matches(':open'));
   },'An invoking element should be part of the ancestor chain');
 
   promise_test(async () => {
     await clickOn(button3);
-    assert_true(popup3.matches(':top-layer'));
-    assert_false(popup4.matches(':top-layer'));
-    assert_false(popup5.matches(':top-layer'));
+    assert_true(popup3.matches(':open'));
+    assert_false(popup4.matches(':open'));
+    assert_false(popup5.matches(':open'));
     popup5.showPopUp();
-    assert_true(popup3.matches(':top-layer'));
-    assert_false(popup4.matches(':top-layer'));
-    assert_true(popup5.matches(':top-layer'));
+    assert_true(popup3.matches(':open'));
+    assert_false(popup4.matches(':open'));
+    assert_true(popup5.matches(':open'));
     popup3.hidePopUp();
-    assert_false(popup3.matches(':top-layer'));
-    assert_false(popup4.matches(':top-layer'));
-    assert_false(popup5.matches(':top-layer'));
+    assert_false(popup3.matches(':open'));
+    assert_false(popup4.matches(':open'));
+    assert_false(popup5.matches(':open'));
   },'An invoking element that was not used to invoke the popup can still be part of the ancestor chain');
 </script>
 
@@ -287,7 +287,7 @@
     await new test_driver.Actions()
        .scroll(0, 0, 0, 50, {origin: popup6})
        .send();
-    assert_true(popup6.matches(':top-layer'),'popup6 should stay open');
+    assert_true(popup6.matches(':open'),'popup6 should stay open');
     assert_equals(popup6.scrollTop,50,'popup6 should be scrolled');
     popup6.hidePopUp();
   },'Scrolling within a popup should not close the popup');
@@ -311,18 +311,18 @@
   }
   promise_test(async () => {
     button7.click();
-    assert_true(popup7.matches(':top-layer'),'invoking element should open popup');
+    assert_true(popup7.matches(':open'),'invoking element should open popup');
     inside7.click();
-    assert_true(popup7.matches(':top-layer'));
+    assert_true(popup7.matches(':open'));
     popup7.hidePopUp();
   },'Clicking inside a shadow DOM popup does not close that popup');
 
   promise_test(async () => {
     button7.click();
     inside7.click();
-    assert_true(popup7.matches(':top-layer'));
+    assert_true(popup7.matches(':open'));
     await clickOn(outside);
-    assert_false(popup7.matches(':top-layer'));
+    assert_false(popup7.matches(':open'));
   },'Clicking outside a shadow DOM popup should close that popup');
 </script>
 
@@ -336,13 +336,13 @@
     const popup8 = document.querySelector('#p8');
     const inside8After = document.querySelector('#inside8after');
     const popup8Anchor = document.querySelector('#p8anchor');
-    assert_false(popup8.matches(':top-layer'));
+    assert_false(popup8.matches(':open'));
     popup8.showPopUp();
     await clickOn(inside8After);
-    assert_true(popup8.matches(':top-layer'));
+    assert_true(popup8.matches(':open'));
     await sendTab();
     assert_equals(document.activeElement,popup8Anchor,'Focus should move to the anchor element');
-    assert_true(popup8.matches(':top-layer'),'popup should stay open');
+    assert_true(popup8.matches(':open'),'popup should stay open');
     popup8.hidePopUp();
   },'Moving focus back to the anchor element should not dismiss the popup');
 </script>
@@ -357,13 +357,13 @@
     const popup9 = document.querySelector('#p9');
     const inside9After = document.querySelector('#inside9after');
     const popup9Invoker = document.querySelector('#b9after');
-    assert_false(popup9.matches(':top-layer'));
+    assert_false(popup9.matches(':open'));
     popup9Invoker.click(); // Trigger via the button
     await clickOn(inside9After);
-    assert_true(popup9.matches(':top-layer'));
+    assert_true(popup9.matches(':open'));
     await sendTab();
     assert_equals(document.activeElement,popup9Invoker,'Focus should move to the invoking element');
-    assert_true(popup9.matches(':top-layer'),'popup should stay open');
+    assert_true(popup9.matches(':open'),'popup should stay open');
     popup9.hidePopUp();
   },'Moving focus back to the active trigger element should not dismiss the popup');
 
@@ -371,13 +371,13 @@
     const popup9 = document.querySelector('#p9');
     const inside9After = document.querySelector('#inside9after');
     const popup9Invoker = document.querySelector('#b9after');
-    assert_false(popup9.matches(':top-layer'));
+    assert_false(popup9.matches(':open'));
     popup9.showPopUp(); // Trigger directly
     await clickOn(inside9After);
-    assert_true(popup9.matches(':top-layer'));
+    assert_true(popup9.matches(':open'));
     await sendTab();
     assert_equals(document.activeElement,popup9Invoker,'Focus should move to the invoking element');
-    assert_true(popup9.matches(':top-layer'),'popup should stay open - even though the trigger wasn\'t used, it points to this popup');
+    assert_true(popup9.matches(':open'),'popup should stay open - even though the trigger wasn\'t used, it points to this popup');
   },'Moving focus back to an inactive trigger element should also *not* dismiss the popup');
 </script>
 
@@ -409,51 +409,51 @@
 const convPopup4 = document.querySelector('#convoluted_p4');
 promise_test(async () => {
   convPopup1.showPopUp(); // Programmatically open p1
-  assert_true(convPopup1.matches(':top-layer'));
+  assert_true(convPopup1.matches(':open'));
   convPopup1.querySelector('button').click(); // Click to invoke p2
-  assert_true(convPopup1.matches(':top-layer'));
-  assert_true(convPopup2.matches(':top-layer'));
+  assert_true(convPopup1.matches(':open'));
+  assert_true(convPopup2.matches(':open'));
   convPopup2.querySelector('button').click(); // Click to invoke p3
-  assert_true(convPopup1.matches(':top-layer'));
-  assert_true(convPopup2.matches(':top-layer'));
-  assert_true(convPopup3.matches(':top-layer'));
+  assert_true(convPopup1.matches(':open'));
+  assert_true(convPopup2.matches(':open'));
+  assert_true(convPopup3.matches(':open'));
   convPopup3.querySelector('button').click(); // Click to invoke p4
-  assert_true(convPopup1.matches(':top-layer'));
-  assert_true(convPopup2.matches(':top-layer'));
-  assert_true(convPopup3.matches(':top-layer'));
-  assert_true(convPopup4.matches(':top-layer'));
+  assert_true(convPopup1.matches(':open'));
+  assert_true(convPopup2.matches(':open'));
+  assert_true(convPopup3.matches(':open'));
+  assert_true(convPopup4.matches(':open'));
   convPopup4.firstElementChild.click(); // Click within p4
-  assert_true(convPopup1.matches(':top-layer'));
-  assert_true(convPopup2.matches(':top-layer'));
-  assert_true(convPopup3.matches(':top-layer'));
-  assert_true(convPopup4.matches(':top-layer'));
+  assert_true(convPopup1.matches(':open'));
+  assert_true(convPopup2.matches(':open'));
+  assert_true(convPopup3.matches(':open'));
+  assert_true(convPopup4.matches(':open'));
   convPopup1.hidePopUp();
-  assert_false(convPopup1.matches(':top-layer'));
-  assert_false(convPopup2.matches(':top-layer'));
-  assert_false(convPopup3.matches(':top-layer'));
-  assert_false(convPopup4.matches(':top-layer'));
+  assert_false(convPopup1.matches(':open'));
+  assert_false(convPopup2.matches(':open'));
+  assert_false(convPopup3.matches(':open'));
+  assert_false(convPopup4.matches(':open'));
 },'Ensure circular/convoluted ancestral relationships are functional');
 
 promise_test(async () => {
   convPopup1.showPopUp(); // Programmatically open p1
   convPopup1.querySelector('button').click(); // Click to invoke p2
-  assert_true(convPopup1.matches(':top-layer'));
-  assert_true(convPopup2.matches(':top-layer'));
-  assert_false(convPopup3.matches(':top-layer'));
-  assert_false(convPopup4.matches(':top-layer'));
+  assert_true(convPopup1.matches(':open'));
+  assert_true(convPopup2.matches(':open'));
+  assert_false(convPopup3.matches(':open'));
+  assert_false(convPopup4.matches(':open'));
   convPopup4.showPopUp(); // Programmatically open p4
-  assert_true(convPopup1.matches(':top-layer'),'popup1 stays open because it is a DOM ancestor of popup4');
-  assert_false(convPopup2.matches(':top-layer'),'popup2 closes because it isn\'t connected to popup4 via active invokers');
-  assert_true(convPopup4.matches(':top-layer'));
+  assert_true(convPopup1.matches(':open'),'popup1 stays open because it is a DOM ancestor of popup4');
+  assert_false(convPopup2.matches(':open'),'popup2 closes because it isn\'t connected to popup4 via active invokers');
+  assert_true(convPopup4.matches(':open'));
   convPopup4.firstElementChild.click(); // Click within p4
-  assert_true(convPopup1.matches(':top-layer'),'nothing changes');
-  assert_false(convPopup2.matches(':top-layer'));
-  assert_true(convPopup4.matches(':top-layer'));
+  assert_true(convPopup1.matches(':open'),'nothing changes');
+  assert_false(convPopup2.matches(':open'));
+  assert_true(convPopup4.matches(':open'));
   convPopup1.hidePopUp();
-  assert_false(convPopup1.matches(':top-layer'));
-  assert_false(convPopup2.matches(':top-layer'));
-  assert_false(convPopup3.matches(':top-layer'));
-  assert_false(convPopup4.matches(':top-layer'));
+  assert_false(convPopup1.matches(':open'));
+  assert_false(convPopup2.matches(':open'));
+  assert_false(convPopup3.matches(':open'));
+  assert_false(convPopup4.matches(':open'));
 },'Ensure circular/convoluted ancestral relationships are functional, with a direct showPopUp()');
 </script>
 
@@ -475,30 +475,30 @@
   auto.showPopUp();
   hint.showPopUp();
   manual.showPopUp();
-  assert_true(auto.matches(':top-layer'));
-  assert_true(hint.matches(':top-layer'));
-  assert_true(manual.matches(':top-layer'));
+  assert_true(auto.matches(':open'));
+  assert_true(hint.matches(':open'));
+  assert_true(manual.matches(':open'));
   // Clicking the hint will close the auto, but not the manual.
   await clickOn(hint);
-  assert_false(auto.matches(':top-layer'),'auto should be hidden');
-  assert_true(hint.matches(':top-layer'),'hint should stay open');
-  assert_true(manual.matches(':top-layer'),'manual does not light dismiss');
+  assert_false(auto.matches(':open'),'auto should be hidden');
+  assert_true(hint.matches(':open'),'hint should stay open');
+  assert_true(manual.matches(':open'),'manual does not light dismiss');
   // Clicking outside should close the hint, but not the manual:
   await clickOn(outside);
-  assert_false(auto.matches(':top-layer'));
-  assert_false(hint.matches(':top-layer'),'hint should close');
-  assert_true(manual.matches(':top-layer'),'manual does not light dismiss');
+  assert_false(auto.matches(':open'));
+  assert_false(hint.matches(':open'),'hint should close');
+  assert_true(manual.matches(':open'),'manual does not light dismiss');
   manual.hidePopUp();
-  assert_false(manual.matches(':top-layer'));
+  assert_false(manual.matches(':open'));
   auto.showPopUp();
   hint.showPopUp();
-  assert_true(auto.matches(':top-layer'));
-  assert_true(hint.matches(':top-layer'));
+  assert_true(auto.matches(':open'));
+  assert_true(hint.matches(':open'));
   // Clicking on the auto should close the hint:
   await clickOn(auto);
-  assert_true(auto.matches(':top-layer'),'auto should stay open');
-  assert_false(hint.matches(':top-layer'),'hint should light dismiss');
+  assert_true(auto.matches(':open'),'auto should stay open');
+  assert_false(hint.matches(':open'),'hint should light dismiss');
   auto.hidePopUp();
-  assert_false(auto.matches(':top-layer'));
+  assert_false(auto.matches(':open'));
 },'Light dismiss of mixed popup types');
 </script>
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-not-keyboard-focusable.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-not-keyboard-focusable.tentative.html
index 3cc545f9ae7..393873fddce 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-not-keyboard-focusable.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-not-keyboard-focusable.tentative.html
@@ -23,12 +23,12 @@
   b1.focus();
   assert_equals(document.activeElement,b1);
   popup.showPopUp();
-  assert_true(popup.matches(':top-layer'));
+  assert_true(popup.matches(':open'));
   assert_equals(document.activeElement,b1);
   // Tab once
   await new test_driver.send_keys(document.body,'\uE004'); // Tab
   assert_equals(document.activeElement, b2, 'Keyboard focus should skip the open popup');
-  assert_false(popup.matches(':top-layer'),'changing focus should close the popup');
+  assert_false(popup.matches(':open'),'changing focus should close the popup');
 
   // Add a focusable button to the popup and make sure we can focus that
   const button = document.createElement('button');
@@ -39,8 +39,8 @@
   // Tab once
   await new test_driver.send_keys(document.body,'\uE004'); // Tab
   assert_equals(document.activeElement, button, 'Keyboard focus should go to the contained button');
-  assert_true(popup.matches(':top-layer'),'changing focus to the popup should leave it showing');
+  assert_true(popup.matches(':open'),'changing focus to the popup should leave it showing');
   popup.hidePopUp();
-  assert_false(popup.matches(':top-layer'));
+  assert_false(popup.matches(':open'));
 }, "Popup should not be keyboard focusable");
 </script>
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-removal-2.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-removal-2.tentative.html
index 7cf0951e5b1..807e625563e 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-removal-2.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-removal-2.tentative.html
@@ -16,13 +16,13 @@
       const frame2Doc = document.getElementById('frame2').contentDocument;
       const popup = frame1Doc.querySelector('[popup]');
       assert_true(!!popup);
-      assert_false(popup.matches(':top-layer'));
+      assert_false(popup.matches(':open'));
       popup.showPopUp();
-      assert_true(popup.matches(':top-layer'));
+      assert_true(popup.matches(':open'));
       frame2Doc.body.appendChild(popup);
-      assert_false(popup.matches(':top-layer'));
+      assert_false(popup.matches(':open'));
       popup.showPopUp();
-      assert_true(popup.matches(':top-layer'));
+      assert_true(popup.matches(':open'));
     }, 'Moving popup between documents shouldn\'t cause issues');
   };
 </script>
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-removal.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-removal.tentative.html
index f4df8623276..f43da58e4e2 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-removal.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-removal.tentative.html
@@ -16,9 +16,9 @@
     });
   }
   const popup = document.querySelector('[popup]');
-  assert_false(popup.matches(':top-layer'));
+  assert_false(popup.matches(':open'));
   popup.showPopUp();
-  assert_true(popup.matches(':top-layer'));
+  assert_true(popup.matches(':open'));
   popup.remove(); // Shouldn't cause any issues
   document.body.click(); // Shouldn't cause light dismiss problems
   await loadCompleted(); // The document should finish loading
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-shadow-dom.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-shadow-dom.tentative.html
index f2cb31a389c..cbec8a20233 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-shadow-dom.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-shadow-dom.tentative.html
@@ -56,7 +56,7 @@
   test(function() {
     const popup = getPopupReferences('test1')[0];
     popup.showPopUp();
-    assert_true(popup.matches(':top-layer'));
+    assert_true(popup.matches(':open'));
     assert_true(isElementVisible(popup));
     popup.hidePopUp(); // Cleanup
   }, "Popups located inside shadow DOM can still be shown");
@@ -83,12 +83,12 @@
   test(function() {
     const [popup1,popup2] = getPopupReferences('test2');
     popup1.showPopUp();
-    assert_true(popup1.matches(':top-layer'));
+    assert_true(popup1.matches(':open'));
     assert_true(isElementVisible(popup1));
     popup2.showPopUp();
-    assert_false(popup1.matches(':top-layer'), 'popup1 open'); // P1 was closed by P2
+    assert_false(popup1.matches(':open'), 'popup1 open'); // P1 was closed by P2
     assert_false(isElementVisible(popup1), 'popup1 visible');
-    assert_true(popup2.matches(':top-layer'), 'popup2 open'); // P2 is open
+    assert_true(popup2.matches(':open'), 'popup2 open'); // P2 is open
     assert_true(isElementVisible(popup2), 'popup2 visible');
     popup2.hidePopUp(); // Cleanup
   }, "anchor references do not cross shadow boundaries");
@@ -113,20 +113,20 @@
   promise_test(async function() {
     const [popup1,popup2] = getPopupReferences('test3');
     popup1.showPopUp();
-    assert_true(popup1.matches(':top-layer'));
+    assert_true(popup1.matches(':open'));
     assert_true(isElementVisible(popup1));
     // Showing popup2 should not close popup1, since it is a flat
     // tree ancestor of popup2's anchor button.
     popup2.showPopUp();
-    assert_true(popup2.matches(':top-layer'));
+    assert_true(popup2.matches(':open'));
     assert_true(isElementVisible(popup2));
-    assert_true(popup1.matches(':top-layer'));
+    assert_true(popup1.matches(':open'));
     assert_true(isElementVisible(popup1));
     popup1.hidePopUp();
     await waitForRender();
-    assert_false(popup1.matches(':top-layer'));
+    assert_false(popup1.matches(':open'));
     assert_false(isElementVisible(popup1));
-    assert_false(popup2.matches(':top-layer'));
+    assert_false(popup2.matches(':open'));
     assert_false(isElementVisible(popup2));
   }, "anchor references use the flat tree not the DOM tree");
 </script>
@@ -153,16 +153,16 @@
     popup1.showPopUp();
     popup2.showPopUp();
     // Both 1 and 2 should be open at this point.
-    assert_true(popup1.matches(':top-layer'), 'popup1 not open');
+    assert_true(popup1.matches(':open'), 'popup1 not open');
     assert_true(isElementVisible(popup1));
-    assert_true(popup2.matches(':top-layer'), 'popup2 not open');
+    assert_true(popup2.matches(':open'), 'popup2 not open');
     assert_true(isElementVisible(popup2));
     // This should hide both of them.
     popup1.hidePopUp();
     await waitForRender();
-    assert_false(popup1.matches(':top-layer'));
+    assert_false(popup1.matches(':open'));
     assert_false(isElementVisible(popup1));
-    assert_false(popup2.matches(':top-layer'));
+    assert_false(popup2.matches(':open'));
     assert_false(isElementVisible(popup2));
   }, "The popup stack is preserved across shadow-inclusive ancestors");
 </script>
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-stacking.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-stacking.tentative.html
index abe3f61996b..1bf3a108976 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-stacking.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-stacking.tentative.html
@@ -89,18 +89,18 @@
     const clickToActivate = example.querySelector('.clickme');
     test(function() {
       assert_true(!!descr && !!ancestor && !!child);
-      assert_false(ancestor.matches(':top-layer'));
-      assert_false(child.matches(':top-layer'));
+      assert_false(ancestor.matches(':open'));
+      assert_false(child.matches(':open'));
       ancestor.showPopUp();
       if (clickToActivate)
         clickToActivate.click();
       else
         child.showPopUp();
-      assert_true(child.matches(':top-layer'));
-      assert_true(ancestor.matches(':top-layer'));
+      assert_true(child.matches(':open'));
+      assert_true(ancestor.matches(':open'));
       ancestor.hidePopUp();
-      assert_false(ancestor.matches(':top-layer'));
-      assert_false(child.matches(':top-layer'));
+      assert_false(ancestor.matches(':open'));
+      assert_false(child.matches(':open'));
     },descr);
   }
 
@@ -109,7 +109,7 @@
   function assertState(...states) {
     assert_equals(popups.length,states.length);
     for(let i=0;i<popups.length;++i) {
-      assert_equals(popups[i].matches(':top-layer'),states[i],`Popup #${i+1} incorrect state`);
+      assert_equals(popups[i].matches(':open'),states[i],`Popup #${i+1} incorrect state`);
     }
   }
   test(function() {
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-top-layer-interactions.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-top-layer-interactions.tentative.html
index e12645afc27..b973a57f097 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-top-layer-interactions.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-top-layer-interactions.tentative.html
@@ -22,7 +22,7 @@
     createElement: () => Object.assign(document.createElement('div'), {popUp: 'auto'}),
     trigger: function() {this.element.showPopUp()},
     close: function() {this.element.hidePopUp()},
-    isTopLayer: function() {return this.element.matches(':top-layer')},
+    isTopLayer: function() {return this.element.matches(':open')},
   },
   {
     type: types.modalDialog,
diff --git a/blink/web_tests/external/wpt/html/semantics/popups/popup-types.tentative.html b/blink/web_tests/external/wpt/html/semantics/popups/popup-types.tentative.html
index b34df5f7960..f9479cbc849 100644
--- a/blink/web_tests/external/wpt/html/semantics/popups/popup-types.tentative.html
+++ b/blink/web_tests/external/wpt/html/semantics/popups/popup-types.tentative.html
@@ -17,10 +17,10 @@
     const manual = document.currentScript.parentElement.querySelectorAll('[popup=manual]')[0];
     const manual2 = document.currentScript.parentElement.querySelectorAll('[popup=manual]')[1];
     function assert_state_1(autoOpen,hintOpen,manualOpen,manual2Open) {
-      assert_equals(auto.matches(':top-layer'),autoOpen,'auto open state is incorrect');
-      assert_equals(hint.matches(':top-layer'),hintOpen,'hint open state is incorrect');
-      assert_equals(manual.matches(':top-layer'),manualOpen,'manual open state is incorrect');
-      assert_equals(manual2.matches(':top-layer'),manual2Open,'manual2 open state is incorrect');
+      assert_equals(auto.matches(':open'),autoOpen,'auto open state is incorrect');
+      assert_equals(hint.matches(':open'),hintOpen,'hint open state is incorrect');
+      assert_equals(manual.matches(':open'),manualOpen,'manual open state is incorrect');
+      assert_equals(manual2.matches(':open'),manual2Open,'manual2 open state is incorrect');
     }
     test(() => {
       assert_state_1(false,false,false,false);
@@ -81,10 +81,10 @@
     const popUp3 = document.currentScript.parentElement.querySelectorAll('[popup=""]')[2];
     const hint = document.currentScript.parentElement.querySelector('[popup=hint]');
     function assert_state_2(popUp1Open,popUp2Open,popUp3Open,hintOpen) {
-      assert_equals(popUp1.matches(':top-layer'),popUp1Open,'popUp1 open state is incorrect');
-      assert_equals(popUp2.matches(':top-layer'),popUp2Open,'popup2 open state is incorrect');
-      assert_equals(popUp3.matches(':top-layer'),popUp3Open,'popup3 open state is incorrect');
-      assert_equals(hint.matches(':top-layer'),hintOpen,'hint open state is incorrect');
+      assert_equals(popUp1.matches(':open'),popUp1Open,'popUp1 open state is incorrect');
+      assert_equals(popUp2.matches(':open'),popUp2Open,'popup2 open state is incorrect');
+      assert_equals(popUp3.matches(':open'),popUp3Open,'popup3 open state is incorrect');
+      assert_equals(hint.matches(':open'),hintOpen,'hint open state is incorrect');
     }
     test(() => {
       assert_state_2(false,false,false,false);
@@ -110,11 +110,11 @@
     const hint1 = document.currentScript.parentElement.querySelectorAll('[popup=hint]')[0];
     const hint2 = document.currentScript.parentElement.querySelectorAll('[popup=hint]')[1];
     hint1.showPopUp();
-    assert_true(hint1.matches(':top-layer'));
-    assert_false(hint2.matches(':top-layer'));
+    assert_true(hint1.matches(':open'));
+    assert_false(hint2.matches(':open'));
     hint2.showPopUp();
-    assert_false(hint1.matches(':top-layer'));
-    assert_true(hint2.matches(':top-layer'));
+    assert_false(hint1.matches(':open'));
+    assert_true(hint2.matches(':open'));
     hint2.hidePopUp();
   },'If a popup=hint is shown, it should hide any other open popup=hint pop-ups, including ancestral pop-ups. (You can\'t nest popup=hint)');
   </script>
@@ -129,11 +129,11 @@
     const hint = document.currentScript.parentElement.querySelector('[popup=hint]');
     const auto = document.currentScript.parentElement.querySelector('[popup=""]');
     hint.showPopUp();
-    assert_true(hint.matches(':top-layer'));
-    assert_false(auto.matches(':top-layer'));
+    assert_true(hint.matches(':open'));
+    assert_false(auto.matches(':open'));
     auto.showPopUp();
-    assert_false(hint.matches(':top-layer'));
-    assert_true(auto.matches(':top-layer'));
+    assert_false(hint.matches(':open'));
+    assert_true(auto.matches(':open'));
     auto.hidePopUp();
   },'If a popup=auto is shown, it should hide any open popup=hint, including if the popup=hint is an ancestral pop-up of the popup=auto. (You can\'t nest a popup=auto inside a popup=hint)');
   </script>
@@ -151,15 +151,15 @@
     const hint = document.currentScript.parentElement.querySelector('[popup=hint]');
     auto.showPopUp();
     auto2.showPopUp();
-    assert_true(auto.matches(':top-layer'));
-    assert_true(auto2.matches(':top-layer'));
+    assert_true(auto.matches(':open'));
+    assert_true(auto2.matches(':open'));
     hint.showPopUp(); // This should hide auto2, since it is nested in auto1.
-    assert_true(auto.matches(':top-layer'));
-    assert_false(auto2.matches(':top-layer'));
-    assert_true(hint.matches(':top-layer'));
+    assert_true(auto.matches(':open'));
+    assert_false(auto2.matches(':open'));
+    assert_true(hint.matches(':open'));
     auto.hidePopUp(); // Should hide both auto and hint.
-    assert_false(auto.matches(':top-layer'));
-    assert_false(hint.matches(':top-layer'));
+    assert_false(auto.matches(':open'));
+    assert_false(hint.matches(':open'));
   },'If you: a) show a popup=auto (call it D), then b) show a descendent popup=hint of D (call it T), then c) hide D, then T should be hidden. (A popup=hint can be nested inside a popup=auto)');
   </script>
 </div>
@@ -173,11 +173,11 @@
     const hint = document.currentScript.parentElement.querySelector('[popup=hint]');
     auto.showPopUp();
     hint.showPopUp();
-    assert_true(auto.matches(':top-layer'));
-    assert_true(hint.matches(':top-layer'));
+    assert_true(auto.matches(':open'));
+    assert_true(hint.matches(':open'));
     auto.hidePopUp();
-    assert_false(auto.matches(':top-layer'));
-    assert_true(hint.matches(':top-layer'));
+    assert_false(auto.matches(':open'));
+    assert_true(hint.matches(':open'));
     hint.hidePopUp();
   },'If you: a) show a popup=auto (call it D), then b) show a non-descendent popup=hint of D (call it T), then c) hide D, then T should be left showing. (Non-nested popup=hint can stay open when unrelated popup=autos are hidden)');
   </script>
diff --git a/blink/web_tests/html/popup/popup-light-dismiss-keyboard.html b/blink/web_tests/html/popup/popup-light-dismiss-keyboard.html
index 6a40880ed60..637e4d98321 100644
--- a/blink/web_tests/html/popup/popup-light-dismiss-keyboard.html
+++ b/blink/web_tests/html/popup/popup-light-dismiss-keyboard.html
@@ -36,10 +36,10 @@
     popup1.showPopUp();
     popup2.showPopUp();
     eventSender.keyDown("Escape");
-    assert_true(popup1.matches(':top-layer'));
-    assert_false(popup2.matches(':top-layer'));
+    assert_true(popup1.matches(':open'));
+    assert_false(popup2.matches(':open'));
     eventSender.keyDown("Escape");
-    assert_false(popup1.matches(':top-layer'));
-    assert_false(popup2.matches(':top-layer'));
+    assert_false(popup1.matches(':open'));
+    assert_false(popup2.matches(':open'));
   },'Escape key should close top level popup');
 </script>
diff --git a/blink/web_tests/virtual/popup-disabled/popup-disabled.html b/blink/web_tests/virtual/popup-disabled/popup-disabled.html
index f4e012310f5..c768118402a 100644
--- a/blink/web_tests/virtual/popup-disabled/popup-disabled.html
+++ b/blink/web_tests/virtual/popup-disabled/popup-disabled.html
@@ -21,7 +21,7 @@
 
   const elements = document.getElementById('elements').children;
   test(() => {
-    assert_throws_dom("SyntaxError",() => {elements[0].matches(':top-layer')},"The :popup-open pseudo class shouldn't be available");
+    assert_throws_dom("SyntaxError",() => {elements[0].matches(':open')},"The :popup-open pseudo class shouldn't be available");
   },'Basic tests');
 
   for(let el of elements) {