Bug 1427959 - Clean up some tests WebPayments UI tests. r?mattn draft
authorJared Wein <jwein@mozilla.com>
Wed, 23 May 2018 14:23:36 -0400
changeset 800072 5988b6e26fb9b75f705bc76406888895c4de1108
parent 799922 fe66c9e30a203531fe312dc052882e25a34f806e
child 800073 33b3e8717b78a5e24fc13292f9a70f696a0af498
push id111257
push userbmo:jaws@mozilla.com
push dateFri, 25 May 2018 20:34:14 +0000
reviewersmattn
bugs1427959
milestone62.0a1
Bug 1427959 - Clean up some tests WebPayments UI tests. r?mattn - Remove getTextContent since it was too verbose and unneeded. - Replace isElementVisible with content-available isVisible and isHidden since it is more convenient to check these within content tasks. - Removed browser_request_summary.js test since what it was testing is now covered by many other tests. - Added a checkPaymentMethodDetailsMatchesCard function to head.js to reduce duplication of card verification tests. - Changed some tests to use pre-defined addresses and cards instead of supplying their own. MozReview-Commit-ID: FLwDKFJQNUY
browser/components/payments/test/PaymentTestUtils.jsm
browser/components/payments/test/browser/browser.ini
browser/components/payments/test/browser/browser_address_edit.js
browser/components/payments/test/browser/browser_card_edit.js
browser/components/payments/test/browser/browser_change_shipping.js
browser/components/payments/test/browser/browser_payments_onboarding_wizard.js
browser/components/payments/test/browser/browser_profile_storage.js
browser/components/payments/test/browser/browser_request_shipping.js
browser/components/payments/test/browser/browser_request_summary.js
browser/components/payments/test/browser/browser_shippingaddresschange_error.js
browser/components/payments/test/browser/browser_show_dialog.js
browser/components/payments/test/browser/head.js
--- a/browser/components/payments/test/PaymentTestUtils.jsm
+++ b/browser/components/payments/test/PaymentTestUtils.jsm
@@ -78,27 +78,16 @@ var PaymentTestUtils = {
                             .setHandlingUserInput(true);
       content.showPromise = rq.show();
 
       handle.destruct();
     },
   },
 
   DialogContentTasks: {
-    isElementVisible: selector => {
-      let element = content.document.querySelector(selector);
-      return element.getBoundingClientRect().height > 0;
-    },
-
-    getElementTextContent: selector => {
-      let doc = content.document;
-      let element = doc.querySelector(selector);
-      return element.textContent;
-    },
-
     getShippingOptions: () => {
       let select = content.document.querySelector("shipping-option-picker > rich-select");
       let popupBox = Cu.waiveXrays(select).popupBox;
       let selectedOptionIndex = Array.from(popupBox.children)
                                      .findIndex(item => item.hasAttribute("selected"));
       let selectedOption = popupBox.children[selectedOptionIndex];
       let currencyAmount = selectedOption.querySelector("currency-amount");
       return {
@@ -160,16 +149,20 @@ var PaymentTestUtils = {
      * @returns {undefined}
      */
     manuallyClickCancel: () => {
       content.document.getElementById("cancel").click();
     },
 
     /**
      * Do the minimum possible to complete the payment succesfully.
+     *
+     * Don't await on this task since the cancel can close the dialog before
+     * ContentTask can resolve the promise.
+     *
      * @returns {undefined}
      */
     completePayment: () => {
       content.document.getElementById("pay").click();
     },
 
     setSecurityCode: ({securityCode}) => {
       // Waive the xray to access the untrusted `securityCodeInput` property
@@ -317,16 +310,53 @@ var PaymentTestUtils = {
             label: "Total due",
             amount: { currency: "USD", value: "3.50" },
           },
         },
       ],
     },
   },
 
+  UpdateWith: {
+    twoShippingOptions: {
+      error: "",
+      shippingOptions: [
+        {
+          id: "1",
+          label: "Most Unperfect Shipping",
+          amount: { currency: "USD", value: "1" },
+        },
+        {
+          id: "2",
+          label: "Least Perfect Shipping",
+          amount: { currency: "USD", value: "2" },
+          selected: true,
+        },
+      ],
+      total: {
+        label: "Grand total is now: ",
+        amount: {
+          value: "24",
+          currency: "USD",
+        },
+      },
+    },
+    genericShippingError: {
+      error: "Cannot ship with option 1 on days that end with Y",
+      shippingOptions: [],
+      total: {
+        label: "Grand total is!!!!!: ",
+        amount: {
+          value: "12",
+          currency: "USD",
+        },
+      },
+    },
+  },
+
   Options: {
     requestShippingOption: {
       requestShipping: true,
     },
     requestPayerNameAndEmail: {
       requestPayerName: true,
       requestPayerEmail: true,
     },
@@ -348,17 +378,17 @@ var PaymentTestUtils = {
       "address-level1": "MA",
       "postal-code": "02139",
       country: "US",
       tel: "+16172535702",
       email: "timbl@example.org",
     },
     TimBL2: {
       "given-name": "Timothy",
-      "additional-name": "John",
+      "additional-name": "Johann",
       "family-name": "Berners-Lee",
       organization: "World Wide Web Consortium",
       "street-address": "1 Pommes Frittes Place",
       "address-level2": "Berlin",
       "address-level1": "BE",
       "postal-code": "02138",
       country: "DE",
       tel: "+16172535702",
@@ -377,14 +407,14 @@ var PaymentTestUtils = {
       "tel": "+15032541000",
       "email": "tempie@example.com",
     },
   },
 
   BasicCards: {
     JohnDoe: {
       "cc-exp-month": 1,
-      "cc-exp-year": 9999,
+      "cc-exp-year": (new Date()).getFullYear() + 9,
       "cc-name": "John Doe",
-      "cc-number": "999999999999",
+      "cc-number": "4111111111111111",
     },
   },
 };
--- a/browser/components/payments/test/browser/browser.ini
+++ b/browser/components/payments/test/browser/browser.ini
@@ -10,14 +10,12 @@ support-files =
 [browser_card_edit.js]
 [browser_change_shipping.js]
 [browser_dropdowns.js]
 [browser_host_name.js]
 [browser_payments_onboarding_wizard.js]
 [browser_profile_storage.js]
 [browser_request_serialization.js]
 [browser_request_shipping.js]
-[browser_request_summary.js]
-uses-unsafe-cpows = true
 [browser_shippingaddresschange_error.js]
 [browser_show_dialog.js]
 skip-if = os == 'win' && debug # bug 1418385
 [browser_total.js]
--- a/browser/components/payments/test/browser/browser_address_edit.js
+++ b/browser/components/payments/test/browser/browser_address_edit.js
@@ -21,29 +21,16 @@ add_task(async function test_add_link() 
         merchantTaskFn: PTU.ContentTasks.createAndShowRequest,
       }
     );
 
     let shippingAddressChangePromise = ContentTask.spawn(browser, {
       eventName: "shippingaddresschange",
     }, PTU.ContentTasks.awaitPaymentRequestEventPromise);
 
