MD Settings: Migrating add/edit address dropdowns to native select.

chrome/test/data/webui/settings/settings_autofill_section_browsertest.js

 // Copyright 2016 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /** @fileoverview Runs the Polymer Autofill Settings tests. */
 
 /** @const {string} Path to root from chrome/test/data/webui/settings/. */
 var ROOT_PATH = '../../../../../';
 
 // Polymer BrowserTest fixture.
@@ skipping 411 matching lines @@
         var title = dialog.$$('.title');
         assertEquals(self.i18nStrings.editAddressTitle, title.textContent);
         // Should be possible to save when editing because fields are populated.
         assertFalse(dialog.$.saveButton.disabled);
       });
     });
 
     test('verifyCountryIsSaved', function() {
       var address = FakeDataMaker.emptyAddressEntry();
       return self.createAddressDialog_(address).then(function(dialog) {
-        assertEquals(undefined, dialog.$.countryList.selected);
+        var countrySelect = dialog.$$('select');
+        assertEquals('', countrySelect.value);
         assertEquals(undefined, address.countryCode);
-        dialog.$.countryList.selected = 'US';
+        countrySelect.value = 'US';
+        countrySelect.dispatchEvent(new CustomEvent('change'));
         Polymer.dom.flush();
-        assertEquals('US', dialog.$.countryList.selected);
+        assertEquals('US', countrySelect.value);
         assertEquals('US', address.countryCode);
       });
     });
 
     test('verifyPhoneAndEmailAreSaved', function() {
       var address = FakeDataMaker.emptyAddressEntry();
       return self.createAddressDialog_(address).then(function(dialog) {
         assertEquals('', dialog.$.phoneInput.value);
         assertFalse(!!(address.phoneNumbers && address.phoneNumbers[0]));
 
@@ skipping 69 matching lines @@
             });
           }).then(function() {
             assertTrue(saveButton.disabled);
           });
         });
       });
     });
 
     // Setting the country should allow the address to be saved.
     test('verifySaveIsNotClickableIfCountryNotSet', function() {
+      var dialog = null;
+
+      var simulateCountryChange = function(countryCode) {
+        var countrySelect = dialog.$$('select');
+        countrySelect.value = countryCode;
+        countrySelect.dispatchEvent(new CustomEvent('change'));
+      };
+
       return self.createAddressDialog_(
-          FakeDataMaker.emptyAddressEntry()).then(function(dialog) {
-        var saveButton = dialog.$.saveButton;
-        var countries = dialog.$.countryList;
+          FakeDataMaker.emptyAddressEntry()).then(function(d) {
+        dialog = d;
+        assertTrue(dialog.$.saveButton.disabled);
 
-        return expectEvent(dialog, 'on-update-can-save', function() {
-          assertTrue(saveButton.disabled);
-          countries.selected = 'US';
-        }).then(function() {
-            assertFalse(saveButton.disabled);
-            countries.selected = '';
-        }).then(function() {
-          assertTrue(saveButton.disabled);
-        });
+        return expectEvent(
+            dialog, 'on-update-can-save',
+            simulateCountryChange.bind(null, 'US'));
+      }).then(function() {
+        assertFalse(dialog.$.saveButton.disabled);
+
+        return expectEvent(
+            dialog, 'on-update-can-save',
+            simulateCountryChange.bind(null, ''));
+      }).then(function() {
+        assertTrue(dialog.$.saveButton.disabled);
       });
     });
 
     // Test will timeout if save-address event is not fired.
     test('verifyDefaultCountryIsAppliedWhenSaving', function() {
       var address = FakeDataMaker.emptyAddressEntry();
       address.companyName = 'Google';
       return self.createAddressDialog_(address).then(function(dialog) {
         return expectEvent(dialog, 'save-address', function() {
           // Verify |countryCode| is not set.
@@ skipping 71 matching lines @@
         row = rows[3];
         cols = row.querySelectorAll('.address-column');
         assertEquals(3, cols.length);
         assertEquals(address.addressLevel2, cols[0].value);
         assertEquals(address.addressLevel1, cols[1].value);
         assertEquals(address.postalCode, cols[2].value);
         // Country
         row = rows[4];
         cols = row.querySelectorAll('.address-column');
         assertEquals(1, cols.length);
-        assertEquals('United States', cols[0].value);
+        var countrySelect = /** @type {!HTMLSelectElement} */ (cols[0]);
+        assertEquals(
+            'United States',
+            countrySelect.selectedOptions[0].textContent.trim());
         // Phone, Email
         row = rows[5];
         cols = row.querySelectorAll('.address-column');
         assertEquals(2, cols.length);
         assertEquals(address.phoneNumbers[0], cols[0].value);
         assertEquals(address.emailAddresses[0], cols[1].value);
       });
     });
 
     // GB address has 1 field per line for all lines that change.
@@ skipping 41 matching lines @@
         assertEquals(address.addressLevel1, cols[0].value);
         // Postal code
         row = rows[5];
         cols = row.querySelectorAll('.address-column');
         assertEquals(1, cols.length);
         assertEquals(address.postalCode, cols[0].value);
         // Country
         row = rows[6];
         cols = row.querySelectorAll('.address-column');
         assertEquals(1, cols.length);
-        assertEquals('United Kingdom', cols[0].value);
+        assertEquals(
+            'United Kingdom', cols[0].selectedOptions[0].textContent.trim());
         // Phone, Email
         row = rows[7];
         cols = row.querySelectorAll('.address-column');
         assertEquals(2, cols.length);
         assertEquals(address.phoneNumbers[0], cols[0].value);
         assertEquals(address.emailAddresses[0], cols[1].value);
       });
     });
 
     // IL address has 2 fields on the same line and is an RTL locale.
