diff --git a/html/semantics/popups/popup-anchor-nesting.tentative.html b/html/semantics/popups/popup-anchor-nesting.tentative.html
index ee903c48ed08e6..aa43dd9aea0a6d 100644
--- a/html/semantics/popups/popup-anchor-nesting.tentative.html
+++ b/html/semantics/popups/popup-anchor-nesting.tentative.html
@@ -14,13 +14,13 @@
 <!-- This example has the anchor (b1) for one popup (p1)
      which contains a separate popup (p2) which is anchored
      by a separate anchor (b2). -->
-<button id=b1 onclick='p1.showPopup()'>Popup 1
+<button id=b1 onclick='p1.showPopUp()'>Popup 1
   <div popup id=p2 anchor=b2>
     <span id=inside2>Inside popup 2</span>
   </div>
 </button>
 <div popup id=p1 anchor=b1>This is popup 1</div>
-<button id=b2 onclick='p2.showPopup()'>Popup 2</button>
+<button id=b2 onclick='p2.showPopUp()'>Popup 2</button>
 
 <style>
   #p1 { top:50px; }
@@ -45,7 +45,7 @@
   (async function() {
     setup({ explicit_done: true });
 
-    popup2.showPopup();
+    popup2.showPopUp();
     assert_false(popup1.matches(':top-layer'));
     assert_true(popup2.matches(':top-layer'));
     await clickOn(button1);
diff --git a/html/semantics/popups/popup-animated-hide-cleanup.tentative.html b/html/semantics/popups/popup-animated-hide-cleanup.tentative.html
index 99fc2b895761d0..00ff0db6f57fbf 100644
--- a/html/semantics/popups/popup-animated-hide-cleanup.tentative.html
+++ b/html/semantics/popups/popup-animated-hide-cleanup.tentative.html
@@ -56,9 +56,9 @@
 promise_test(async () => {
   let popUp = addPopUp("animation");
   let dialog = document.querySelector('dialog');
-  popUp.showPopup(); // No animations here
+  popUp.showPopUp(); // No animations here
   await rAF();
-  popUp.hidePopup(); // Start animations
+  popUp.hidePopUp(); // Start animations
   await rAF();
   popUp.remove();
   garbageCollect();
@@ -69,9 +69,9 @@
 promise_test(async (t) => {
   let popUp = addPopUp("animation");
   let dialog = document.querySelector('dialog');
-  popUp.showPopup(); // No animations here
+  popUp.showPopUp(); // No animations here
   await rAF();
-  popUp.hidePopup(); // Start animations
+  popUp.hidePopUp(); // Start animations
   await rAF();
   dialog.showModal(); // Immediately hide pop-up
   t.add_cleanup(() => dialog.close());
@@ -89,7 +89,7 @@
   t.add_cleanup(() => {popUp.remove();button.remove();});
   document.body.appendChild(button);
   button.addEventListener('click',() => dialog.show());
-  popUp.showPopup(); // No animations here
+  popUp.showPopUp(); // No animations here
   await rAF();
   await clickOn(button);
   await rAF();
diff --git a/html/semantics/popups/popup-animated-hide-display.tentative.html b/html/semantics/popups/popup-animated-hide-display.tentative.html
index 410639e67152c8..ea25ea153e9efe 100644
--- a/html/semantics/popups/popup-animated-hide-display.tentative.html
+++ b/html/semantics/popups/popup-animated-hide-display.tentative.html
@@ -42,11 +42,11 @@
     requestAnimationFrame(() => {
       // This will show the popup, hide the popup, and start the transition.
       const popup = document.querySelector('[popup]');
-      popup.showPopup();
+      popup.showPopUp();
       popup.getAnimations()[0].finish();
       if (getComputedStyle(popup).left != "200px")
         popup.remove();
-      popup.hidePopup();
+      popup.hidePopUp();
       document.getAnimations()[0].ready.then(() => {
         requestAnimationFrame(() => {
           requestAnimationFrame(() => {
diff --git a/html/semantics/popups/popup-animated-hide-finishes.tentative.html b/html/semantics/popups/popup-animated-hide-finishes.tentative.html
index 88e37cb4e3bd7d..6ec2b7252ef699 100644
--- a/html/semantics/popups/popup-animated-hide-finishes.tentative.html
+++ b/html/semantics/popups/popup-animated-hide-finishes.tentative.html
@@ -46,8 +46,8 @@
     requestAnimationFrame(() => {
       // This will show the popup, hide the popup, and start the hide transition,
       // which should immediately finish.
-      document.querySelector('[popup]').showPopup();
-      document.querySelector('[popup]').hidePopup();
+      document.querySelector('[popup]').showPopUp();
+      document.querySelector('[popup]').hidePopUp();
       requestAnimationFrame(() => {
         requestAnimationFrame(() => {
           // Take a screenshot now.
diff --git a/html/semantics/popups/popup-animated-show-display.tentative.html b/html/semantics/popups/popup-animated-show-display.tentative.html
index deb75509264229..f03e6293209522 100644
--- a/html/semantics/popups/popup-animated-show-display.tentative.html
+++ b/html/semantics/popups/popup-animated-show-display.tentative.html
@@ -41,7 +41,7 @@
   requestAnimationFrame(() => {
     requestAnimationFrame(() => {
       // This will show the popup, and start the transition.
-      document.querySelector('[popup]').showPopup();
+      document.querySelector('[popup]').showPopUp();
       document.getAnimations()[0].ready.then(() => {
         requestAnimationFrame(() => {
           requestAnimationFrame(() => {
diff --git a/html/semantics/popups/popup-animation-corner-cases.tentative.html b/html/semantics/popups/popup-animation-corner-cases.tentative.html
index 96812870268120..5707e604d90e33 100644
--- a/html/semantics/popups/popup-animation-corner-cases.tentative.html
+++ b/html/semantics/popups/popup-animation-corner-cases.tentative.html
@@ -45,11 +45,11 @@
   const {popUp, descendent} = createPopUp(t,'animation');
   assert_false(isElementVisible(popUp));
   assert_equals(descendent.parentElement.parentElement,popUp);
-  popUp.showPopup();
+  popUp.showPopUp();
   assert_true(popUp.matches(':top-layer'));
   assert_true(isElementVisible(popUp));
   assert_equals(popUp.getAnimations({subtree: true}).length,0);
-  popUp.hidePopup();
+  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');
@@ -71,7 +71,7 @@
   const {popUp, descendent} = createPopUp(t,'');
   assert_equals(popUp.classList.length, 0);
   assert_false(isElementVisible(popUp));
-  popUp.showPopup();
+  popUp.showPopUp();
   assert_true(popUp.matches(':top-layer'));
   assert_true(isElementVisible(popUp));
   assert_equals(popUp.getAnimations({subtree: true}).length,0);
@@ -80,7 +80,7 @@
   descendent.animate([{transform: 'rotate(0)'},{transform: 'rotate(360deg)'}],{duration: 1000000,iterations: 1});
   assert_equals(popUp.getAnimations({subtree: true}).length,2);
   // Then hide the popUp.
-  popUp.hidePopup();
+  popUp.hidePopUp();
   assert_false(popUp.matches(':top-layer'),'pop up should not match :top-layer as soon as hidden');
   assert_equals(popUp.getAnimations({subtree: true}).length,2,'animations should still be running');
   await waitForRender();
diff --git a/html/semantics/popups/popup-attribute-basic.tentative.html b/html/semantics/popups/popup-attribute-basic.tentative.html
index 5e26a725761f0d..efcd3355ebe24a 100644
--- a/html/semantics/popups/popup-attribute-basic.tentative.html
+++ b/html/semantics/popups/popup-attribute-basic.tentative.html
@@ -34,36 +34,36 @@
   }
   function assertIsFunctionalPopUp(popUp) {
     assert_false(popUpVisible(popUp, /*isPopUp*/true));
-    popUp.showPopup();
+    popUp.showPopUp();
     assert_true(popUpVisible(popUp, /*isPopUp*/true));
-    assert_throws_dom("InvalidStateError",() => popUp.showPopup(),'Calling showPopup on a showing pop-up should throw InvalidStateError');
-    popUp.hidePopup();
+    assert_throws_dom("InvalidStateError",() => popUp.showPopUp(),'Calling showPopUp on a showing pop-up should throw InvalidStateError');
+    popUp.hidePopUp();
     assert_false(popUpVisible(popUp, /*isPopUp*/true));
-    assert_throws_dom("InvalidStateError",() => popUp.hidePopup(),'Calling hidePopup on a hidden pop-up should throw InvalidStateError');
+    assert_throws_dom("InvalidStateError",() => popUp.hidePopUp(),'Calling hidePopUp on a hidden pop-up should throw InvalidStateError');
     const parent = popUp.parentElement;
     popUp.remove();
-    assert_throws_dom("InvalidStateError",() => popUp.showPopup(),'Calling showPopup on a disconnected pop-up should throw InvalidStateError');
+    assert_throws_dom("InvalidStateError",() => popUp.showPopUp(),'Calling showPopUp on a disconnected pop-up should throw InvalidStateError');
     parent.appendChild(popUp);
   }
   function assertNotAPopUp(nonPopUp) {
     // Non-popup elements should already be visible.
     assert_true(popUpVisible(nonPopUp, /*isPopUp*/false));
-    assert_throws_dom("NotSupportedError",() => nonPopUp.showPopup(),'Calling showPopup on a non-pop-up should throw NotSupportedError');
+    assert_throws_dom("NotSupportedError",() => nonPopUp.showPopUp(),'Calling showPopUp on a non-pop-up should throw NotSupportedError');
     assert_true(popUpVisible(nonPopUp, /*isPopUp*/false));
-    assert_throws_dom("NotSupportedError",() => nonPopUp.hidePopup(),'Calling hidePopup on a non-pop-up should throw NotSupportedError');
+    assert_throws_dom("NotSupportedError",() => nonPopUp.hidePopUp(),'Calling hidePopUp on a non-pop-up should throw NotSupportedError');
     assert_true(popUpVisible(nonPopUp, /*isPopUp*/false));
   }
 
   Array.from(document.getElementById('popups').children).forEach(popUp => {
     test((t) => {
       assertIsFunctionalPopUp(popUp);
-    }, `The .showPopup() and .hidePopup() work on a pop-up, for ${popUp.outerHTML}.`);
+    }, `The .showPopUp() and .hidePopUp() work on a pop-up, for ${popUp.outerHTML}.`);
   });
 
   Array.from(document.getElementById('nonpopups').children).forEach(nonPopUp => {
     test((t) => {
       assertNotAPopUp(nonPopUp);
-    }, `The .showPopup() and .hidePopup() do NOT work on elements without a 'popup' attribute, ${nonPopUp.outerHTML}.`);
+    }, `The .showPopUp() and .hidePopUp() do NOT work on elements without a 'popup' attribute, ${nonPopUp.outerHTML}.`);
   });
 
   function createPopUp(t) {
@@ -152,15 +152,15 @@
 
   test((t) => {
     const popUp = createPopUp(t);
-    popUp.showPopup();
+    popUp.showPopUp();
     assert_true(popUp.matches(':top-layer'));
     popUp.setAttribute('popup','hint'); // Change pop-up type
     assert_false(popUp.matches(':top-layer'));
-    popUp.showPopup();
+    popUp.showPopUp();
     assert_true(popUp.matches(':top-layer'));
     popUp.setAttribute('popup','async');
     assert_false(popUp.matches(':top-layer'));
-    popUp.showPopup();
+    popUp.showPopUp();
     assert_true(popUp.matches(':top-layer'));
     popUp.setAttribute('popup','invalid');
     assert_false(popUp.matches(':top-layer'));
@@ -179,7 +179,7 @@
     test((t) => {
       const popUp = createPopUp(t);
       popUp.setAttribute('popup',type);
-      popUp.showPopup();
+      popUp.showPopUp();
       assert_true(popUp.matches(':top-layer'));
       popUp.remove();
       assert_false(popUp.matches(':top-layer'));
@@ -191,10 +191,10 @@
       test((t) => {
         const popUp = createPopUp(t);
         popUp.setAttribute('popup',type);
-        popUp.showPopup();
+        popUp.showPopUp();
         assert_true(popUp.matches(':top-layer'));
         assert_false(popUp.matches(':modal'));
-        popUp.hidePopup();
+        popUp.hidePopUp();
       },`A showing popup=${type} does not match :modal`);
     }
   });
diff --git a/html/semantics/popups/popup-backdrop-appearance.tentative.html b/html/semantics/popups/popup-backdrop-appearance.tentative.html
index 0b348f85d0103c..da975d95b659d8 100644
--- a/html/semantics/popups/popup-backdrop-appearance.tentative.html
+++ b/html/semantics/popups/popup-backdrop-appearance.tentative.html
@@ -45,7 +45,7 @@
   </div>
 </div>
 <script>
-document.getElementById('bottom').showPopup();
-document.getElementById('middle').showPopup();
-document.getElementById('top').showPopup();
+document.getElementById('bottom').showPopUp();
+document.getElementById('middle').showPopUp();
+document.getElementById('top').showPopUp();
 </script>
diff --git a/html/semantics/popups/popup-defaultopen.tentative.html b/html/semantics/popups/popup-defaultopen.tentative.html
index ec1275e7ea8e65..2e29d9a4afc356 100644
--- a/html/semantics/popups/popup-defaultopen.tentative.html
+++ b/html/semantics/popups/popup-defaultopen.tentative.html
@@ -39,7 +39,7 @@
         assert_true(p1.matches(':top-layer'),'removing defaultopen should not close the popup');
         assert_false(p1.hasAttribute('defaultopen'),'...but it should reflect to IDL');
 
-        p1.hidePopup();
+        p1.hidePopUp();
       }, "The defaultopen attribute should affect page load only");
     });
   });
diff --git a/html/semantics/popups/popup-events.tentative.html b/html/semantics/popups/popup-events.tentative.html
index 5fa7c911217291..fb8d9c1e424fc8 100644
--- a/html/semantics/popups/popup-events.tentative.html
+++ b/html/semantics/popups/popup-events.tentative.html
@@ -36,14 +36,14 @@
   document.addEventListener('hide',() => ++hideCount);
   assert_equals(0,showCount);
   assert_equals(0,hideCount);
-  popup.showPopup();
+  popup.showPopUp();
   assert_true(popup.matches(':top-layer'));
   await waitUntilChange(() => showCount);
   assert_equals(1,showCount);
   assert_equals(0,hideCount);
   await requestAnimationFramePromise();
   assert_true(popup.matches(':top-layer'));
-  popup.hidePopup();
+  popup.hidePopUp();
   assert_false(popup.matches(':top-layer'));
   await waitUntilChange(() => hideCount);
   assert_equals(1,showCount);
diff --git a/html/semantics/popups/popup-focus.tentative.html b/html/semantics/popups/popup-focus.tentative.html
index f9868369a2e1cb..c9a696e82067ad 100644
--- a/html/semantics/popups/popup-focus.tentative.html
+++ b/html/semantics/popups/popup-focus.tentative.html
@@ -137,23 +137,23 @@
       // Directly show and hide the pop-up:
       priorFocus.focus();
       assert_equals(document.activeElement, priorFocus);
-      popUp.showPopup();
-      assert_equals(document.activeElement, expectedFocusedElement, `${testName} activated by popUp.showPopup()`);
-      popUp.hidePopup();
+      popUp.showPopUp();
+      assert_equals(document.activeElement, expectedFocusedElement, `${testName} activated by popUp.showPopUp()`);
+      popUp.hidePopUp();
       assert_equals(document.activeElement, priorFocus, 'prior element should get focus on hide');
 
       // Hit Escape:
       priorFocus.focus();
       assert_equals(document.activeElement, priorFocus);
-      popUp.showPopup();
-      assert_equals(document.activeElement, expectedFocusedElement, `${testName} activated by popUp.showPopup()`);
+      popUp.showPopUp();
+      assert_equals(document.activeElement, expectedFocusedElement, `${testName} activated by popUp.showPopUp()`);
       await sendEscape();
       assert_equals(document.activeElement, priorFocus, 'prior element should get focus after Escape');
 
       // Change the pop-up type:
       priorFocus.focus();
-      popUp.showPopup();
-      assert_equals(document.activeElement, expectedFocusedElement, `${testName} activated by popUp.showPopup()`);
+      popUp.showPopUp();
+      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');
@@ -162,8 +162,8 @@
 
       // Remove from the document:
       priorFocus.focus();
-      popUp.showPopup();
-      assert_equals(document.activeElement, expectedFocusedElement, `${testName} activated by popUp.showPopup()`);
+      popUp.showPopUp();
+      assert_equals(document.activeElement, expectedFocusedElement, `${testName} activated by popUp.showPopUp()`);
       popUp.remove();
       assert_false(popUp.matches(':top-layer'), 'Removing the pop-up should hide it');
       if (!popUp.hasAttribute('data-no-focus')) {
@@ -173,8 +173,8 @@
 
       // Show a modal dialog:
       priorFocus.focus();
-      popUp.showPopup();
-      assert_equals(document.activeElement, expectedFocusedElement, `${testName} activated by popUp.showPopup()`);
+      popUp.showPopUp();
+      assert_equals(document.activeElement, expectedFocusedElement, `${testName} activated by popUp.showPopUp()`);
       const dialog = document.body.appendChild(document.createElement('dialog'));
       dialog.showModal();
       assert_false(popUp.matches(':top-layer'), 'Opening a modal dialog should hide the pop-up');
@@ -206,7 +206,7 @@
       assert_false(popUp.contains(button), 'Start with a non-contained button');
       priorFocus.focus();
       assert_equals(document.activeElement, priorFocus);
-      popUp.showPopup();
+      popUp.showPopUp();
       assert_true(popUp.matches(':top-layer'));
       await clickOn(button); // This will not light dismiss, but will "toggle" the popUp.
       assert_false(popUp.matches(':top-layer'));
@@ -217,7 +217,7 @@
       button.setAttribute('hidepopup', popUp.id);
       popUp.appendChild(button);
       priorFocus.focus();
-      popUp.showPopup();
+      popUp.showPopUp();
       assert_true(popUp.matches(':top-layer'));
       if (!popUp.hasAttribute('data-no-focus')) {
         assert_not_equals(document.activeElement, priorFocus, 'focus should shift for this element');
@@ -230,7 +230,7 @@
       button = document.createElement('button');
       document.body.appendChild(button);
       priorFocus.focus();
-      popUp.showPopup();
+      popUp.showPopUp();
       assert_true(popUp.matches(':top-layer'));
       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)');
@@ -247,25 +247,25 @@
 
       // Move the prior focus out of the document
       priorFocus.focus();
-      popUp.showPopup();
+      popUp.showPopUp();
       assert_true(popUp.matches(':top-layer'));
       const newFocus = document.activeElement;
       assert_not_equals(newFocus, priorFocus, 'focus should shift for this element');
       priorFocus.remove();
       assert_equals(document.activeElement, newFocus, 'focus should not change when prior focus is removed');
-      popUp.hidePopup();
+      popUp.hidePopUp();
       assert_not_equals(document.activeElement, priorFocus, 'focused element has been removed');
       document.body.appendChild(priorFocus); // Put it back
 
       // Move the prior focus inside the (already open) pop-up
       priorFocus.focus();
-      popUp.showPopup();
+      popUp.showPopUp();
       assert_true(popUp.matches(':top-layer'));
       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');
-      popUp.hidePopup();
+      popUp.hidePopUp();
       assert_not_equals(document.activeElement, priorFocus, 'focused element is display:none inside the pop-up');
       document.body.appendChild(priorFocus); // Put it back
     }, "Popup corner cases test: " + testName);
diff --git a/html/semantics/popups/popup-inside-display-none.tentative.html b/html/semantics/popups/popup-inside-display-none.tentative.html
index c93bf163d93b79..d60b0df9068494 100644
--- a/html/semantics/popups/popup-inside-display-none.tentative.html
+++ b/html/semantics/popups/popup-inside-display-none.tentative.html
@@ -12,7 +12,7 @@
 
 <script>
   const popup = document.querySelector('[popup]');
-  popup.showPopup();
+  popup.showPopUp();
   if (!popup.matches(':top-layer'))
     document.body.appendChild(document.createTextNode('FAIL'));
 </script>
diff --git a/html/semantics/popups/popup-invoking-attribute.tentative.html b/html/semantics/popups/popup-invoking-attribute.tentative.html
index eba8f553f60925..ba461f807ea15e 100644
--- a/html/semantics/popups/popup-invoking-attribute.tentative.html
+++ b/html/semantics/popups/popup-invoking-attribute.tentative.html
@@ -148,7 +148,7 @@
               case "toggle":
               case "show":
                 assert_popUp(expectedId,true,'Toggle or show should show the pop-up');
-                (expectedId===1 ? popUp1 : popUp2).hidePopup(); // Hide the pop-up
+                (expectedId===1 ? popUp1 : popUp2).hidePopUp(); // Hide the pop-up
                 break;
               case "hide":
               case "none":
@@ -157,7 +157,7 @@
               default:
                 assert_unreached();
             }
-            (expectedId===1 ? popUp1 : popUp2).showPopup(); // Show the pop-up directly
+            (expectedId===1 ? popUp1 : popUp2).showPopUp(); // Show the pop-up directly
             assert_popUp(expectedId,true);
             assert_popUp(otherId,false);
             await testcase.invokeFn(invoker);
@@ -215,11 +215,11 @@
   await assertState(false,0,0);
   await clickOn(button);
   await assertState(true,1,0);
-  popUp.hidePopup();
+  popUp.hidePopUp();
   await assertState(false,1,1);
   button.click();
   await assertState(true,2,1);
-  popUp.hidePopup();
+  popUp.hidePopUp();
   await assertState(false,2,2);
 }, "Clicking a togglepopup button opens a closed pop-up (also check event counts)");
 
diff --git a/html/semantics/popups/popup-light-dismiss-on-scroll.tentative.html b/html/semantics/popups/popup-light-dismiss-on-scroll.tentative.html
index 12615b7e2e1a21..3c32a6dc6a992a 100644
--- a/html/semantics/popups/popup-light-dismiss-on-scroll.tentative.html
+++ b/html/semantics/popups/popup-light-dismiss-on-scroll.tentative.html
@@ -22,7 +22,7 @@
     This is popup 2
   </div>
 </div>
-<button onclick='popup1.showPopup();popup2.showPopup();'>Open popups</button>
+<button onclick='popup1.showPopUp();popup2.showPopUp();'>Open popups</button>
 
 <style>
   #popup1 { top:50px; left: 50px; }
@@ -49,8 +49,8 @@
       });
     }
     assertAll(/*showing*/false);
-    popups[0].showPopup();
-    popups[1].showPopup();
+    popups[0].showPopUp();
+    popups[1].showPopUp();
     assertAll(/*showing*/true);
     scroller.scrollTo(0, 100);
     requestAnimationFrame(() => {
diff --git a/html/semantics/popups/popup-light-dismiss.tentative.html b/html/semantics/popups/popup-light-dismiss.tentative.html
index 10317a8f35d655..a443be606dfabd 100644
--- a/html/semantics/popups/popup-light-dismiss.tentative.html
+++ b/html/semantics/popups/popup-light-dismiss.tentative.html
@@ -56,7 +56,7 @@
   });
   promise_test(async () => {
     assert_false(popup1.matches(':top-layer'));
-    popup1.showPopup();
+    popup1.showPopUp();
     assert_true(popup1.matches(':top-layer'));
     let p1HideCount = popup1HideCount;
     await clickOn(outside);
@@ -66,18 +66,18 @@
 
   promise_test(async () => {
     assert_false(popup1.matches(':top-layer'));
-    popup1.showPopup();
+    popup1.showPopUp();
     await waitForRender();
     p1HideCount = popup1HideCount;
     await clickOn(inside1);
     assert_true(popup1.matches(':top-layer'));
     assert_equals(popup1HideCount,p1HideCount);
-    popup1.hidePopup();
+    popup1.hidePopUp();
   },'Clicking inside a popup does not close that popup');
 
   promise_test(async () => {
     assert_false(popup1.matches(':top-layer'));
-    popup1.showPopup();
+    popup1.showPopUp();
     await clickOn(inside1After);
     assert_true(popup1.matches(':top-layer'));
     await sendTab();
@@ -86,8 +86,8 @@
   },'Moving focus outside the popup will dismiss the popup');
 
   promise_test(async () => {
-    popup1.showPopup();
-    popup2.showPopup();
+    popup1.showPopUp();
+    popup2.showPopUp();
     await waitForRender();
     p1HideCount = popup1HideCount;
     let p2HideCount = popup2HideCount;
@@ -96,14 +96,14 @@
     assert_true(popup2.matches(':top-layer'),'popup2 should be open');
     assert_equals(popup1HideCount,p1HideCount,'popup1');
     assert_equals(popup2HideCount,p2HideCount,'popup2');
-    popup1.hidePopup();
+    popup1.hidePopUp();
     assert_false(popup1.matches(':top-layer'));
     assert_false(popup2.matches(':top-layer'));
   },'Clicking inside a child popup shouldn\'t close either popup');
 
   promise_test(async () => {
-    popup1.showPopup();
-    popup2.showPopup();
+    popup1.showPopUp();
+    popup2.showPopUp();
     await waitForRender();
     p1HideCount = popup1HideCount;
     p2HideCount = popup2HideCount;
@@ -112,7 +112,7 @@
     assert_equals(popup1HideCount,p1HideCount);
     assert_false(popup2.matches(':top-layer'));
     assert_equals(popup2HideCount,p2HideCount+1);
-    popup1.hidePopup();
+    popup1.hidePopUp();
   },'Clicking inside a parent popup should close child popup');
 
   promise_test(async () => {
@@ -123,24 +123,24 @@
     await clickOn(button1show);
     assert_true(popup1.matches(':top-layer'),'popup1 should stay open');
     assert_equals(popup1HideCount,p1HideCount,'popup1 should not get hidden and reshown');
-    popup1.hidePopup(); // Cleanup
+    popup1.hidePopUp(); // Cleanup
     assert_false(popup1.matches(':top-layer'));
   },'Clicking on invoking element, after using it for activation, shouldn\'t close its popup');
 
   promise_test(async () => {
-    popup1.showPopup(); // Directly show the popup
+    popup1.showPopUp(); // Directly show the popup
     assert_true(popup1.matches(':top-layer'));
     await waitForRender();
     p1HideCount = popup1HideCount;
     await clickOn(button1show);
     assert_true(popup1.matches(':top-layer'),'popup1 should stay open');
     assert_equals(popup1HideCount,p1HideCount,'popup1 should not get hidden and reshown');
-    popup1.hidePopup(); // Cleanup
+    popup1.hidePopUp(); // Cleanup
     assert_false(popup1.matches(':top-layer'));
   },'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
+    popup1.showPopUp(); // Directly show the popup
     assert_true(popup1.matches(':top-layer'));
     await waitForRender();
     p1HideCount = popup1HideCount;
@@ -150,20 +150,20 @@
   },'Clicking on togglepopup element, even if it wasn\'t used for activation, should hide it exactly once');
 
   promise_test(async () => {
-    popup1.showPopup();
+    popup1.showPopUp();
     assert_true(popup1.matches(':top-layer'));
     await waitForRender();
     p1HideCount = popup1HideCount;
     await clickOn(popup1anchor);
     assert_true(popup1.matches(':top-layer'),'popup1 not open');
     assert_equals(popup1HideCount,p1HideCount);
-    popup1.hidePopup(); // Cleanup
+    popup1.hidePopUp(); // Cleanup
     assert_false(popup1.matches(':top-layer'));
   },'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.
+    popup1.showPopUp();
+    popup2.showPopUp(); // Popup1 is an ancestral element for popup2.
     assert_true(popup1.matches(':top-layer'));
     assert_true(popup2.matches(':top-layer'));
     const drag_actions = new test_driver.Actions();
@@ -175,7 +175,7 @@
       .send();
     assert_true(popup1.matches(':top-layer'),'popup1 should be open');
     assert_true(popup2.matches(':top-layer'),'popup1 should be open');
-    popup1.hidePopup();
+    popup1.hidePopUp();
     assert_false(popup2.matches(':top-layer'));
   },'Dragging from an open popup outside an open popup should leave the popup open');
 </script>
@@ -200,10 +200,10 @@
   promise_test(async () => {
     await clickOn(button3);
     assert_true(popup3.matches(':top-layer'),'invoking element should open popup');
-    popup4.showPopup();
+    popup4.showPopUp();
     assert_true(popup4.matches(':top-layer'));
     assert_true(popup3.matches(':top-layer'));
-    popup3.hidePopup(); // Cleanup
+    popup3.hidePopUp(); // Cleanup
     assert_false(popup3.matches(':top-layer'));
     assert_false(popup4.matches(':top-layer'));
   },'An invoking element should be part of the ancestor chain');
@@ -213,11 +213,11 @@
     assert_true(popup3.matches(':top-layer'));
     assert_false(popup4.matches(':top-layer'));
     assert_false(popup5.matches(':top-layer'));
-    popup5.showPopup();
+    popup5.showPopUp();
     assert_true(popup3.matches(':top-layer'));
     assert_false(popup4.matches(':top-layer'));
     assert_true(popup5.matches(':top-layer'));
-    popup3.hidePopup();
+    popup3.hidePopUp();
     assert_false(popup3.matches(':top-layer'));
     assert_false(popup4.matches(':top-layer'));
     assert_false(popup5.matches(':top-layer'));
@@ -239,20 +239,20 @@
 <script>
   const popup6 = document.querySelector('#p6');
   promise_test(async () => {
-    popup6.showPopup();
+    popup6.showPopUp();
     assert_equals(popup6.scrollTop,0,'popup6 should start non-scrolled');
     await new test_driver.Actions()
        .scroll(0, 0, 0, 50, {origin: popup6})
        .send();
     assert_true(popup6.matches(':top-layer'),'popup6 should stay open');
     assert_equals(popup6.scrollTop,50,'popup6 should be scrolled');
-    popup6.hidePopup();
+    popup6.hidePopUp();
   },'Scrolling within a popup should not close the popup');
 </script>
 
 <my-element id="myElement">
   <template shadowroot="open">
-    <button id=b7 onclick='showPopup7()'>Popup7</button>
+    <button id=b7 onclick='showPopUp7()'>Popup7</button>
     <div popup id=p7 anchor=b7 style="top: 100px;">
       <p>Popup content.</p>
       <input id="inside7" type="text" placeholder="some text">
@@ -263,15 +263,15 @@
   const button7 = document.querySelector('#myElement').shadowRoot.querySelector('#b7');
   const popup7 = document.querySelector('#myElement').shadowRoot.querySelector('#p7');
   const inside7 = document.querySelector('#myElement').shadowRoot.querySelector('#inside7');
-  function showPopup7() {
-    popup7.showPopup();
+  function showPopUp7() {
+    popup7.showPopUp();
   }
   promise_test(async () => {
     button7.click();
     assert_true(popup7.matches(':top-layer'),'invoking element should open popup');
     inside7.click();
     assert_true(popup7.matches(':top-layer'));
-    popup7.hidePopup();
+    popup7.hidePopUp();
   },'Clicking inside a shadow DOM popup does not close that popup');
 
   promise_test(async () => {
@@ -294,13 +294,13 @@
     const inside8After = document.querySelector('#inside8after');
     const popup8Anchor = document.querySelector('#p8anchor');
     assert_false(popup8.matches(':top-layer'));
-    popup8.showPopup();
+    popup8.showPopUp();
     await clickOn(inside8After);
     assert_true(popup8.matches(':top-layer'));
     await sendTab();
     assert_equals(document.activeElement,popup8Anchor,'Focus should move to the anchor element');
     assert_true(popup8.matches(':top-layer'),'popup should stay open');
-    popup8.hidePopup();
+    popup8.hidePopUp();
   },'Moving focus back to the anchor element should not dismiss the popup');
 </script>
 
@@ -321,7 +321,7 @@
     await sendTab();
     assert_equals(document.activeElement,popup9Invoker,'Focus should move to the invoking element');
     assert_true(popup9.matches(':top-layer'),'popup should stay open');
-    popup9.hidePopup();
+    popup9.hidePopUp();
   },'Moving focus back to the active trigger element should not dismiss the popup');
 
   promise_test(async () => {
@@ -329,7 +329,7 @@
     const inside9After = document.querySelector('#inside9after');
     const popup9Invoker = document.querySelector('#b9after');
     assert_false(popup9.matches(':top-layer'));
-    popup9.showPopup(); // Trigger directly
+    popup9.showPopUp(); // Trigger directly
     await clickOn(inside9After);
     assert_true(popup9.matches(':top-layer'));
     await sendTab();
@@ -352,7 +352,7 @@
 <div popup id=convoluted_p3 anchor=convoluted_anchor>Popup 3
   <button togglepopup=convoluted_p4>Open Popup 4</button>
 </div>
-<button onclick="convoluted_p1.showPopup()">Open convoluted popup</button>
+<button onclick="convoluted_p1.showPopUp()">Open convoluted popup</button>
 <style>
   #convoluted_p1 {top:50px;}
   #convoluted_p2 {top:150px;}
@@ -365,7 +365,7 @@
 const convPopup3 = document.querySelector('#convoluted_p3');
 const convPopup4 = document.querySelector('#convoluted_p4');
 promise_test(async () => {
-  convPopup1.showPopup(); // Programmatically open p1
+  convPopup1.showPopUp(); // Programmatically open p1
   assert_true(convPopup1.matches(':top-layer'));
   convPopup1.querySelector('button').click(); // Click to invoke p2
   assert_true(convPopup1.matches(':top-layer'));
@@ -384,7 +384,7 @@
   assert_true(convPopup2.matches(':top-layer'));
   assert_true(convPopup3.matches(':top-layer'));
   assert_true(convPopup4.matches(':top-layer'));
-  convPopup1.hidePopup();
+  convPopup1.hidePopUp();
   assert_false(convPopup1.matches(':top-layer'));
   assert_false(convPopup2.matches(':top-layer'));
   assert_false(convPopup3.matches(':top-layer'));
@@ -392,13 +392,13 @@
 },'Ensure circular/convoluted ancestral relationships are functional');
 
 promise_test(async () => {
-  convPopup1.showPopup(); // Programmatically open p1
+  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'));
-  convPopup4.showPopup(); // Programmatically open p4
+  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'));
@@ -406,12 +406,12 @@
   assert_true(convPopup1.matches(':top-layer'),'nothing changes');
   assert_false(convPopup2.matches(':top-layer'));
   assert_true(convPopup4.matches(':top-layer'));
-  convPopup1.hidePopup();
+  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'));
-},'Ensure circular/convoluted ancestral relationships are functional, with a direct showPopup()');
+},'Ensure circular/convoluted ancestral relationships are functional, with a direct showPopUp()');
 </script>
 
 
@@ -429,9 +429,9 @@
   const hint = document.querySelector('#p11');
   const async = document.querySelector('#p12');
   // All three can be open at once, if shown in this order:
-  popup.showPopup();
-  hint.showPopup();
-  async.showPopup();
+  popup.showPopUp();
+  hint.showPopUp();
+  async.showPopUp();
   assert_true(popup.matches(':top-layer'));
   assert_true(hint.matches(':top-layer'));
   assert_true(async.matches(':top-layer'));
@@ -445,17 +445,17 @@
   assert_false(popup.matches(':top-layer'),'popup should close');
   assert_false(hint.matches(':top-layer'),'hint should close');
   assert_true(async.matches(':top-layer'),'async does not light dismiss');
-  async.hidePopup();
+  async.hidePopUp();
   assert_false(async.matches(':top-layer'));
-  popup.showPopup();
-  hint.showPopup();
+  popup.showPopUp();
+  hint.showPopUp();
   assert_true(popup.matches(':top-layer'));
   assert_true(hint.matches(':top-layer'));
   // Clicking on the popup should close the hint:
   await clickOn(popup);
   assert_true(popup.matches(':top-layer'),'popup should stay open');
   assert_false(hint.matches(':top-layer'),'hint should light dismiss');
-  popup.hidePopup();
+  popup.hidePopUp();
   assert_false(popup.matches(':top-layer'));
 },'Light dismiss of mixed popup types');
 </script>
diff --git a/html/semantics/popups/popup-not-keyboard-focusable.tentative.html b/html/semantics/popups/popup-not-keyboard-focusable.tentative.html
index 88736ab472b0d2..3cc545f9ae7e3c 100644
--- a/html/semantics/popups/popup-not-keyboard-focusable.tentative.html
+++ b/html/semantics/popups/popup-not-keyboard-focusable.tentative.html
@@ -22,7 +22,7 @@
   const popup = document.querySelector('[popup]');
   b1.focus();
   assert_equals(document.activeElement,b1);
-  popup.showPopup();
+  popup.showPopUp();
   assert_true(popup.matches(':top-layer'));
   assert_equals(document.activeElement,b1);
   // Tab once
@@ -34,13 +34,13 @@
   const button = document.createElement('button');
   popup.appendChild(button);
   b1.focus();
-  popup.showPopup();
+  popup.showPopUp();
   assert_equals(document.activeElement,b1);
   // 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');
-  popup.hidePopup();
+  popup.hidePopUp();
   assert_false(popup.matches(':top-layer'));
 }, "Popup should not be keyboard focusable");
 </script>
diff --git a/html/semantics/popups/popup-open-display.tentative.html b/html/semantics/popups/popup-open-display.tentative.html
index 674af1902d943d..9a0b87e6b74e68 100644
--- a/html/semantics/popups/popup-open-display.tentative.html
+++ b/html/semantics/popups/popup-open-display.tentative.html
@@ -31,5 +31,5 @@
 </style>
 
 <script>
-  document.querySelector('[popup]').showPopup();
+  document.querySelector('[popup]').showPopUp();
 </script>
diff --git a/html/semantics/popups/popup-open-overflow-display-ref.tentative.html b/html/semantics/popups/popup-open-overflow-display-ref.tentative.html
index 7a350ea281dc68..c9f582ce8ffb25 100644
--- a/html/semantics/popups/popup-open-overflow-display-ref.tentative.html
+++ b/html/semantics/popups/popup-open-overflow-display-ref.tentative.html
@@ -24,7 +24,7 @@
 </style>
 
 <script>
-  document.querySelector('#p1').showPopup();
-  document.querySelector('#p2').showPopup();
-  document.querySelector('#p3').showPopup();
+  document.querySelector('#p1').showPopUp();
+  document.querySelector('#p2').showPopUp();
+  document.querySelector('#p3').showPopUp();
 </script>
diff --git a/html/semantics/popups/popup-open-overflow-display.tentative.html b/html/semantics/popups/popup-open-overflow-display.tentative.html
index 32f42dfcea2f04..fd86672566d1ce 100644
--- a/html/semantics/popups/popup-open-overflow-display.tentative.html
+++ b/html/semantics/popups/popup-open-overflow-display.tentative.html
@@ -38,7 +38,7 @@
 </style>
 
 <script>
-  document.querySelector('#p1').showPopup();
-  document.querySelector('#p2').showPopup();
-  document.querySelector('#p3').showPopup();
+  document.querySelector('#p1').showPopUp();
+  document.querySelector('#p2').showPopUp();
+  document.querySelector('#p3').showPopUp();
 </script>
diff --git a/html/semantics/popups/popup-removal-2.tentative.html b/html/semantics/popups/popup-removal-2.tentative.html
index 71d420e57988e5..7cf0951e5b14bc 100644
--- a/html/semantics/popups/popup-removal-2.tentative.html
+++ b/html/semantics/popups/popup-removal-2.tentative.html
@@ -17,11 +17,11 @@
       const popup = frame1Doc.querySelector('[popup]');
       assert_true(!!popup);
       assert_false(popup.matches(':top-layer'));
-      popup.showPopup();
+      popup.showPopUp();
       assert_true(popup.matches(':top-layer'));
       frame2Doc.body.appendChild(popup);
       assert_false(popup.matches(':top-layer'));
-      popup.showPopup();
+      popup.showPopUp();
       assert_true(popup.matches(':top-layer'));
     }, 'Moving popup between documents shouldn\'t cause issues');
   };
diff --git a/html/semantics/popups/popup-removal.tentative.html b/html/semantics/popups/popup-removal.tentative.html
index b5f8100d04f619..f4df8623276808 100644
--- a/html/semantics/popups/popup-removal.tentative.html
+++ b/html/semantics/popups/popup-removal.tentative.html
@@ -17,7 +17,7 @@
   }
   const popup = document.querySelector('[popup]');
   assert_false(popup.matches(':top-layer'));
-  popup.showPopup();
+  popup.showPopUp();
   assert_true(popup.matches(':top-layer'));
   popup.remove(); // Shouldn't cause any issues
   document.body.click(); // Shouldn't cause light dismiss problems
diff --git a/html/semantics/popups/popup-shadow-dom.tentative.html b/html/semantics/popups/popup-shadow-dom.tentative.html
index b30a92cd090913..95fd3db07d51ba 100644
--- a/html/semantics/popups/popup-shadow-dom.tentative.html
+++ b/html/semantics/popups/popup-shadow-dom.tentative.html
@@ -36,13 +36,13 @@
     ensureShadowDom(testRoot);
     return findPopups(testRoot);
   }
-  function showPopup(testId,popupNum) {
-    getPopupReferences(testId)[popupNum].showPopup();
+  function showPopUp(testId,popupNum) {
+    getPopupReferences(testId)[popupNum].showPopUp();
   }
 </script>
 
 <div id=test1>
-  <button onclick='showPopup("test1",0)'>Test1 Popup</button>
+  <button onclick='showPopUp("test1",0)'>Test1 Popup</button>
   <my-element>
     <template shadowroot=open>
       <div popup>
@@ -55,7 +55,7 @@
 <script>
   test(function() {
     const popup = getPopupReferences('test1')[0];
-    popup.showPopup();
+    popup.showPopUp();
     assert_true(popup.matches(':top-layer'));
     assert_true(isElementVisible(popup));
   }, "Popups located inside shadow DOM can still be shown");
@@ -63,10 +63,10 @@
 
 
 <div id=test2>
-  <button id=t2b1 onclick='showPopup("test2",0)'>Test 2 Popup 1</button>
+  <button id=t2b1 onclick='showPopUp("test2",0)'>Test 2 Popup 1</button>
   <div popup anchor=t2b1 style="top: 400px;">
     <p>Popup 1</p>
-    <button id=t2b2 onclick='showPopup("test2",1)'>Test 2 Popup 2</button>
+    <button id=t2b2 onclick='showPopUp("test2",1)'>Test 2 Popup 2</button>
   </div>
   <my-element>
     <template shadowroot=open>
@@ -81,10 +81,10 @@
 <script>
   test(function() {
     const [popup1,popup2] = getPopupReferences('test2');
-    popup1.showPopup();
+    popup1.showPopUp();
     assert_true(popup1.matches(':top-layer'));
     assert_true(isElementVisible(popup1));
-    popup2.showPopup();
+    popup2.showPopUp();
     assert_false(popup1.matches(':top-layer'), 'popup1 open'); // P1 was closed by P2
     assert_false(isElementVisible(popup1), 'popup1 visible');
     assert_true(popup2.matches(':top-layer'), 'popup2 open'); // P2 is open
@@ -96,13 +96,13 @@
 <div id=test3>
   <my-element>
     <template shadowroot=open>
-      <button id=t3b1 onclick='showPopup("test3",0)'>Test 3 Popup 1</button>
+      <button id=t3b1 onclick='showPopUp("test3",0)'>Test 3 Popup 1</button>
       <div popup anchor=t3b1>
         <p>This popup will stay open when popup2 shows.</p>
         <slot></slot>
       </div>
     </template>
-    <button id=t3b2 onclick='showPopup("test3",1)'>Test 3 Popup 2</button>
+    <button id=t3b2 onclick='showPopUp("test3",1)'>Test 3 Popup 2</button>
   </my-element>
   <div popup anchor=t3b2>Popup 2</div>
 </div>
@@ -110,17 +110,17 @@
 <script>
   test(function() {
     const [popup1,popup2] = getPopupReferences('test3');
-    popup1.showPopup();
+    popup1.showPopUp();
     assert_true(popup1.matches(':top-layer'));
     assert_true(isElementVisible(popup1));
     // Showing popup2 should not close popup1, since it is a flat
     // tree ancestor of popup2's anchor button.
-    popup2.showPopup();
+    popup2.showPopUp();
     assert_true(popup2.matches(':top-layer'));
     assert_true(isElementVisible(popup2));
     assert_true(popup1.matches(':top-layer'));
     assert_true(isElementVisible(popup1));
-    popup1.hidePopup();
+    popup1.hidePopUp();
     assert_false(popup2.matches(':top-layer'));
     assert_false(popup1.matches(':top-layer'));
   }, "anchor references use the flat tree not the DOM tree");
@@ -128,12 +128,12 @@
 
 
 <div id=test4>
-  <button id=t4b1 onclick='showPopup("test4",0)'>Test 4 Popup 1</button>
+  <button id=t4b1 onclick='showPopUp("test4",0)'>Test 4 Popup 1</button>
   <div popup anchor=t4b1>
     <p>This should not get hidden when popup2 opens.</p>
     <my-element>
       <template shadowroot=open>
-        <button id=t4b2 onclick='showPopup("test4",1)'>Test 4 Popup 2</button>
+        <button id=t4b2 onclick='showPopUp("test4",1)'>Test 4 Popup 2</button>
         <div popup anchor=t4b2>
           <p>This should not hide popup1.</p>
         </div>
@@ -145,15 +145,15 @@
 <script>
   test(function() {
     const [popup1,popup2] = getPopupReferences('test4');
-    popup1.showPopup();
-    popup2.showPopup();
+    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(isElementVisible(popup1));
     assert_true(popup2.matches(':top-layer'), 'popup2 not open');
     assert_true(isElementVisible(popup2));
     // This should hide both of them.
-    popup1.hidePopup();
+    popup1.hidePopUp();
     assert_false(popup2.matches(':top-layer'));
     assert_false(isElementVisible(popup2));
   }, "The popup stack is preserved across shadow-inclusive ancestors");
diff --git a/html/semantics/popups/popup-stacking-context.tentative.html b/html/semantics/popups/popup-stacking-context.tentative.html
index f3fd0bf2fa992c..def3f477df0e9b 100644
--- a/html/semantics/popups/popup-stacking-context.tentative.html
+++ b/html/semantics/popups/popup-stacking-context.tentative.html
@@ -33,5 +33,5 @@
 </style>
 
 <script>
-  document.querySelector('[popup]').showPopup();
+  document.querySelector('[popup]').showPopUp();
 </script>
diff --git a/html/semantics/popups/popup-stacking.tentative.html b/html/semantics/popups/popup-stacking.tentative.html
index 6af6a9cb7e6e1c..e9e987ea2ff2fc 100644
--- a/html/semantics/popups/popup-stacking.tentative.html
+++ b/html/semantics/popups/popup-stacking.tentative.html
@@ -67,18 +67,18 @@
 <!-- Other examples -->
 
 <div popup id=p1 anchor=b1><p>This is popup #1</p>
-  <button id=b2 onclick='p2.showPopup()'>Popup 2</button>
-  <button id=b4 onclick='p4.showPopup()'>Popup 4</button>
+  <button id=b2 onclick='p2.showPopUp()'>Popup 2</button>
+  <button id=b4 onclick='p4.showPopUp()'>Popup 4</button>
 </div>
 <div popup id=p2 anchor=b2><p>This is popup #2</p>
-  <button id=b3 onclick='p3.showPopup()'>Popup 3</button>
+  <button id=b3 onclick='p3.showPopUp()'>Popup 3</button>
 </div>
 <div popup id=p3 anchor=b3><p>This is popup #3</p></div>
 <div popup id=p4 anchor=b4><p>This is popup #4</p></div>
-<button id=b1 onclick='p1.showPopup()'>Popup 1</button>
+<button id=b1 onclick='p1.showPopUp()'>Popup 1</button>
 
 <dialog id=d1>This is a dialog<button onclick='this.parentElement.close()'>Close</button></dialog>
-<button id=b5 onclick='d1.showPopup()'>Dialog</button>
+<button id=b5 onclick='d1.showPopUp()'>Dialog</button>
 
 <script>
   // Test basic ancestor relationships
@@ -91,14 +91,14 @@
       assert_true(!!descr && !!ancestor && !!child);
       assert_false(ancestor.matches(':top-layer'));
       assert_false(child.matches(':top-layer'));
-      ancestor.showPopup();
+      ancestor.showPopUp();
       if (clickToActivate)
         clickToActivate.click();
       else
-        child.showPopup();
+        child.showPopUp();
       assert_true(child.matches(':top-layer'));
       assert_true(ancestor.matches(':top-layer'));
-      ancestor.hidePopup();
+      ancestor.hidePopUp();
       assert_false(ancestor.matches(':top-layer'));
       assert_false(child.matches(':top-layer'));
     },descr);
@@ -114,33 +114,33 @@
   }
   test(function() {
     assertState(false,false,false,false);
-    p1.showPopup();
+    p1.showPopUp();
     assertState(true,false,false,false);
-    p2.showPopup();
+    p2.showPopUp();
     assertState(true,true,false,false);
-    p3.showPopup();
+    p3.showPopUp();
     assertState(true,true,true,false);
     // P4 is a sibling of P2, so showing it should
     // close P2 and P3.
-    p4.showPopup();
+    p4.showPopUp();
     assertState(true,false,false,true);
     // P2 should close P4 now.
-    p2.showPopup();
+    p2.showPopUp();
     assertState(true,true,false,false);
     // Hiding P1 should hide all.
-    p1.hidePopup();
+    p1.hidePopUp();
     assertState(false,false,false,false);
   }, "more complex nesting, all using anchor ancestry")
 
   test(function() {
     function openManyPopups() {
-      p1.showPopup();
-      p2.showPopup();
-      p3.showPopup();
+      p1.showPopUp();
+      p2.showPopUp();
+      p3.showPopUp();
       assertState(true,true,true,false);
     }
     openManyPopups();
-    d1.show(); // Dialog.showPopup() should hide all popups.
+    d1.show(); // Dialog.show() should hide all popups.
     assertState(false,false,false,false);
     d1.close();
     openManyPopups();
@@ -154,10 +154,10 @@
     assert_false(d1.open);
     d1.show();
     assert_true(d1.open);
-    p1.showPopup();
+    p1.showPopUp();
     assertState(true,false,false,false);
     assert_true(d1.open);
-    p1.hidePopup();
+    p1.hidePopUp();
     assert_true(d1.open);
     d1.close();
     assert_false(d1.open);
diff --git a/html/semantics/popups/popup-top-layer-interactions.tentative.html b/html/semantics/popups/popup-top-layer-interactions.tentative.html
index 9a39d9f2d9fdf5..e12645afc27893 100644
--- a/html/semantics/popups/popup-top-layer-interactions.tentative.html
+++ b/html/semantics/popups/popup-top-layer-interactions.tentative.html
@@ -20,8 +20,8 @@
     type: types.popUp,
     closes: [types.popUp],
     createElement: () => Object.assign(document.createElement('div'), {popUp: 'auto'}),
-    trigger: function() {this.element.showPopup()},
-    close: function() {this.element.hidePopup()},
+    trigger: function() {this.element.showPopUp()},
+    close: function() {this.element.hidePopUp()},
     isTopLayer: function() {return this.element.matches(':top-layer')},
   },
   {
diff --git a/html/semantics/popups/popup-types.tentative.html b/html/semantics/popups/popup-types.tentative.html
index baa022d6e900a5..7334e3944b04cf 100644
--- a/html/semantics/popups/popup-types.tentative.html
+++ b/html/semantics/popups/popup-types.tentative.html
@@ -19,41 +19,41 @@
 }
 test(() => {
   assert_state_1(false,false,false,false);
-  popup.showPopup();
+  popup.showPopUp();
   assert_state_1(true,false,false,false);
-  hint.showPopup();
+  hint.showPopUp();
   assert_state_1(true,true,false,false);
-  async.showPopup();
+  async.showPopUp();
   assert_state_1(true,true,true,false);
-  async2.showPopup();
+  async2.showPopUp();
   assert_state_1(true,true,true,true);
-  hint.hidePopup();
+  hint.hidePopUp();
   assert_state_1(true,false,true,true);
-  popup.hidePopup();
+  popup.hidePopUp();
   assert_state_1(false,false,true,true);
-  popup.showPopup();
-  hint.showPopup();
+  popup.showPopUp();
+  hint.showPopUp();
   assert_state_1(true,true,true,true);
-  popup.hidePopup();
+  popup.hidePopUp();
   assert_state_1(false,false,true,true);
-  async.hidePopup();
+  async.hidePopUp();
   assert_state_1(false,false,false,true);
-  async2.hidePopup();
+  async2.hidePopUp();
   assert_state_1(false,false,false,false);
 },'hints and asyncs do not close popups');
 
 test(() => {
   assert_state_1(false,false,false,false);
-  hint.showPopup();
-  async.showPopup();
-  async2.showPopup();
+  hint.showPopUp();
+  async.showPopUp();
+  async2.showPopUp();
   assert_state_1(false,true,true,true);
-  popup.showPopup();
+  popup.showPopUp();
   assert_state_1(true,false,true,true);
-  popup.hidePopup();
+  popup.hidePopUp();
   assert_state_1(false,false,true,true);
-  async.hidePopup();
-  async2.hidePopup();
+  async.hidePopUp();
+  async2.hidePopUp();
   assert_state_1(false,false,false,false);
 },'popups close hints but not asyncs');
 </script>
@@ -74,15 +74,15 @@
 }
 test(() => {
   assert_state_2(false,false,false,false);
-  popup1.showPopup();
-  popup2.showPopup();
-  popup3.showPopup();
+  popup1.showPopUp();
+  popup2.showPopUp();
+  popup3.showPopUp();
   assert_state_2(true,true,true,false);
-  hint2.showPopup();
+  hint2.showPopUp();
   assert_state_2(true,true,true,true);
-  popup3.hidePopup(); // Should close the hint
+  popup3.hidePopUp(); // Should close the hint
   assert_state_2(true,true,false,false);
-  popup1.hidePopup();
+  popup1.hidePopUp();
   assert_state_2(false,false,false,false);
 },'hint, even with popup ancestor, closes with first popup');
 </script>