-    const EXPECTED_ADDRESS = {
-      "given-name": "Jared",
-      "family-name": "Wein",
-      "organization": "Mozilla",
-      "street-address": "404 Internet Lane",
-      "address-level2": "Firefoxity City",
-      "address-level1": "CA",
-      "postal-code": "31337",
-      "country": "US",
-      "tel": "+15555551212",
-      "email": "test@example.com",
-    };
-
     await spawnPaymentDialogTask(frame, async (address) => {
       let {
         PaymentTestUtils: PTU,
       } = ChromeUtils.import("resource://testing-common/PaymentTestUtils.jsm", {});
 
       let state = await PTU.DialogContentUtils.waitForState(content, (state) => {
         return Object.keys(state.savedAddresses).length == 0;
       }, "No saved addresses when starting test");
@@ -84,17 +71,17 @@ add_task(async function test_add_link() 
       let savedAddress = state.savedAddresses[addressGUIDs[0]];
       for (let [key, val] of Object.entries(address)) {
         is(savedAddress[key], val, "Check " + key);
       }
 
       state = await PTU.DialogContentUtils.waitForState(content, (state) => {
         return state.page.id == "payment-summary";
       }, "Switched back to payment-summary");
-    }, EXPECTED_ADDRESS);
+    }, PTU.Addresses.TimBL);
 
     await shippingAddressChangePromise;
     info("got shippingaddresschange event");
 
     info("clicking cancel");
     spawnPaymentDialogTask(frame, PTU.DialogContentTasks.manuallyClickCancel);
 
     await BrowserTestUtils.waitForCondition(() => win.closed, "dialog should be closed");
@@ -247,18 +234,18 @@ add_task(async function test_add_payer_c
           ok(false, `${key} field not found`);
         }
         field.value = val;
         ok(!field.disabled, `Field #${key} shouldn't be disabled`);
       }
 
       info("check that non-payer requested fields are hidden");
       for (let selector of ["#organization", "#tel"]) {
-        ok(content.document.querySelector(selector).getBoundingClientRect().height == 0,
-           selector + " should be hidden");
+        let element = content.document.querySelector(selector);
+        ok(content.isHidden(element), selector + " should be hidden");
       }
 
       content.document.querySelector("address-form button:last-of-type").click();
       state = await PTU.DialogContentUtils.waitForState(content, (state) => {
         return Object.keys(state.savedAddresses).length == 1;
       }, "Check address was added");
 
       let addressGUIDs = Object.keys(state.savedAddresses);
@@ -335,19 +322,19 @@ add_task(async function test_edit_payer_
 
       info("check that non-payer requested fields are hidden");
       let formElements =
         content.document.querySelectorAll("address-form :-moz-any(input, select, textarea");
       let allowedFields = ["given-name", "additional-name", "family-name", "email", "tel"];
       for (let element of formElements) {
         let shouldBeVisible = allowedFields.includes(element.id);
         if (shouldBeVisible) {
-          ok(element.getBoundingClientRect().height > 0, element.id + " should be visible");
+          ok(content.isVisible(element), element.id + " should be visible");
         } else {
-          ok(element.getBoundingClientRect().height == 0, element.id + " should be hidden");
+          ok(content.isHidden(element), element.id + " should be hidden");
         }
       }
 
       content.document.querySelector("address-form button:last-of-type").click();
 
       state = await PTU.DialogContentUtils.waitForState(content, (state) => {
         let addresses = Object.entries(state.savedAddresses);
         return addresses.length == 1 &&
@@ -417,17 +404,17 @@ add_task(async function test_private_per
          "isPrivate is a flag");
     });
 
     info("wait for initialAddresses");
     let initialAddresses =
       await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.getShippingAddresses);
     is(initialAddresses.options.length, 2, "Got expected number of pre-filled shipping addresses");
 
-    // // listen for shippingaddresschange event in merchant (private) window
+    // listen for shippingaddresschange event in merchant (private) window
     info("listen for shippingaddresschange");
     let shippingAddressChangePromise = ContentTask.spawn(browser, {
       eventName: "shippingaddresschange",
     }, PTU.ContentTasks.awaitPaymentRequestEventPromise);
 
     // add an address
     // (return to summary view)
     info("add an address");