@@ skipping 32 matching lines @@
         // City, Postal code
         row = rows[3];
         cols = row.querySelectorAll('.address-column');
         assertEquals(2, cols.length);
         assertEquals(address.addressLevel2, cols[0].value);
         assertEquals(address.postalCode, cols[1].value);
         // Country
         row = rows[4];
         cols = row.querySelectorAll('.address-column');
         assertEquals(1, cols.length);
-        assertEquals('Israel', cols[0].value);
+        assertEquals(
+            'Israel', cols[0].selectedOptions[0].textContent.trim());
         // Phone, Email
         row = rows[5];
         cols = row.querySelectorAll('.address-column');
         assertEquals(2, cols.length);
         assertEquals(address.phoneNumbers[0], cols[0].value);
         assertEquals(address.emailAddresses[0], cols[1].value);
       });
     });
 
     // US has an extra field 'State'. Validate that this field is
     // persisted when switching to IL then back to US.
     test('verifyAddressPersistanceWhenSwitchingCountries', function() {
       var address = FakeDataMaker.emptyAddressEntry();
       address.countryCode = 'US';
 
       return self.createAddressDialog_(address).then(function(dialog) {
         var city = 'Los Angeles';
         var state = 'CA';
         var zip = '90291';
+        var countrySelect = dialog.$$('select');
 
         return expectEvent(dialog, 'on-update-address-wrapper', function() {
           // US:
           var rows = dialog.$.dialog.querySelectorAll('.address-row');
           assertEquals(6, rows.length);
 
           // City, State, ZIP code
           var row = rows[3];
           var cols = row.querySelectorAll('.address-column');
           assertEquals(3, cols.length);
           cols[0].value = city;
           cols[1].value = state;
           cols[2].value = zip;
 
-          dialog.$.countryList.selected = 'IL';
+          countrySelect.value = 'IL';
+          countrySelect.dispatchEvent(new CustomEvent('change'));
         }).then(function() {
           return expectEvent(dialog, 'on-update-address-wrapper', function() {
             // IL:
             rows = dialog.$.dialog.querySelectorAll('.address-row');
             assertEquals(6, rows.length);
 
             // City, Postal code
             row = rows[3];
             cols = row.querySelectorAll('.address-column');
             assertEquals(2, cols.length);
             assertEquals(city, cols[0].value);
             assertEquals(zip, cols[1].value);
 
-            dialog.$.countryList.selected = 'US';
+            countrySelect.value = 'US';
+            countrySelect.dispatchEvent(new CustomEvent('change'));
           });
         }).then(function() {
           // US:
           var rows = dialog.$.dialog.querySelectorAll('.address-row');
           assertEquals(6, rows.length);
 
           // City, State, ZIP code
           row = rows[3];
           cols = row.querySelectorAll('.address-column');
           assertEquals(3, cols.length);
           assertEquals(city, cols[0].value);
           assertEquals(state, cols[1].value);
           assertEquals(zip, cols[2].value);
         });
       });
     });
   });
 
   mocha.run();
 });