rejects_if_not_active-manual.https.html (5177B)
1 <!DOCTYPE html> 2 <meta charset=utf-8> 3 <link rel="help" href="https://w3c.github.io/payment-request/#retry-method"> 4 <title>PaymentResponse retry() rejects if doc is not fully active</title> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <link rel="help" href="https://w3c.github.io/payment-request/#dom-paymentresponse-retry"> 8 <body> 9 <script> 10 setup({ explicit_done: true, explicit_timeout: true }); 11 const validMethod = Object.freeze({ 12 supportedMethods: "basic-card", 13 }); 14 const applePay = Object.freeze({ 15 supportedMethods: "https://apple.com/apple-pay", 16 data: { 17 version: 3, 18 merchantIdentifier: "merchant.com.example", 19 countryCode: "US", 20 merchantCapabilities: ["supports3DS"], 21 supportedNetworks: ["visa"], 22 } 23 }); 24 const validMethods = Object.freeze([validMethod, applePay]); 25 const validAmount = Object.freeze({ 26 currency: "USD", 27 value: "5.00", 28 }); 29 const validTotal = Object.freeze({ 30 label: "Total due", 31 amount: validAmount, 32 }); 33 const validDetails = Object.freeze({ 34 total: validTotal, 35 }); 36 37 function getLoadedPaymentResponse(iframe, url) { 38 return new Promise(resolve => { 39 iframe.addEventListener( 40 "load", 41 async () => { 42 const { PaymentRequest } = iframe.contentWindow; 43 const response = await new PaymentRequest( 44 validMethods, 45 validDetails 46 ).show(); 47 resolve(response); 48 }, 49 { once: true } 50 ); 51 iframe.src = url; 52 }); 53 } 54 55 function methodNotFullyActive(button, method, ...args) { 56 const text = button.textContent.trim(); 57 promise_test(async t => { 58 const iframe = document.createElement("iframe"); 59 iframe.allow = "payment"; 60 document.body.appendChild(iframe); 61 62 // We first got to page1.html, grab a PaymentResponse instance. 63 const response = await getLoadedPaymentResponse( 64 iframe, 65 "/payment-request/resources/page1.html" 66 ); 67 // We navigate the iframe again, putting response's document into an inactive state. 68 await new Promise(resolve => { 69 iframe.addEventListener("load", resolve); 70 iframe.src = "/payment-request/resources/page2.html"; 71 }); 72 // Now, response's relevant global object's document is no longer active. 73 // So, promise needs to reject appropriately. 74 const promise = response[methodName](...args); 75 await promise_rejects_dom( 76 t, 77 "AbortError", 78 promise, 79 "Inactive document, so must throw AbortError" 80 ); 81 // We are done, so clean up. 82 iframe.remove(); 83 }, text); 84 } 85 86 function methodBecomesNotFullyActive(button, methodName, ...args) { 87 const text = button.textContent.trim(); 88 promise_test(async t => { 89 const iframe = document.createElement("iframe"); 90 iframe.allow = "payment"; 91 document.body.appendChild(iframe); 92 93 // We first got to page1.html, grab a PaymentResponse instance. 94 const response = await getLoadedPaymentResponse( 95 iframe, 96 "/payment-request/resources/page1.html" 97 ); 98 99 // we get the promise from page1.html, while it's active! 100 const promise = response[methodName](...args); 101 102 // We navigate the iframe again, putting response's document into an inactive state. 103 await new Promise(resolve => { 104 iframe.addEventListener("load", resolve); 105 iframe.src = "/payment-request/resources/page2.html"; 106 }); 107 108 // Now, response's relevant global object's document is no longer active. 109 // So, promise needs to reject appropriately. 110 await promise_rejects_dom( 111 t, 112 "AbortError", 113 promise, 114 "Inactive document, so must throw AbortError" 115 ); 116 // We are done, so clean up. 117 iframe.remove(); 118 }, text); 119 } 120 </script> 121 <section> 122 <p> 123 For each test, when the payment sheet is shown, select a payment method and hit "Pay". 124 </p> 125 <h2>retry() and document active state</h2> 126 <p>Manual Tests for PaymentResponse.retry() - Please run in order!</p> 127 <ol> 128 <li> 129 <button onclick="methodNotFullyActive(this, 'retry', {});"> 130 retry()'s retryPromise rejects if document is not fully active. 131 </button> 132 </li> 133 <li> 134 <button onclick="methodBecomesNotFullyActive(this, 'retry', {});"> 135 retry()'s retryPromise rejects if the document becomes not fully active. 136 </button> 137 </li> 138 </ol> 139 <h2>complete() and document active state</h2> 140 <p>Manual Tests for PaymentResponse.complete() - Please run in order!</p> 141 <ol> 142 <li> 143 <button onclick="methodNotFullyActive(this, 'complete', 'success');"> 144 complete()'s completePromise rejects if document is not fully active. 145 </button> 146 </li> 147 <li> 148 <button onclick="methodBecomesNotFullyActive(this, 'complete', 'success');"> 149 complete()'s completePromise rejects if the document becomes not fully active. 150 </button> 151 </li> 152 <li> 153 <button onclick="done();">Done</button> 154 </li> 155 </ol> 156 </section> 157 <small> 158 If you find a buggy test, please <a href="https://github.com/web-platform-tests/wpt/issues">file a bug</a> 159 and tag one of the <a href="https://github.com/web-platform-tests/wpt/blob/master/payment-request/META.yml">suggested reviewers</a>. 160 </small>