--- a/browser/components/payments/test/browser/browser_card_edit.js
+++ b/browser/components/payments/test/browser/browser_card_edit.js
@@ -29,34 +29,28 @@ add_task(async function test_add_link() 
     let title = content.document.querySelector("basic-card-form h1");
     is(title.textContent, "Add Credit Card", "Add title should be set");
 
     ok(!state.isPrivate,
        "isPrivate flag is not set when paymentrequest is shown from a non-private session");
     let persistCheckbox = content.document.querySelector("basic-card-form labelled-checkbox");
     ok(Cu.waiveXrays(persistCheckbox).checked, "persist checkbox should be checked by default");
 
-    let year = (new Date()).getFullYear();
-    let card = {
-      "cc-number": "4111111111111111",
-      "cc-name": "J. Smith",
-      "cc-exp-month": 11,
-      "cc-exp-year": year,
-    };
+    let card = Object.assign({}, PTU.BasicCards.JohnDoe);
 
     info("filling fields");
     for (let [key, val] of Object.entries(card)) {
       let field = content.document.getElementById(key);
       field.value = val;
       ok(!field.disabled, `Field #${key} shouldn't be disabled`);
     }
 
     let billingAddressSelect = content.document.querySelector("#billingAddressGUID");
-    isnot(billingAddressSelect.getBoundingClientRect().height, 0,
-          "The billing address selector should always be visible");
+    ok(content.isVisible(billingAddressSelect),
+       "The billing address selector should always be visible");
     is(billingAddressSelect.childElementCount, 1,
        "Only one child option should exist by default");
     is(billingAddressSelect.children[0].value, "",
        "The only option should be the blank/empty option");
 
     let addressAddLink = content.document.querySelector(".billingAddressRow .add-link");
     addressAddLink.click();
     state = await PTU.DialogContentUtils.waitForState(content, (state) => {
@@ -170,23 +164,21 @@ add_task(async function test_edit_link()
     state = await PTU.DialogContentUtils.waitForState(content, (state) => {
       return Object.keys(state.savedBasicCards).length == 1 &&
              Object.keys(state.savedAddresses).length == 1;
     }, "Check card and address present at beginning of test");
 
     let title = content.document.querySelector("basic-card-form h1");
     is(title.textContent, "Edit Credit Card", "Edit title should be set");
 
-    let nextYear = (new Date()).getFullYear() + 1;
-    let card = {
-      // cc-number cannot be modified
-      "cc-name": "A. Nonymous",
-      "cc-exp-month": 3,
-      "cc-exp-year": nextYear,
-    };
+    let card = Object.assign({}, PTU.BasicCards.JohnDoe);
+    // cc-number cannot be modified
+    delete card["cc-number"];
+    card["cc-exp-year"]++;
+    card["cc-exp-month"]++;
 
     info("overwriting field values");
     for (let [key, val] of Object.entries(card)) {
       let field = content.document.getElementById(key);
       field.value = val;
       ok(!field.disabled, `Field #${key} shouldn't be disabled`);
     }
     ok(content.document.getElementById("cc-number").disabled, "cc-number field should be disabled");
@@ -370,23 +362,17 @@ add_task(async function test_private_car
     let state = await PTU.DialogContentUtils.waitForState(content, (state) => {
       return state.page.id == "basic-card-page" && !state["basic-card-page"].guid;
     },
                                                           "Check add page state");
 
     let savedCardCount = Object.keys(state.savedBasicCards).length;
     let tempCardCount = Object.keys(state.tempBasicCards).length;
 
-    let year = (new Date()).getFullYear();
-    let card = {
-      "cc-number": "4111111111111111",
-      "cc-name": "J. Smith",
-      "cc-exp-month": 11,
-      "cc-exp-year": year,
-    };
+    let card = Object.assign({}, PTU.BasicCards.JohnDoe);
 
     info("filling fields");
     for (let [key, val] of Object.entries(card)) {
       let field = content.document.getElementById(key);
       field.value = val;
       ok(!field.disabled, `Field #${key} shouldn't be disabled`);
     }
 
--- a/browser/components/payments/test/browser/browser_change_shipping.js
+++ b/browser/components/payments/test/browser/browser_change_shipping.js
@@ -21,34 +21,30 @@ add_task(async function test_change_ship
     );
 
     let shippingOptions =
       await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.getShippingOptions);
     is(shippingOptions.selectedOptionCurrency, "USD", "Shipping options should be in USD");
     is(shippingOptions.optionCount, 2, "there should be two shipping options");
     is(shippingOptions.selectedOptionID, "2", "default selected should be '2'");
 
-    await spawnPaymentDialogTask(frame,
-                                 PTU.DialogContentTasks.selectShippingOptionById,
-                                 "1");
+    await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.selectShippingOptionById, "1");
 
     shippingOptions =
       await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.getShippingOptions);
     is(shippingOptions.optionCount, 2, "there should be two shipping options");
     is(shippingOptions.selectedOptionID, "1", "selected should be '1'");
 
     await ContentTask.spawn(browser, {
       eventName: "shippingaddresschange",
       details: PTU.Details.twoShippingOptionsEUR,
     }, PTU.ContentTasks.updateWith);
     info("added shipping change handler to change to EUR");
 
-    await spawnPaymentDialogTask(frame,
-                                 PTU.DialogContentTasks.selectShippingAddressByCountry,
-                                 "DE");
+    await selectPaymentDialogShippingAddressByCountry(frame, "DE");
     info("changed shipping address to DE country");
 
     await ContentTask.spawn(browser, {
       eventName: "shippingaddresschange",
     }, PTU.ContentTasks.awaitPaymentRequestEventPromise);
     info("got shippingaddresschange event");
 
     shippingOptions =
@@ -62,37 +58,22 @@ add_task(async function test_change_ship
     info("clicking pay");
     spawnPaymentDialogTask(frame, PTU.DialogContentTasks.completePayment);
 
     // Add a handler to complete the payment above.
     info("acknowledging the completion from the merchant page");
     let result = await ContentTask.spawn(browser, {}, PTU.ContentTasks.addCompletionHandler);
     is(result.response.methodName, "basic-card", "Check methodName");
 
-    let addressLines = PTU.Addresses.TimBL2["street-address"].split("\n");
-    let actualShippingAddress = result.response.shippingAddress;
+    let {shippingAddress} = result.response;
     let expectedAddress = PTU.Addresses.TimBL2;
-    is(actualShippingAddress.addressLine[0], addressLines[0], "Address line 1 should match");
-    is(actualShippingAddress.addressLine[1], addressLines[1], "Address line 2 should match");
-    is(actualShippingAddress.country, expectedAddress.country, "Country should match");
-    is(actualShippingAddress.region, expectedAddress["address-level1"], "Region should match");
-    is(actualShippingAddress.city, expectedAddress["address-level2"], "City should match");
-    is(actualShippingAddress.postalCode, expectedAddress["postal-code"], "Zip code should match");
-    is(actualShippingAddress.organization, expectedAddress.organization, "Org should match");
-    is(actualShippingAddress.recipient,
-       `${expectedAddress["given-name"]} ${expectedAddress["additional-name"]} ` +
-       `${expectedAddress["family-name"]}`,
-       "Recipient should match");
-    is(actualShippingAddress.phone, expectedAddress.tel, "Phone should match");
+    checkPaymentAddressMatchesStorageAddress(shippingAddress, expectedAddress, "Shipping address");
 
-    let methodDetails = result.methodDetails;
-    is(methodDetails.cardholderName, "John Doe", "Check cardholderName");
-    is(methodDetails.cardNumber, "999999999999", "Check cardNumber");
-    is(methodDetails.expiryMonth, "01", "Check expiryMonth");
-    is(methodDetails.expiryYear, "9999", "Check expiryYear");
+    let {methodDetails} = result;
+    checkPaymentMethodDetailsMatchesCard(methodDetails, PTU.BasicCards.JohnDoe, "Payment method");
 
     await BrowserTestUtils.waitForCondition(() => win.closed, "dialog should be closed");
   });
   await cleanupFormAutofillStorage();
 });
 
 add_task(async function test_default_shippingOptions_noneSelected() {
   await setup();
@@ -127,19 +108,17 @@ add_task(async function test_default_shi
     });
 
     await ContentTask.spawn(browser, {
       eventName: "shippingaddresschange",
       details: shippingOptionDetailsEUR,
     }, PTU.ContentTasks.updateWith);
     info("added shipping change handler to change to EUR");
 
-    await spawnPaymentDialogTask(frame,
-                                 PTU.DialogContentTasks.selectShippingAddressByCountry,
-                                 "DE");
+    await selectPaymentDialogShippingAddressByCountry(frame, "DE");
     info("changed shipping address to DE country");
 
     await ContentTask.spawn(browser, {
       eventName: "shippingaddresschange",
     }, PTU.ContentTasks.awaitPaymentRequestEventPromise);
     info("got shippingaddresschange event");
 
     shippingOptions =
@@ -188,19 +167,17 @@ add_task(async function test_default_shi
     });
 
     await ContentTask.spawn(browser, {
       eventName: "shippingaddresschange",
       details: shippingOptionDetailsEUR,
     }, PTU.ContentTasks.updateWith);
     info("added shipping change handler to change to EUR");
 
-    await spawnPaymentDialogTask(frame,
-                                 PTU.DialogContentTasks.selectShippingAddressByCountry,
-                                 "DE");
+    await selectPaymentDialogShippingAddressByCountry(frame, "DE");
     info("changed shipping address to DE country");
 
     await ContentTask.spawn(browser, {
       eventName: "shippingaddresschange",
     }, PTU.ContentTasks.awaitPaymentRequestEventPromise);
     info("got shippingaddresschange event");
 
     shippingOptions =
@@ -242,21 +219,18 @@ add_task(async function test_no_shipping
     info("acknowledging the completion from the merchant page");
     let result = await ContentTask.spawn(browser, {}, PTU.ContentTasks.addCompletionHandler);
     is(result.response.methodName, "basic-card", "Check methodName");
 
     let actualShippingAddress = result.response.shippingAddress;
     ok(actualShippingAddress === null,
        "Check that shipping address is null with requestShipping:false");
 
-    let methodDetails = result.methodDetails;
-    is(methodDetails.cardholderName, "John Doe", "Check cardholderName");
-    is(methodDetails.cardNumber, "999999999999", "Check cardNumber");
-    is(methodDetails.expiryMonth, "01", "Check expiryMonth");
-    is(methodDetails.expiryYear, "9999", "Check expiryYear");
+    let {methodDetails} = result;
+    checkPaymentMethodDetailsMatchesCard(methodDetails, PTU.BasicCards.JohnDoe, "Payment method");
 
     await BrowserTestUtils.waitForCondition(() => win.closed, "dialog should be closed");
   });
   await cleanupFormAutofillStorage();
 });
 
 add_task(async function test_address_edit() {
   await setup();
@@ -280,18 +254,17 @@ add_task(async function test_address_edi
 
     is(selectedIndex, -1, "No address should be selected initially");
 
     await ContentTask.spawn(browser, {
       eventName: "shippingaddresschange",
     }, PTU.ContentTasks.promisePaymentRequestEvent);
 
     info("selecting the US address");
-    await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.selectShippingAddressByCountry,
-                                 "US");
+    await selectPaymentDialogShippingAddressByCountry(frame, "US");
 
     await ContentTask.spawn(browser, {
       eventName: "shippingaddresschange",
     }, PTU.ContentTasks.awaitPaymentRequestEventPromise);
 
     addressOptions =
       await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.getShippingAddresses);
     info("initial addressOptions: " + JSON.stringify(addressOptions));
@@ -338,18 +311,17 @@ add_task(async function test_address_rem
         methodData: [PTU.MethodData.basicCard],
         details: PTU.Details.twoShippingOptions,
         merchantTaskFn: PTU.ContentTasks.createAndShowRequest,
         options: PTU.Options.requestShippingOption,
       }
     );
 
     info("selecting the US address");
