| <!DOCTYPE html> |
| <meta charset="utf-8"> |
| <title>Test for PaymentDetailsBase's shippingOptions member</title> |
| <link rel="help" href="https://w3c.github.io/payment-request/#dom-paymentdetailsbase-shippingoptions"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script> |
| setup({ explicit_done: true, explicit_timeout: true }); |
| const validMethods = Object.freeze([ |
| { supportedMethods: "basic-card" }, |
| { |
| supportedMethods: "https://apple.com/apple-pay", |
| data: { |
| version: 3, |
| merchantIdentifier: "merchant.com.example", |
| countryCode: "US", |
| merchantCapabilities: ["supports3DS"], |
| supportedNetworks: ["visa"], |
| }, |
| }, |
| ]); |
| const validAmount = Object.freeze({ currency: "USD", value: "5.00" }); |
| const validTotal = Object.freeze({ |
| label: "label", |
| amount: validAmount, |
| }); |
| const validDetails = Object.freeze({ total: validTotal }); |
| |
| const validShippingOption1 = Object.freeze({ |
| id: "fail-if-selected-1", |
| label: "FAIL if selected 1", |
| amount: validAmount, |
| selected: true, |
| }); |
| |
| const validShippingOption2 = Object.freeze({ |
| id: "fail-if-selected-2", |
| label: "FAIL if selected 2", |
| amount: validAmount, |
| selected: false, |
| }); |
| |
| const validShippingOption3 = Object.freeze({ |
| id: "pass-if-selected", |
| label: "THIS MUST BE AUTOMATICALLY SELECTED", |
| amount: validAmount, |
| selected: true, |
| }); |
| |
| function testShippingOptionChanged(button) { |
| button.disabled = true; |
| promise_test(async t => { |
| const detailsWithShippingOptions = { |
| ...validDetails, |
| shippingOptions: [ |
| validShippingOption1, |
| validShippingOption2, |
| validShippingOption3, |
| ], |
| }; |
| const request = new PaymentRequest( |
| validMethods, |
| detailsWithShippingOptions, |
| { requestShipping: true } |
| ); |
| assert_equals( |
| request.shippingOption, |
| "pass-if-selected", |
| "Must be 'pass-if-selected', as the selected member is true" |
| ); |
| request.onshippingoptionchange = () => { |
| assert_unreached("onshippingoptionchange fired unexpectedly"); |
| }; |
| const response = await request.show(); |
| assert_equals(response.shippingOption, "pass-if-selected"); |
| response.complete(); |
| }, button.textContent.trim()); |
| done(); |
| } |
| </script> |
| |
| <h2>PaymentRequest shippingOption attribute</h2> |
| <p> |
| Click on each button in sequence from top to bottom without refreshing the page. |
| Each button will bring up the Payment Request UI window. |
| </p> |
| <p> |
| When the payment sheet is presented, hit pay. |
| </p> |
| <ol> |
| <li> |
| <button onclick="testShippingOptionChanged(this)"> |
| When default shipping option is pre-selected, must not fire onshippingoptionchange |
| and PaymentResponse must reflect the pre-selected option. |
| </button> |
| </li> |
| </ol> |
| <small> |
| If you find a buggy test, please <a href="https://github.com/web-platform-tests/wpt/issues">file a bug</a> |
| and tag one of the <a href="https://github.com/web-platform-tests/wpt/blob/master/payment-request/META.yml">suggested reviewers</a>. |
| </small> |
