MD-Settings: Create tests for edit options in Credit Cards.

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

Index: chrome/test/data/webui/settings/settings_autofill_section_browsertest.js
diff --git a/chrome/test/data/webui/settings/settings_autofill_section_browsertest.js b/chrome/test/data/webui/settings/settings_autofill_section_browsertest.js
index 1f228594680161171de9a92ba21df959fbd53340..7f01a180d53a534455f4b4677bcd14ae0ce7fccb 100644
--- a/chrome/test/data/webui/settings/settings_autofill_section_browsertest.js
+++ b/chrome/test/data/webui/settings/settings_autofill_section_browsertest.js
@@ -433,6 +433,89 @@ TEST_F('SettingsAutofillSectionBrowserTest', 'CreditCardTests', function() {
         MockInteractions.tap(creditCardDialog.$.cancelButton);
       });
     });
+
+    test('verifyLocalCreditCardMenu', function() {
+      var creditCards = [FakeDataMaker.addressEntry()];

[dpapad, 2017/06/27 22:00:36]

Shouldn't this be calling creditCardEntry()?

Also, is there a reason to put this in an array here? Why not just wrap it in an
array at line 444, before passing it to createAutofillSection_? Same for next
test.

[hcarmona, 2017/06/27 22:26:41]

Yes, good catch.
Sounds good, updated.

+
+      // When CC is local, |isCached| will be undefined.
+      creditCards[0].metadata.isLocal = true;
+      creditCards[0].metadata.isCached = undefined;
+
+      var section = self.createAutofillSection_([], creditCards);
+      assertTrue(!!section);

[dpapad, 2017/06/27 22:00:36]

Is this assertion necessary? Can it ever fail?

[hcarmona, 2017/06/27 22:26:41]

Removed here and elsewhere.

+      var creditCardList = section.$.creditCardList;
+      assertTrue(!!creditCardList);
+      assertEquals(2, creditCardList.children.length);  // Template + Row.

[dpapad, 2017/06/27 22:00:36]

How about the following?
assertEquals(1, creditCardList.querySelectorAll('.list-item').length);

This avoids having to account for the <template> child (which is an
implementation detail of dom-repeat).

[hcarmona, 2017/06/27 22:26:41]

Done.

+      var row = creditCardList.children[0];
+
+      // Local CCs will show the overflow menu.
+      assertFalse(!!row.querySelector('#remoteCreditCardLink'));
+      var menuButton = row.querySelector('#creditCardMenu')
+      assertTrue(!!menuButton);
+
+      menuButton.click();
+      Polymer.dom.flush();
+
+      var ccMenu = section.$.creditCardSharedMenu;

[dpapad, 2017/06/27 22:00:36]

Avoid non established abbreviations (per styleguide). Maybe just rename to
|menu| here since there is no ambiguity about which menu is referenced.

[hcarmona, 2017/06/27 22:26:41]

Done.

+
+      // Menu should have 2 options.
+      assertFalse(ccMenu.querySelector('#menuEditCreditCard').hidden);
+      assertFalse(ccMenu.querySelector('#menuRemoveCreditCard').hidden);
+      assertTrue(ccMenu.querySelector('#menuClearCreditCard').hidden);
+
+      ccMenu.close();
+      Polymer.dom.flush();
+    });
+
+    test('verifyCachedCreditCardMenu', function() {
+      var creditCards = [FakeDataMaker.addressEntry()];
+
+      creditCards[0].metadata.isLocal = false;
+      creditCards[0].metadata.isCached = true;
+
+      var section = self.createAutofillSection_([], creditCards);
+      assertTrue(!!section);
+      var creditCardList = section.$.creditCardList;
+      assertTrue(!!creditCardList);
+      assertEquals(2, creditCardList.children.length);  // Template + Row.
+      var row = creditCardList.children[0];
+
+      // Cached remote CCs will show overflow menu.
+      assertFalse(!!row.querySelector('#remoteCreditCardLink'));
+      var menuButton = row.querySelector('#creditCardMenu')
+      assertTrue(!!menuButton);
+
+      menuButton.click();
+      Polymer.dom.flush();
+
+      var ccMenu = section.$.creditCardSharedMenu;
+
+      // Menu should have 2 options.
+      assertFalse(ccMenu.querySelector('#menuEditCreditCard').hidden);
+      assertTrue(ccMenu.querySelector('#menuRemoveCreditCard').hidden);
+      assertFalse(ccMenu.querySelector('#menuClearCreditCard').hidden);
+
+      ccMenu.close();
+      Polymer.dom.flush();
+    });
+
+    test('verifyNotCachedCreditCardMenu', function() {
+      var creditCards = [FakeDataMaker.addressEntry()];
+
+      creditCards[0].metadata.isLocal = false;
+      creditCards[0].metadata.isCached = false;
+
+      var section = self.createAutofillSection_([], creditCards);
+      assertTrue(!!section);
+      var creditCardList = section.$.creditCardList;
+      assertTrue(!!creditCardList);
+      assertEquals(2, creditCardList.children.length);  // Template + Row.
+      var row = creditCardList.children[0];
+
+      // No overflow menu when not cached.
+      assertTrue(!!row.querySelector('#remoteCreditCardLink'));
+      assertFalse(!!row.querySelector('#creditCardMenu'));
+    });
   });
 
   mocha.run();