-    await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.selectShippingAddressByCountry,
-                                 "US");
+    await selectPaymentDialogShippingAddressByCountry(frame, "US");
 
     let addressOptions =
       await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.getShippingAddresses);
     info("initial addressOptions: " + JSON.stringify(addressOptions));
     let selectedIndex = addressOptions.selectedOptionIndex;
     let selectedAddressGuid = addressOptions.options[selectedIndex].guid;
 
     is(selectedIndex, 0, "First address should be selected");
--- a/browser/components/payments/test/browser/browser_payments_onboarding_wizard.js
+++ b/browser/components/payments/test/browser/browser_payments_onboarding_wizard.js
@@ -18,114 +18,85 @@ add_task(async function test_onboarding_
     let {win, frame} =
       await setupPaymentDialog(browser, {
         methodData: [PTU.MethodData.basicCard],
         details: PTU.Details.total60USD,
         options: PTU.Options.requestShippingOption,
         merchantTaskFn: PTU.ContentTasks.createAndShowRequest,
       });
 
-    info("Checking if the address page has been rendered");
-    let isAddressPageSaveButtonVisible =
-      await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.isElementVisible,
-                                   "address-form .save-button");
-    ok(isAddressPageSaveButtonVisible, "Address page is rendered");
-
     await spawnPaymentDialogTask(frame, async function() {
       let {
         PaymentTestUtils: PTU,
       } = ChromeUtils.import("resource://testing-common/PaymentTestUtils.jsm", {});
 
+      info("Checking if the address page has been rendered");
+      let addressSaveButton = content.document.querySelector("address-form .save-button");
+      ok(content.isVisible(addressSaveButton), "Address save button is rendered");
+
       await PTU.DialogContentUtils.waitForState(content, (state) => {
         return state.page.id == "address-page" &&
                state["address-page"].selectedStateKey == "selectedShippingAddress";
       }, "Address page is shown first during on-boarding if there are no saved addresses");
-    });
 
-    info("Check if the total header is visible on the address page during on-boarding");
-    let isHeaderVisible =
-      spawnPaymentDialogTask(frame, PTU.DialogContentTasks.isElementVisible, "header");
-    ok(isHeaderVisible, "Total Header is visible on the address page during on-boarding");
-    let headerTextContent =
-      spawnPaymentDialogTask(frame, PTU.DialogContentTasks.getElementTextContent, "header");
-    ok(headerTextContent, "Total Header contains text");
+      info("Check if the total header is visible on the address page during on-boarding");
+      let header = content.document.querySelector("header");
+      ok(content.isVisible(header),
+         "Total Header is visible on the address page during on-boarding");
+      ok(header.textContent, "Total Header contains text");
 
-    info("Check if the page title is visible on the address page");
-    let isAddressPageTitleVisible = spawnPaymentDialogTask(frame,
-                                                           PTU.DialogContentTasks.isElementVisible,
-                                                           "address-form h1");
-    ok(isAddressPageTitleVisible, "Address page title is visible");
-    let titleTextContent =
-      spawnPaymentDialogTask(frame, PTU.DialogContentTasks.getElementTextContent,
-                             "address-form h1");
-    ok(titleTextContent, "Address page title contains text");
+      info("Check if the page title is visible on the address page");
+      let addressPageTitle = content.document.querySelector("address-form h1");
+      ok(content.isVisible(addressPageTitle), "Address page title is visible");
+      ok(addressPageTitle.textContent, "Address page title contains text");
 
-    let isAddressPageCancelButtonVisible =
-      await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.isElementVisible,
-                                   "address-form .cancel-button");
-    ok(isAddressPageCancelButtonVisible, "The cancel button on the address page is visible");
-
-    await spawnPaymentDialogTask(frame, async function() {
-      let {
-        PaymentTestUtils: PTU,
-      } = ChromeUtils.import("resource://testing-common/PaymentTestUtils.jsm", {});
+      let addressCancelButton = content.document.querySelector("address-form .cancel-button");
+      ok(content.isVisible(addressCancelButton),
+         "The cancel button on the address page is visible");
 
       for (let [key, val] of Object.entries(PTU.Addresses.TimBL2)) {
         let field = content.document.getElementById(key);
         if (!field) {
           ok(false, `${key} field not found`);
         }
         field.value = val;
         ok(!field.disabled, `Field #${key} shouldn't be disabled`);
       }
       content.document.querySelector("address-form .save-button").click();
-    });
-
-    let isBasicCardPageSaveButtonVisible =
-      await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.isElementVisible,
-                                   "basic-card-form .save-button");
-    ok(isBasicCardPageSaveButtonVisible, "Basic card page is rendered");
-
-    let isBasicCardPageTitleVisible = spawnPaymentDialogTask(frame,
-                                                             // eslint-disable-next-line max-len
-                                                             PTU.DialogContentTasks.isElementVisible,
-                                                             "basic-card-form h1");
-    ok(isBasicCardPageTitleVisible, "Basic card page title is visible");
-    titleTextContent =
-      spawnPaymentDialogTask(frame,
-                             PTU.DialogContentTasks.getElementTextContent,
-                             "basic-card-form h1");
-    ok(titleTextContent, "Basic card page title contains text");
-
-    await spawnPaymentDialogTask(frame, async function() {
-      let {
-        PaymentTestUtils: PTU,
-      } = ChromeUtils.import("resource://testing-common/PaymentTestUtils.jsm", {});
 
       await PTU.DialogContentUtils.waitForState(content, (state) => {
         return state.page.id == "basic-card-page";
       }, "Basic card page is shown after the address page during on boarding");
 
+      let basicCardTitle = content.document.querySelector("basic-card-form h1");
+      ok(content.isVisible(basicCardTitle), "Basic card page title is visible");
+      ok(basicCardTitle.textContent, "Basic card page title contains text");
+
+      let cardSaveButton = content.document.querySelector("basic-card-form .save-button");
+      ok(content.isVisible(cardSaveButton), "Basic card page is rendered");
+
       for (let [key, val] of Object.entries(PTU.BasicCards.JohnDoe)) {
         let field = content.document.getElementById(key);
         field.value = val;
         ok(!field.disabled, `Field #${key} shouldn't be disabled`);
       }
       content.document.querySelector("basic-card-form .save-button").click();
+
+      await PTU.DialogContentUtils.waitForState(content, (state) => {
+        return state.page.id == "payment-summary";
+      }, "payment-summary is now visible");
+
+      let cancelButton = content.document.querySelector("#cancel");
+      ok(content.isVisible(cancelButton),
+         "Payment summary page is shown after the basic card page during on boarding");
     });
 
-    let isPaymentSummaryCancelButtonVisible =
-      await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.isElementVisible, "#cancel");
-    ok(isPaymentSummaryCancelButtonVisible,
-       "Payment summary page is shown after the basic card page during on boarding");
+    info("Closing the payment dialog");
+    spawnPaymentDialogTask(frame, PTU.DialogContentTasks.manuallyClickCancel);
 
