Fix test of docs not being fully active

payment-request/rejects_if_not_active.https.html

@@ -22,68 +22,120 @@
   supportedMethods: "basic-card",
 });
 const validMethods = Object.freeze([validMethod, applePay]);
-const validAmount = Object.freeze({
-  currency: "USD",
-  value: "5.00",
-});
-const validTotal = Object.freeze({
-  label: "Total due",
-  amount: validAmount,
-});
+
 const validDetails = Object.freeze({
-  total: validTotal,
+  total: {
+    label: "Total due",
+    amount: {
+      currency: "USD",
+      value: "5.00",
+    },
+  },
 });
 
 async function getLoadedPaymentRequest(iframe, url) {
   await new Promise((resolve) => {
     iframe.addEventListener("load", resolve, { once: true });
     iframe.src = url;
   });
-  const { PaymentRequest } = iframe.contentWindow;
-  const request = new PaymentRequest(validMethods, validDetails);
-  return request;
+  return new iframe.contentWindow.PaymentRequest(validMethods, validDetails);
 }
 
 promise_test(async (t) => {
   const iframe = document.createElement("iframe");
+  iframe.allow = "payment";
   document.body.appendChild(iframe);
-  // Make a request in the iframe.
-  const request = await getLoadedPaymentRequest(
+  // We first got to page1.html, grab a PaymentRequest instance.
+  const request1 = await getLoadedPaymentRequest(
     iframe,
-    "resources/page1.html"
+    "./resources/page1.html"
   );
-  await test_driver.bless("show payment request");
-  const showPromise = request.show();
-  const firstCtor = iframe.contentWindow.DOMException;
+  // Save the DOMException of page1.html before navigating away.
+  const frameDOMException1 = iframe.contentWindow.DOMException;
+
+  // Get transient activation
+  await test_driver.bless("payment 1", () => {}, iframe.contentWindow);
 
-  // Navigate the iframe to a new location. Wait for the load event to fire.
+  // We navigate the iframe again, putting request1's document into an non-fully active state.
   const request2 = await getLoadedPaymentRequest(
     iframe,
-    "resources/page2.html"
+    "./resources/page2.html"
   );
 
+  // Now, request1's relevant global object's document is no longer active.
+  // So, call .show(), and make sure it rejects appropriately.
   await promise_rejects_dom(
     t,
     "AbortError",
-    firstCtor,
-    showPromise,
-    "Show promise should abort."
+    frameDOMException1,
+    request1.show(),
+    "Inactive document, so must throw AbortError"
   );
-
-  // The navigation dismisses the previous payment request so it
-  // now possible to show another one.
-  await test_driver.bless("show 2nd payment request");
-  const showPromise2 = request2.show();
-  const secondCtor = iframe.contentWindow.DOMException;
-  // no longer fully active
+  // request2 has an active document tho, so confirm it's working as expected:
+  // Get transient activation
+  await test_driver.bless("payment 2", () => {}, iframe.contentWindow);
+  request2.show();
+  await request2.abort();
+  await promise_rejects_dom(
+    t,
+    "InvalidStateError",
+    iframe.contentWindow.DOMException,
+    request2.show(),
+    "Abort already called, so InvalidStateError"
+  );
+  // We are done, so clean up.
   iframe.remove();
+}, "PaymentRequest.show() aborts if the document is not active.");
+
+promise_test(async (t) => {
+  // We nest two iframes and wait for them to load.
+  const outerIframe = document.createElement("iframe");
+  outerIframe.allow = "payment";
+  document.body.appendChild(outerIframe);
+  // Load the outer iframe (we don't care about the awaited request)
+  await getLoadedPaymentRequest(
+    outerIframe,
+    "./resources/page1.html"
+  );
+
+  // Now we create the inner iframe
+  const innerIframe = outerIframe.contentDocument.createElement("iframe");
+  innerIframe.allow = "payment";
+
+  // nest them
+  outerIframe.contentDocument.body.appendChild(innerIframe);
+
+  // load innerIframe, and get the PaymentRequest instance
+  const request = await getLoadedPaymentRequest(
+    innerIframe,
+    "./resources/page2.html"
+  );
+  // Save DOMException from innerIframe before navigating away.
+  const innerIframeDOMException = innerIframe.contentWindow.DOMException;
+
+  // Navigate the outer iframe to a new location.
+  // Wait for the load event to fire.
+  await new Promise((resolve) => {
+    outerIframe.addEventListener("load", resolve);
+    outerIframe.src = "./resources/page2.html";
+  });
+
+  await test_driver.bless("", () => {}, innerIframe.contentWindow);
+  const showPromise = request.show();
+  // Now, request's relevant global object's document is still active
+  // (it is the active document of the inner iframe), but is not fully active
+  // (since the parent of the inner iframe is itself no longer active).
+  // So, call request.show() and make sure it rejects appropriately.
   await promise_rejects_dom(
     t,
     "AbortError",
-    secondCtor,
-    showPromise2,
-    "Show promise should abort."
+    innerIframeDOMException,
+    showPromise,
+    "Active, but not fully active, so must throw AbortError"
   );
-}, "If a payment request is showing, but its document is navigated away (so no longer fully active), the payment sheet is dismissed.");
+
+  // We are done, so clean up.
+  outerIframe.remove();
+}, "PaymentRequest.show() aborts if the document is active, but not fully active.");
 </script>
 </body>