Bug 1484721 - Update the save button disabled state after changing the country select dropdown in the address-form. r=MattN
authorJared Wein <jwein@mozilla.com>
Fri, 31 Aug 2018 16:15:51 +0000
changeset 434271 ad88fc39b67b
parent 434270 ee00cb44157b
child 434272 5ee4ea4aee38
push id68613
push userjwein@mozilla.com
push dateFri, 31 Aug 2018 16:42:06 +0000
treeherderautoland@ad88fc39b67b [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersMattN
bugs1484721
milestone63.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1484721 - Update the save button disabled state after changing the country select dropdown in the address-form. r=MattN Differential Revision: https://phabricator.services.mozilla.com/D4470
browser/components/payments/res/containers/address-form.js
browser/components/payments/test/mochitest/test_address_form.html
--- a/browser/components/payments/res/containers/address-form.js
+++ b/browser/components/payments/res/containers/address-form.js
@@ -90,16 +90,17 @@ export default class AddressForm extends
         supportedCountries: PaymentDialogUtils.supportedCountries,
       });
 
       // The EditAddress constructor adds `input` event listeners on the same element,
       // which update field validity. By adding our event listeners after this constructor,
       // validity will be updated before our handlers get the event
       this.form.addEventListener("input", this);
       this.form.addEventListener("invalid", this);
+      this.form.addEventListener("change", this);
 
       this.body.appendChild(this.persistCheckbox);
       this.body.appendChild(this.genericErrorText);
 
       this.footer.appendChild(this.cancelButton);
       this.footer.appendChild(this.backButton);
       this.footer.appendChild(this.saveButton);
       // Only call the connected super callback(s) once our markup is fully
@@ -205,16 +206,20 @@ export default class AddressForm extends
       }
     }
 
     this.updateSaveButtonState();
   }
 
   handleEvent(event) {
     switch (event.type) {
+      case "change": {
+        this.updateSaveButtonState();
+        break;
+      }
       case "click": {
         this.onClick(event);
         break;
       }
       case "input": {
         this.onInput(event);
         break;
       }
--- a/browser/components/payments/test/mochitest/test_address_form.html
+++ b/browser/components/payments/test/mochitest/test_address_form.html
@@ -136,16 +136,21 @@ add_task(async function test_saveButton(
   let fieldsVisiblyInvalid = form.querySelectorAll(":-moz-ui-invalid");
   is(fieldsVisiblyInvalid.length, 1, "Check 1 field visibly invalid after blanking and blur");
   is(fieldsVisiblyInvalid[0].id, "street-address", "Check #street-address is visibly invalid");
 
   fillField(form.form.querySelector("#street-address"), "404 Internet Super Highway");
   is(form.querySelectorAll(":-moz-ui-invalid").length, 0, "Check no fields visibly invalid");
   ok(!form.saveButton.disabled, "Save button is enabled after re-filling street-address");
 
+  fillField(form.form.querySelector("#country"), "CA");
+  ok(form.saveButton.disabled, "Save button is disabled after changing the country to Canada");
+  fillField(form.form.querySelector("#country"), "US");
+  ok(!form.saveButton.disabled, "Save button is enabled after changing the country to US");
+
   let messagePromise = promiseContentToChromeMessage("updateAutofillRecord");
   is(form.saveButton.textContent, "Add", "Check label");
   form.saveButton.scrollIntoView();
   synthesizeMouseAtCenter(form.saveButton, {});
 
   let details = await messagePromise;
   ok(typeof(details.messageID) == "number" && details.messageID > 0, "Check messageID type");
   delete details.messageID;