-    info("Closing the payment dialog");
-    spawnPaymentDialogTask(frame, async function() {
-      content.document.getElementById("cancel").click();
-    });
     await BrowserTestUtils.waitForCondition(() => win.closed, "dialog should be closed");
   });
 });
 
 add_task(async function test_onboarding_wizard_with_saved_addresses_and_saved_cards() {
   await BrowserTestUtils.withNewTab({
     gBrowser,
     url: BLANK_PAGE_URL,
@@ -136,84 +107,69 @@ add_task(async function test_onboarding_
     let {win, frame} =
       await setupPaymentDialog(browser, {
         methodData: [PTU.MethodData.basicCard],
         details: PTU.Details.total60USD,
         options: PTU.Options.requestShippingOption,
         merchantTaskFn: PTU.ContentTasks.createAndShowRequest,
       });
 
-    info("Checking if the payment summary page is now visible");
-    let isPaymentSummaryCancelButtonVisible =
-      await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.isElementVisible, "#cancel");
-    ok(isPaymentSummaryCancelButtonVisible, "Payment summary page is rendered");
-
     await spawnPaymentDialogTask(frame, async function() {
       let {
         PaymentTestUtils: PTU,
       } = ChromeUtils.import("resource://testing-common/PaymentTestUtils.jsm", {});
 
+      info("Checking if the payment summary page is now visible");
+      let cancelButton = content.document.querySelector("#cancel");
+      ok(content.isVisible(cancelButton), "Payment summary page is rendered");
+
       await PTU.DialogContentUtils.waitForState(content, (state) => {
         return state.page.id == "payment-summary";
       }, "Payment summary page is shown first when there are saved addresses and saved cards");
-    });
 
-    info("Check if the total header is visible on payments summary page");
-    let isHeaderVisible =
-      spawnPaymentDialogTask(frame, PTU.DialogContentTasks.isElementVisible, "header");
-    ok(isHeaderVisible, "Total Header is visible on the payment summary page");
-    let headerTextContent =
-      spawnPaymentDialogTask(frame, PTU.DialogContentTasks.getElementTextContent, "header");
-    ok(headerTextContent, "Total Header contains text");
+      info("Check if the total header is visible on payments summary page");
+      let header = content.document.querySelector("header");
+      ok(content.isVisible(header),
+         "Total Header is visible on the payment summary page");
+      ok(header.textContent, "Total Header contains text");
 
-    // Click on the Add/Edit buttons in the payment summary page to check if
-    // the total header is visible on the address page and the basic card page.
-    let buttons = ["address-picker[selected-state-key='selectedShippingAddress'] .add-link",
-      "address-picker[selected-state-key='selectedShippingAddress'] .edit-link",
-      "payment-method-picker .add-link",
-      "payment-method-picker .edit-link"];
-    for (let button of buttons) {
-      // eslint-disable-next-line no-shadow
-      await spawnPaymentDialogTask(frame, async function(button) {
-        let {
-          PaymentTestUtils: PTU,
-        } = ChromeUtils.import("resource://testing-common/PaymentTestUtils.jsm", {});
-
+      // Click on the Add/Edit buttons in the payment summary page to check if
+      // the total header is visible on the address page and the basic card page.
+      let buttons = [
+        "address-picker[selected-state-key='selectedShippingAddress'] .add-link",
+        "address-picker[selected-state-key='selectedShippingAddress'] .edit-link",
+        "payment-method-picker .add-link",
+        "payment-method-picker .edit-link",
+      ];
+      for (let button of buttons) {
         content.document.querySelector(button).click();
-
         if (button.startsWith("address")) {
           await PTU.DialogContentUtils.waitForState(content, (state) => {
             return state.page.id == "address-page";
           }, "Address page is shown");
         } else {
           await PTU.DialogContentUtils.waitForState(content, (state) => {
             return state.page.id == "basic-card-page";
           }, "Basic card page is shown");
         }
-      }, button);
 
-      isHeaderVisible =
-        await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.isElementVisible, "header");
-      ok(!isHeaderVisible, "Total Header is hidden on the address/basic card page");
+        ok(!content.isVisible(header),
+           "Total Header is hidden on the address/basic card page");
 
-      if (button.startsWith("address")) {
-        spawnPaymentDialogTask(frame, async function() {
+        if (button.startsWith("address")) {
           content.document.querySelector("address-form .back-button").click();
-        });
-      } else {
-        spawnPaymentDialogTask(frame, async function() {
+        } else {
           content.document.querySelector("basic-card-form .back-button").click();
-        });
+        }
       }
-    }
+    });
 
     info("Closing the payment dialog");
-    spawnPaymentDialogTask(frame, async function() {
-      content.document.getElementById("cancel").click();
-    });
+    spawnPaymentDialogTask(frame, PTU.DialogContentTasks.manuallyClickCancel);
+
     await BrowserTestUtils.waitForCondition(() => win.closed, "dialog should be closed");
 
     cleanupFormAutofillStorage();
   });
 });
 
 add_task(async function test_onboarding_wizard_with_saved_addresses_and_no_saved_cards() {
   await BrowserTestUtils.withNewTab({
@@ -226,45 +182,42 @@ add_task(async function test_onboarding_
     let {win, frame} =
       await setupPaymentDialog(browser, {
         methodData: [PTU.MethodData.basicCard],
         details: PTU.Details.total60USD,
         options: PTU.Options.requestShippingOption,
         merchantTaskFn: PTU.ContentTasks.createAndShowRequest,
       });
 
-    info("Checking if the basic card has been rendered");
-    let isBasicCardPageSaveButtonVisible =
-      await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.isElementVisible,
-                                   "basic-card-form .save-button");
-    ok(isBasicCardPageSaveButtonVisible, "Basic card page is rendered");
-
     await spawnPaymentDialogTask(frame, async function() {
       let {
         PaymentTestUtils: PTU,
       } = ChromeUtils.import("resource://testing-common/PaymentTestUtils.jsm", {});
 
+      info("Checking if the basic card has been rendered");
+      let cardSaveButton = content.document.querySelector("basic-card-form .save-button");
+      ok(content.isVisible(cardSaveButton), "Basic card page is rendered");
+
       await PTU.DialogContentUtils.waitForState(content, (state) => {
         return state.page.id == "basic-card-page";
       }, "Basic card page is shown first if there are saved addresses during on boarding");
+
+      info("Check if the total header is visible on the basic card page during on-boarding");
+      let header = content.document.querySelector("header");
+      ok(content.isVisible(header),
+         "Total Header is visible on the basic card page during on-boarding");
+      ok(header.textContent, "Total Header contains text");
+
+      let cardCancelButton = content.document.querySelector("basic-card-form .cancel-button");
+      ok(content.isVisible(cardCancelButton),
+         "Cancel button is visible on the basic card page");
     });
 
-    info("Check if the total header is visible on the basic card page during on-boarding");
-    let isHeaderVisible =
-      spawnPaymentDialogTask(frame, PTU.DialogContentTasks.isElementVisible, "header");
-    ok(isHeaderVisible, "Total Header is visible on the basic card page during on-boarding");
-    let headerTextContent =
-      spawnPaymentDialogTask(frame, PTU.DialogContentTasks.getElementTextContent, "header");
-    ok(headerTextContent, "Total Header contains text");
-
-    let isBasicCardPageCancelButtonVisible =
-      await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.isElementVisible,
-                                   "basic-card-form .cancel-button");
-    ok(isBasicCardPageCancelButtonVisible, "Cancel button is visible on the basic card page");
-
-    spawnPaymentDialogTask(frame, async function() {
+    // Do not await for this task since the dialog may close before the task resolves.
+    spawnPaymentDialogTask(frame, () => {
       content.document.querySelector("basic-card-form .cancel-button").click();
     });
+
     await BrowserTestUtils.waitForCondition(() => win.closed, "dialog should be closed");
 
     cleanupFormAutofillStorage();
   });
 });
--- a/browser/components/payments/test/browser/browser_profile_storage.js
+++ b/browser/components/payments/test/browser/browser_profile_storage.js
@@ -3,39 +3,22 @@
 "use strict";
 
 const methodData = [PTU.MethodData.basicCard];
 const details = PTU.Details.total60USD;
 
 add_task(async function test_initial_state() {
   let onChanged = TestUtils.topicObserved("formautofill-storage-changed",
                                           (subject, data) => data == "add");
-  let address1GUID = formAutofillStorage.addresses.add({
-    "given-name": "Timothy",
-    "additional-name": "John",
-    "family-name": "Berners-Lee",
-    organization: "World Wide Web Consortium",
-    "street-address": "32 Vassar Street\nMIT Room 32-G524",
-    "address-level2": "Cambridge",
-    "address-level1": "MA",
-    "postal-code": "02139",
-    country: "US",
-    tel: "+16172535702",
-    email: "timbl@w3.org",
-  });
+  let address1GUID = formAutofillStorage.addresses.add(PTU.Addresses.TimBL);
   await onChanged;
 
   onChanged = TestUtils.topicObserved("formautofill-storage-changed",
                                       (subject, data) => data == "add");
-  let card1GUID = formAutofillStorage.creditCards.add({
-    "cc-name": "John Doe",
-    "cc-number": "1234567812345678",
-    "cc-exp-month": 4,
-    "cc-exp-year": 2028,
-  });
+  let card1GUID = formAutofillStorage.creditCards.add(PTU.BasicCards.JohnDoe);
   await onChanged;
 
   await BrowserTestUtils.withNewTab({
     gBrowser,
     url: BLANK_PAGE_URL,
   }, async browser => {
     let {win, frame} =
       await setupPaymentDialog(browser, {
@@ -56,38 +39,29 @@ add_task(async function test_initial_sta
         savedBasicCards,
       } = contentWin.document.querySelector("payment-dialog").requestStore.getState();
 
       is(Object.keys(savedAddresses).length, 1, "Initially one savedAddresses");
       is(savedAddresses[address1GUID].name, "Timothy John Berners-Lee", "Check full name");
       is(savedAddresses[address1GUID].guid, address1GUID, "Check address guid matches key");
 
       is(Object.keys(savedBasicCards).length, 1, "Initially one savedBasicCards");
-      is(savedBasicCards[card1GUID]["cc-number"], "************5678", "Check cc-number");
+      is(savedBasicCards[card1GUID]["cc-number"], "************1111", "Check cc-number");
       is(savedBasicCards[card1GUID].guid, card1GUID, "Check card guid matches key");
       is(savedBasicCards[card1GUID].methodName, "basic-card",
          "Check card has a methodName of basic-card");
     }, {
       address1GUID,
       card1GUID,
     });
 
     let onChanged = TestUtils.topicObserved("formautofill-storage-changed",
                                             (subject, data) => data == "add");
     info("adding an address");
-    let address2GUID = formAutofillStorage.addresses.add({
-      "given-name": "John",
-      "additional-name": "",
-      "family-name": "Smith",
-      "street-address": "331 E. Evelyn Ave.",
-      "address-level2": "Mountain View",
-      "address-level1": "CA",
-      "postal-code": "94041",
-      country: "US",
-    });
+    let address2GUID = formAutofillStorage.addresses.add(PTU.Addresses.TimBL2);
     await onChanged;
 
     await spawnPaymentDialogTask(frame, async function checkAdd({
       address1GUID,
       address2GUID,
       card1GUID,
     }) {
       info("checkAdd");
@@ -167,21 +141,21 @@ add_task(async function test_initial_sta
       info("checkRemove");
       let contentWin = Cu.waiveXrays(content);
       let {
         savedAddresses,
         savedBasicCards,
       } = contentWin.document.querySelector("payment-dialog").requestStore.getState();
 
       is(Object.keys(savedAddresses).length, 1, "Now one savedAddresses");
-      is(savedAddresses[address2GUID].name, "John Smith", "Check full name");
+      is(savedAddresses[address2GUID].name, "Timothy Johann Berners-Lee", "Check full name");
       is(savedAddresses[address2GUID].guid, address2GUID, "Check address guid matches key");
 
       is(Object.keys(savedBasicCards).length, 1, "Still one savedBasicCards");
-      is(savedBasicCards[card1GUID]["cc-number"], "************5678", "Check cc-number");
+      is(savedBasicCards[card1GUID]["cc-number"], "************1111", "Check cc-number");
       is(savedBasicCards[card1GUID].guid, card1GUID, "Check card guid matches key");
     }, {
       address2GUID,
       card1GUID,
     });
 
     spawnPaymentDialogTask(frame, PTU.DialogContentTasks.manuallyClickCancel);
 
--- a/browser/components/payments/test/browser/browser_request_shipping.js
+++ b/browser/components/payments/test/browser/browser_request_shipping.js
@@ -25,35 +25,31 @@ add_task(async function test_request_shi
         await setupPaymentDialog(browser, {
           methodData: [PTU.MethodData.basicCard],
           details: PTU.Details.twoShippingOptions,
           options,
           merchantTaskFn: PTU.ContentTasks.createAndShowRequest,
         }
       );
 
-      let isShippingOptionsVisible =
-        await spawnPaymentDialogTask(frame,
-                                     PTU.DialogContentTasks.isElementVisible,
-                                     "shipping-option-picker");
-      ok(isShippingOptionsVisible, "shipping-option-picker should be visible");
-      let addressSelector = "address-picker[selected-state-key='selectedShippingAddress']";
-      let isShippingAddressVisible =
-        await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.isElementVisible,
-                                     addressSelector);
-      ok(isShippingAddressVisible, "shipping address picker should be visible");
-
-      let shippingOptionText =
-        await spawnPaymentDialogTask(frame,
-                                     PTU.DialogContentTasks.getElementTextContent,
-                                     "#shipping-type-label");
-      is(shippingOptionText, shippingString,
-         "Label should be match shipping type: " + shippingKey);
+      await spawnPaymentDialogTask(frame, async ([aShippingKey, aShippingString]) => {
+        let shippingOptionPicker = content.document.querySelector("shipping-option-picker");
+        ok(content.isVisible(shippingOptionPicker),
+           "shipping-option-picker should be visible");
+        const addressSelector = "address-picker[selected-state-key='selectedShippingAddress']";
+        let shippingAddress = content.document.querySelector(addressSelector);
+        ok(content.isVisible(shippingAddress),
+           "shipping address picker should be visible");
+        let shippingOption = content.document.querySelector("#shipping-type-label");
+        is(shippingOption.textContent, aShippingString,
+           "Label should be match shipping type: " + aShippingKey);
+      }, [shippingKey, shippingString]);
 
       spawnPaymentDialogTask(frame, PTU.DialogContentTasks.manuallyClickCancel);
+
       await BrowserTestUtils.waitForCondition(() => win.closed, "dialog should be closed");
     }
   });
 });
 
 add_task(async function test_request_shipping_not_present() {
   await BrowserTestUtils.withNewTab({
     gBrowser,
@@ -62,22 +58,20 @@ add_task(async function test_request_shi
     let {win, frame} =
       await setupPaymentDialog(browser, {
         methodData: [PTU.MethodData.basicCard],
         details: PTU.Details.twoShippingOptions,
         merchantTaskFn: PTU.ContentTasks.createAndShowRequest,
       }
     );
 
-    let isShippingOptionsVisible =
-      await spawnPaymentDialogTask(frame,
-                                   PTU.DialogContentTasks.isElementVisible,
-                                   "shipping-option-picker");
-    ok(!isShippingOptionsVisible, "shipping-option-picker should not be visible");
-    let isShippingAddressVisible =
-      await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.isElementVisible,
-                                   "address-picker[selected-state-key='selectedShippingAddress']");
-    ok(!isShippingAddressVisible, "shipping address picker should not be visible");
+    await spawnPaymentDialogTask(frame, async () => {
+      let shippingOptionPicker = content.document.querySelector("shipping-option-picker");
+      ok(content.isHidden(shippingOptionPicker), "shipping-option-picker should not be visible");
+      const addressSelector = "address-picker[selected-state-key='selectedShippingAddress']";
+      let shippingAddress = content.document.querySelector(addressSelector);
+      ok(content.isHidden(shippingAddress), "shipping address picker should not be visible");
+    });
 
     spawnPaymentDialogTask(frame, PTU.DialogContentTasks.manuallyClickCancel);
     await BrowserTestUtils.waitForCondition(() => win.closed, "dialog should be closed");
   });
 });
deleted file mode 100644
--- a/browser/components/payments/test/browser/browser_request_summary.js
+++ /dev/null
@@ -1,10 +0,0 @@
-"use strict";
-
-add_task(async function test_summary() {
-  await BrowserTestUtils.withNewTab({
-    gBrowser,
-    url: "resource://payments/paymentRequest.xhtml",
-  }, async browser => {
-    ok(browser.contentDocumentAsCPOW.getElementById("cancel"), "Cancel button exists");
-  });
-});
--- a/browser/components/payments/test/browser/browser_shippingaddresschange_error.js
+++ b/browser/components/payments/test/browser/browser_shippingaddresschange_error.js
@@ -1,8 +1,10 @@
+/* eslint-disable no-shadow */
+
 "use strict";
 
 add_task(addSampleAddressesAndBasicCard);
 
 add_task(async function test_show_error_on_addresschange() {
   await BrowserTestUtils.withNewTab({
     gBrowser,
     url: BLANK_PAGE_URL,
@@ -12,75 +14,51 @@ add_task(async function test_show_error_
         methodData: [PTU.MethodData.basicCard],
         details: PTU.Details.twoShippingOptions,
         options: PTU.Options.requestShippingOption,
         merchantTaskFn: PTU.ContentTasks.createAndShowRequest,
       }
     );
 
     info("setting up the event handler for shippingoptionchange");
-    let EXPECTED_ERROR_TEXT = "Cannot ship with option 1 on days that end with Y";
     await ContentTask.spawn(browser, {
       eventName: "shippingoptionchange",
-      details: {
-        error: EXPECTED_ERROR_TEXT,
-        shippingOptions: [],
-        total: {
-          label: "Grand total is!!!!!: ",
-          amount: {
-            value: "12",
-            currency: "USD",
-          },
-        },
-      },
+      details: PTU.UpdateWith.genericShippingError,
     }, PTU.ContentTasks.updateWith);
-    await spawnPaymentDialogTask(frame,
-                                 PTU.DialogContentTasks.selectShippingOptionById,
-                                 "1");
+
+    await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.selectShippingOptionById, "1");
+
     info("awaiting the shippingoptionchange event");
     await ContentTask.spawn(browser, {
       eventName: "shippingoptionchange",
     }, PTU.ContentTasks.awaitPaymentRequestEventPromise);
 
-    let errorText = await spawnPaymentDialogTask(frame,
-                                                 PTU.DialogContentTasks.getElementTextContent,
-                                                 "#error-text");
-    is(errorText, EXPECTED_ERROR_TEXT, "Error text should be present on dialog");
-    let errorsVisible =
-      await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.isElementVisible, "#error-text");
-    ok(errorsVisible, "Error text should be visible");
+    await spawnPaymentDialogTask(frame, expectedText => {
+      let errorText = content.document.querySelector("#error-text");
+      is(errorText.textContent, expectedText, "Error text should be on dialog");
+      ok(content.isVisible(errorText), "Error text should be visible");
+    }, PTU.UpdateWith.genericShippingError.error);
 
     info("setting up the event handler for shippingaddresschange");
     await ContentTask.spawn(browser, {
       eventName: "shippingaddresschange",
-      details: {
-        error: "",
-        shippingOptions: PTU.Details.twoShippingOptions.shippingOptions,
-        total: {
-          label: "Grand total is now: ",
-          amount: {
-            value: "24",
-            currency: "USD",
-          },
-        },
-      },
+      details: PTU.UpdateWith.twoShippingOptions,
     }, PTU.ContentTasks.updateWith);
-    await spawnPaymentDialogTask(frame,
-                                 PTU.DialogContentTasks.selectShippingAddressByCountry,
-                                 "DE");
+
+    await selectPaymentDialogShippingAddressByCountry(frame, "DE");
+
     info("awaiting the shippingaddresschange event");
     await ContentTask.spawn(browser, {
       eventName: "shippingaddresschange",
     }, PTU.ContentTasks.awaitPaymentRequestEventPromise);
-    errorText = await spawnPaymentDialogTask(frame,
-                                             PTU.DialogContentTasks.getElementTextContent,
-                                             "#error-text");
-    is(errorText, "", "Error text should not be present on dialog");
-    errorsVisible =
-      await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.isElementVisible, "#error-text");
-    ok(!errorsVisible, "Error text should not be visible");
+
+    await spawnPaymentDialogTask(frame, () => {
+      let errorText = content.document.querySelector("#error-text");
+      is(errorText.textContent, "", "Error text should not be on dialog");
+      ok(content.isHidden(errorText), "Error text should not be visible");
+    });
 
     info("clicking cancel");
     spawnPaymentDialogTask(frame, PTU.DialogContentTasks.manuallyClickCancel);
 
     await BrowserTestUtils.waitForCondition(() => win.closed, "dialog should be closed");
   });
 });
