104 lines
3.4 KiB
HTML
104 lines
3.4 KiB
HTML
<!DOCTYPE html>
|
|
<!-- Copyright © 2017 Chromium authors and World Wide Web Consortium, (Massachusetts Institute of Technology, ERCIM, Keio University, Beihang). -->
|
|
<meta charset="utf-8">
|
|
<title>Test for PaymentRequest shippingOption attribute</title>
|
|
<link rel="help" href="https://w3c.github.io/payment-request/#shippingoption-attribute">
|
|
<link rel="help" href="https://w3c.github.io/payment-request/#onshippingoptionchange-attribute">
|
|
<script src="/resources/testharness.js"></script>
|
|
<script src="/resources/testharnessreport.js"></script>
|
|
<script>
|
|
setup({ explicit_done: true, explicit_timeout: true });
|
|
const validMethod = Object.freeze({ supportedMethods: "basic-card" });
|
|
const applePayMethod = {
|
|
supportedMethods: "https://apple.com/apple-pay",
|
|
data: {
|
|
version: 3,
|
|
merchantIdentifier: "merchant.com.example",
|
|
countryCode: "US",
|
|
merchantCapabilities: ["supports3DS"],
|
|
supportedNetworks: ["visa"],
|
|
},
|
|
};
|
|
const validMethods = Object.freeze([validMethod, applePayMethod]);
|
|
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: "valid-1",
|
|
label: "PICK ME!",
|
|
amount: validAmount,
|
|
selected: false,
|
|
});
|
|
|
|
const validShippingOption2 = Object.freeze({
|
|
id: "initially-selected",
|
|
label: "Valid shipping option 2",
|
|
amount: validAmount,
|
|
selected: true,
|
|
});
|
|
|
|
const requestShipping = Object.freeze({
|
|
requestShipping: true,
|
|
});
|
|
|
|
function testShippingOptionChanged() {
|
|
promise_test(async t => {
|
|
const detailsWithShippingOptions = Object.assign({}, validDetails, {
|
|
shippingOptions: [validShippingOption1, validShippingOption2],
|
|
});
|
|
const request = new PaymentRequest(
|
|
validMethods,
|
|
detailsWithShippingOptions,
|
|
requestShipping
|
|
);
|
|
assert_equals(
|
|
request.shippingOption,
|
|
"initially-selected",
|
|
"Must be 'initially-selected', as the selected member is true"
|
|
);
|
|
const listenerPromise = new Promise(resolve => {
|
|
request.addEventListener("shippingoptionchange", () => {
|
|
resolve(request.shippingOption);
|
|
});
|
|
});
|
|
const handlerPromise = new Promise(resolve => {
|
|
request.onshippingoptionchange = () => {
|
|
resolve(request.shippingOption);
|
|
};
|
|
});
|
|
request.show().catch(err => err);
|
|
|
|
const results = await Promise.all([listenerPromise, handlerPromise]);
|
|
assert_true(
|
|
results.every(result => result === "valid-1"),
|
|
"Expected valid-1 as the shippingOption"
|
|
);
|
|
await request.abort();
|
|
});
|
|
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, select "PICK ME!" as the shipping option.
|
|
</p>
|
|
<ol>
|
|
<li>
|
|
<button onclick="testShippingOptionChanged()">
|
|
When the shipping option is manually changed, request.shippingOption represents the user's choice.
|
|
</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>
|