mirror of
https://github.com/Feodor2/Mypal68.git
synced 2025-06-18 14:55:44 -04:00
112 lines
3.9 KiB
HTML
112 lines
3.9 KiB
HTML
<!DOCTYPE HTML>
|
|
<html>
|
|
<!--
|
|
Test the accepted-cards element
|
|
-->
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<title>Test the accepted-cards element</title>
|
|
<script src="/tests/SimpleTest/SimpleTest.js"></script>
|
|
<script src="/tests/SimpleTest/EventUtils.js"></script>
|
|
<script src="sinon-7.2.7.js"></script>
|
|
<script src="payments_common.js"></script>
|
|
<script src="../../res/unprivileged-fallbacks.js"></script>
|
|
|
|
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
|
|
<link rel="stylesheet" type="text/css" href="../../res/paymentRequest.css"/>
|
|
<link rel="stylesheet" type="text/css" href="../../res/components/accepted-cards.css"/>
|
|
</head>
|
|
<body>
|
|
<p id="display">
|
|
<accepted-cards label="Accepted:"></accepted-cards>
|
|
</p>
|
|
<div id="content" style="display: none">
|
|
|
|
</div>
|
|
<pre id="test">
|
|
</pre>
|
|
<script type="module">
|
|
/** Test the accepted-cards component **/
|
|
|
|
/* global sinon, PaymentDialogUtils */
|
|
|
|
import "../../res/components/accepted-cards.js";
|
|
import {requestStore} from "../../res/mixins/PaymentStateSubscriberMixin.js";
|
|
let emptyState = requestStore.getState();
|
|
let acceptedElem = document.querySelector("accepted-cards");
|
|
let allNetworks = PaymentDialogUtils.getCreditCardNetworks();
|
|
|
|
add_task(async function test_reConnected() {
|
|
let itemsCount = acceptedElem.querySelectorAll(".accepted-cards-item").length;
|
|
is(itemsCount, allNetworks.length, "Same number of items as there are supported networks");
|
|
|
|
let container = acceptedElem.parentNode;
|
|
let removed = container.removeChild(acceptedElem);
|
|
container.appendChild(removed);
|
|
let newItemsCount = acceptedElem.querySelectorAll(".accepted-cards-item").length;
|
|
is(itemsCount, newItemsCount, "Number of items doesnt changed when re-connected");
|
|
});
|
|
|
|
add_task(async function test_someAccepted() {
|
|
let supportedNetworks = ["discover", "amex"];
|
|
let paymentMethods = [{
|
|
supportedMethods: "basic-card",
|
|
data: {
|
|
supportedNetworks,
|
|
},
|
|
}];
|
|
requestStore.setState({
|
|
request: Object.assign({}, emptyState.request, {
|
|
paymentMethods,
|
|
}),
|
|
});
|
|
await asyncElementRendered();
|
|
|
|
let showingItems = acceptedElem.querySelectorAll(".accepted-cards-item:not([hidden])");
|
|
is(showingItems.length, 2,
|
|
"Expected 2 items to be showing when 2 supportedNetworks are indicated");
|
|
for (let network of allNetworks) {
|
|
if (supportedNetworks.includes(network)) {
|
|
ok(acceptedElem.querySelector(`[data-network-id='${network}']:not([hidden])`),
|
|
`Item for the ${network} network expected to be visible`);
|
|
} else {
|
|
ok(acceptedElem.querySelector(`[data-network-id='${network}'][hidden]`),
|
|
`Item for the ${network} network expected to be hidden`);
|
|
}
|
|
}
|
|
});
|
|
|
|
add_task(async function test_officialBranding() {
|
|
// verify we get the expected result when isOfficialBranding returns true
|
|
sinon.stub(PaymentDialogUtils, "isOfficialBranding").callsFake(() => { return true; });
|
|
|
|
let container = acceptedElem.parentNode;
|
|
let removed = container.removeChild(acceptedElem);
|
|
container.appendChild(removed);
|
|
|
|
ok(PaymentDialogUtils.isOfficialBranding.calledOnce,
|
|
"isOfficialBranding was called");
|
|
ok(acceptedElem.classList.contains("branded"),
|
|
"The branded class is added when isOfficialBranding returns true");
|
|
PaymentDialogUtils.isOfficialBranding.restore();
|
|
|
|
// verify we get the expected result when isOfficialBranding returns false
|
|
sinon.stub(PaymentDialogUtils, "isOfficialBranding").callsFake(() => { return false; });
|
|
|
|
// the branded class is toggled in the 'connectedCallback',
|
|
// so remove and re-add the element to re-evaluate branded-ness
|
|
removed = container.removeChild(acceptedElem);
|
|
container.appendChild(removed);
|
|
|
|
ok(PaymentDialogUtils.isOfficialBranding.calledOnce,
|
|
"isOfficialBranding was called");
|
|
ok(!acceptedElem.classList.contains("branded"),
|
|
"The branded class is removed when isOfficialBranding returns false");
|
|
PaymentDialogUtils.isOfficialBranding.restore();
|
|
});
|
|
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|