--- a/browser/components/payments/test/browser/browser_show_dialog.js
+++ b/browser/components/payments/test/browser/browser_show_dialog.js
@@ -36,87 +36,63 @@ add_task(async function test_show_manual
     );
 
     spawnPaymentDialogTask(frame, PTU.DialogContentTasks.manuallyClickCancel);
     await BrowserTestUtils.waitForCondition(() => win.closed, "dialog should be closed");
   });
 });
 
 add_task(async function test_show_completePayment() {
+  let {address1GUID, card1GUID} = await addSampleAddressesAndBasicCard();
+
   let onChanged = TestUtils.topicObserved("formautofill-storage-changed",
-                                          (subject, data) => data == "add");
-  let address = {
-    "given-name": "Timothy",
-    "additional-name": "John",
-    "family-name": "Berners-Lee",
-    organization: "World Wide Web Consortium",
-    "street-address": "32 Vassar Street\nMIT Room 32-G524",
-    "address-level2": "Cambridge",
-    "address-level1": "MA",
-    "postal-code": "02139",
-    country: "US",
-    tel: "+16172535702",
-    email: "timbl@example.org",
-  };
-  let addressGUID = await formAutofillStorage.addresses.add(address);
-  await onChanged;
-
-  onChanged = TestUtils.topicObserved("formautofill-storage-changed",
-                                      (subject, data) => data == "add");
-  let card = {
-    billingAddressGUID: addressGUID,
-    "cc-exp-month": 1,
-    "cc-exp-year": 9999,
-    "cc-name": "John Doe",
-    "cc-number": "999999999999",
-  };
-
-  formAutofillStorage.creditCards.add(card);
+                                          (subject, data) => data == "update");
+  info("associating the card with the billing address");
+  formAutofillStorage.creditCards.update(card1GUID, {
+    billingAddressGUID: address1GUID,
+  }, true);
   await onChanged;
 
   await BrowserTestUtils.withNewTab({
     gBrowser,
     url: BLANK_PAGE_URL,
   }, async browser => {
     let {win, frame} =
       await setupPaymentDialog(browser, {
         methodData,
         details,
         options: PTU.Options.requestShippingOption,
         merchantTaskFn: PTU.ContentTasks.createAndShowRequest,
       }
     );
 
     info("select the shipping address");
-    await spawnPaymentDialogTask(frame,
-                                 PTU.DialogContentTasks.selectShippingAddressByCountry,
-                                 "US");
+    await selectPaymentDialogShippingAddressByCountry(frame, "US");
 
     info("entering CSC");
     await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.setSecurityCode, {
       securityCode: "999",
     });
     info("clicking pay");
     spawnPaymentDialogTask(frame, PTU.DialogContentTasks.completePayment);
 
     // Add a handler to complete the payment above.
     info("acknowledging the completion from the merchant page");
     let result = await ContentTask.spawn(browser, {}, PTU.ContentTasks.addCompletionHandler);
 
-    let actualShippingAddress = result.response.shippingAddress;
-    checkPaymentAddressMatchesStorageAddress(actualShippingAddress, address, "Shipping address");
+    let {shippingAddress} = result.response;
+    checkPaymentAddressMatchesStorageAddress(shippingAddress, PTU.Addresses.TimBL, "Shipping");
+
     is(result.response.methodName, "basic-card", "Check methodName");
-    let methodDetails = result.methodDetails;
-    is(methodDetails.cardholderName, "John Doe", "Check cardholderName");
-    is(methodDetails.cardNumber, "999999999999", "Check cardNumber");
-    is(methodDetails.expiryMonth, "01", "Check expiryMonth");
-    is(methodDetails.expiryYear, "9999", "Check expiryYear");
+    let {methodDetails} = result;
+    checkPaymentMethodDetailsMatchesCard(methodDetails, PTU.BasicCards.JohnDoe, "Payment method");
     is(methodDetails.cardSecurityCode, "999", "Check cardSecurityCode");
     is(typeof methodDetails.methodName, "undefined", "Check methodName wasn't included");
-    checkPaymentAddressMatchesStorageAddress(methodDetails.billingAddress, address,
+
+    checkPaymentAddressMatchesStorageAddress(methodDetails.billingAddress, PTU.Addresses.TimBL,
                                              "Billing address");
 
     is(result.response.shippingOption, "2", "Check shipping option");
 
     await BrowserTestUtils.waitForCondition(() => win.closed, "dialog should be closed");
   });
 });
 
