authentication-invalid-icon.https.html (3796B)
1 <!DOCTYPE html> 2 <meta charset="utf-8"> 3 <title>Test for the 'secure-payment-confirmation' payment method authentication - invalid icon</title> 4 <link rel="help" href="https://w3c.github.io/secure-payment-confirmation#sctn-steps-to-check-if-a-payment-can-be-made"> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <script src="/resources/testdriver.js"></script> 8 <script src="/resources/testdriver-vendor.js"></script> 9 <script src="utils.sub.js"></script> 10 <script> 11 'use strict'; 12 13 promise_test(async t => { 14 const authenticator = await window.test_driver.add_virtual_authenticator( 15 AUTHENTICATOR_OPTS); 16 t.add_cleanup(() => { 17 return window.test_driver.remove_virtual_authenticator(authenticator); 18 }); 19 20 // We deliberately do *NOT* set an SPC transaction mode override, as SPC 21 // should reject without any UX being shown in the case of an invalid image. 22 await window.test_driver.set_spc_transaction_mode("none"); 23 24 const credential = await createCredential(); 25 26 const challenge = 'server challenge'; 27 const payeeOrigin = 'https://merchant.com'; 28 const displayName = 'Troycard ***1234'; 29 30 // First try an icon that cannot be downloaded. 31 let request = new PaymentRequest([{ 32 supportedMethods: 'secure-payment-confirmation', 33 data: { 34 credentialIds: [credential.rawId], 35 challenge: Uint8Array.from(challenge, c => c.charCodeAt(0)), 36 payeeOrigin, 37 rpId: window.location.hostname, 38 timeout: 60000, 39 instrument: { 40 displayName, 41 icon: NONEXISTENT_ICON_URL, 42 }, 43 } 44 }], PAYMENT_DETAILS); 45 await test_driver.bless('user activation'); 46 await promise_rejects_dom(t, "NotSupportedError", request.show()); 47 48 // Now try an icon that cannot be decoded. 49 request = new PaymentRequest([{ 50 supportedMethods: 'secure-payment-confirmation', 51 data: { 52 credentialIds: [credential.rawId], 53 challenge: Uint8Array.from(challenge, c => c.charCodeAt(0)), 54 payeeOrigin, 55 rpId: window.location.hostname, 56 timeout: 60000, 57 instrument: { 58 displayName, 59 icon: INVALID_ICON_DATA_URL, 60 }, 61 } 62 }], PAYMENT_DETAILS); 63 await test_driver.bless('user activation'); 64 await promise_rejects_dom(t, "NotSupportedError", request.show()); 65 }, 'SPC authentication with an invalid icon'); 66 67 promise_test(async t => { 68 const authenticator = await window.test_driver.add_virtual_authenticator( 69 AUTHENTICATOR_OPTS); 70 t.add_cleanup(() => { 71 return window.test_driver.remove_virtual_authenticator(authenticator); 72 }); 73 74 await window.test_driver.set_spc_transaction_mode("autoAccept"); 75 t.add_cleanup(() => { 76 return window.test_driver.set_spc_transaction_mode("none"); 77 }); 78 79 const credential = await createCredential(); 80 81 const challenge = 'server challenge'; 82 const payeeOrigin = 'https://merchant.com'; 83 const displayName = 'Troycard ***1234'; 84 85 let request = new PaymentRequest([{ 86 supportedMethods: 'secure-payment-confirmation', 87 data: { 88 credentialIds: [credential.rawId], 89 challenge: Uint8Array.from(challenge, c => c.charCodeAt(0)), 90 payeeOrigin, 91 rpId: window.location.hostname, 92 timeout: 60000, 93 instrument: { 94 displayName, 95 icon: NONEXISTENT_ICON_URL, 96 iconMustBeShown: false, 97 }, 98 } 99 }], PAYMENT_DETAILS); 100 101 await test_driver.bless('user activation'); 102 const responsePromise = request.show(); 103 const response = await responsePromise; 104 await response.complete('success'); 105 const cred = response.details; 106 const clientDataJSON = JSON.parse(arrayBufferToString(cred.response.clientDataJSON)); 107 assert_equals(clientDataJSON.payment.instrument.icon, ''); 108 }, 'SPC authentication allowing an invalid icon with iconMustBeShown option.'); 109 </script>