@@ -134,17 +110,17 @@ add_task(async function test_show_comple
       }
     );
 
     await ContentTask.spawn(browser, {
       eventName: "shippingoptionchange",
     }, PTU.ContentTasks.promisePaymentRequestEvent);
 
     info("changing shipping option to '1' from default selected option of '2'");
-    spawnPaymentDialogTask(frame, PTU.DialogContentTasks.selectShippingOptionById, "1");
+    await spawnPaymentDialogTask(frame, PTU.DialogContentTasks.selectShippingOptionById, "1");
 
     await ContentTask.spawn(browser, {
       eventName: "shippingoptionchange",
     }, PTU.ContentTasks.awaitPaymentRequestEventPromise);
     info("got shippingoptionchange event");
 
     info("clicking pay");
     spawnPaymentDialogTask(frame, PTU.DialogContentTasks.completePayment);
--- a/browser/components/payments/test/browser/head.js
+++ b/browser/components/payments/test/browser/head.js
@@ -138,28 +138,34 @@ function spawnTaskInNewDialog(requestId,
   return withNewDialogFrame(requestId, async function spawnTaskInNewDialog_tabTask(reqFrame) {
     await spawnPaymentDialogTask(reqFrame, contentTaskFn, args);
   });
 }
 
 async function addSampleAddressesAndBasicCard() {
   let onChanged = TestUtils.topicObserved("formautofill-storage-changed",
                                           (subject, data) => data == "add");
-  formAutofillStorage.addresses.add(PTU.Addresses.TimBL);
+  let address1GUID = formAutofillStorage.addresses.add(PTU.Addresses.TimBL);
   await onChanged;
 
   onChanged = TestUtils.topicObserved("formautofill-storage-changed",
                                       (subject, data) => data == "add");
-  formAutofillStorage.addresses.add(PTU.Addresses.TimBL2);
+  let address2GUID = formAutofillStorage.addresses.add(PTU.Addresses.TimBL2);
   await onChanged;
 
   onChanged = TestUtils.topicObserved("formautofill-storage-changed",
                                       (subject, data) => data == "add");
-  formAutofillStorage.creditCards.add(PTU.BasicCards.JohnDoe);
+  let card1GUID = formAutofillStorage.creditCards.add(PTU.BasicCards.JohnDoe);
   await onChanged;
+
+  return {
+    address1GUID,
+    address2GUID,
+    card1GUID,
+  };
 }
 
 /**
  * Checks that an address from autofill storage matches a Payment Request PaymentAddress.
  * @param {PaymentAddress} paymentAddress
  * @param {object} storageAddress
  * @param {string} msg to describe the check
  */
@@ -176,16 +182,34 @@ function checkPaymentAddressMatchesStora
   is(paymentAddress.recipient,
      `${storageAddress["given-name"]} ${storageAddress["additional-name"]} ` +
      `${storageAddress["family-name"]}`,
      "Recipient name should match");
   is(paymentAddress.phone, storageAddress.tel, "Phone should match");
 }
 
 /**
+ * Checks that a card from autofill storage matches a Payment Request MethodDetails response.
+ * @param {MethodDetails} methodDetails
+ * @param {object} card
+ * @param {string} msg to describe the check
+ */
+function checkPaymentMethodDetailsMatchesCard(methodDetails, card, msg) {
+  info(msg);
+  // The card expiry month should be a zero-padded two-digit string.
+  let cardExpiryMonth = card["cc-exp-month"] < 10 ?
+                       "0" + card["cc-exp-month"] :
+                       card["cc-exp-month"].toString();
+  is(methodDetails.cardholderName, card["cc-name"], "Check cardholderName");
+  is(methodDetails.cardNumber, card["cc-number"], "Check cardNumber");
+  is(methodDetails.expiryMonth, cardExpiryMonth, "Check expiryMonth");
+  is(methodDetails.expiryYear, card["cc-exp-year"], "Check expiryYear");
+}
+
+/**
  * Create a PaymentRequest object with the given parameters, then
  * run the given merchantTaskFn.
  *
  * @param {Object} browser
  * @param {Object} options
  * @param {Object} options.methodData
  * @param {Object} options.details
  * @param {Object} options.options
@@ -210,16 +234,24 @@ async function setupPaymentDialog(browse
   is(win.closed, false, "dialog should not be closed");
 
   let frame = await getPaymentFrame(win);
   ok(frame, "Got payment frame");
 
   await dialogReadyPromise;
   info("dialog ready");
 
+  await spawnPaymentDialogTask(frame, () => {
+    let elementHeight = (element) =>
+      element.getBoundingClientRect().height;
+    content.isHidden = (element) => elementHeight(element) == 0;
+    content.isVisible = (element) => elementHeight(element) > 0;
+  });
+  info("helper functions injected into frame");
+
   return {win, requestId, frame};
 }
 
 /**
  * Open a merchant tab with the given merchantTaskFn to create a PaymentRequest
  * and then open the associated PaymentRequest dialog in a new tab and run the
  * associated dialogTaskFn. The same taskArgs are passed to both functions.
  *
@@ -265,8 +297,14 @@ add_task(async function setup_head() {
     paymentSrv.cleanup();
     cleanupFormAutofillStorage();
   });
 });
 
 function deepClone(obj) {
   return JSON.parse(JSON.stringify(obj));
 }
+
+async function selectPaymentDialogShippingAddressByCountry(frame, country) {
+  await spawnPaymentDialogTask(frame,
+                               PTU.DialogContentTasks.selectShippingAddressByCountry,
+                               country);
+}