Load Passwords and Autofill in the corresponding sub page.

chrome/browser/resources/settings/passwords_and_forms_page/autofill_section.js

Index: chrome/browser/resources/settings/passwords_and_forms_page/autofill_section.js
diff --git a/chrome/browser/resources/settings/passwords_and_forms_page/autofill_section.js b/chrome/browser/resources/settings/passwords_and_forms_page/autofill_section.js
index a064ef9217cfe347ef7f2c2011176d10126d72ee..85df31ba378a01af5c9dab6bc2994a91c84f8d96 100644
--- a/chrome/browser/resources/settings/passwords_and_forms_page/autofill_section.js
+++ b/chrome/browser/resources/settings/passwords_and_forms_page/autofill_section.js
@@ -6,6 +6,148 @@
  * @fileoverview 'settings-autofill-section' is the section containing saved
  * addresses and credit cards for use in autofill.
  */
+
+/**
+ * Interface for all callbacks to the autofill API.
+ * @interface
+ */
+function AutofillManager() {}
+
+/** @typedef {chrome.autofillPrivate.AddressEntry} */
+AutofillManager.AddressEntry;
+
+/** @typedef {chrome.autofillPrivate.CreditCardEntry} */
+AutofillManager.CreditCardEntry;
+
+AutofillManager.prototype = {
+  /**
+   * Add an observer to the list of addresses.
+   * @param {function(!Array<!AutofillManager.AddressEntry>):void} listener
+   */
+  addAddressListChangedListener: assertNotReached,
+
+  /**
+   * Remove an observer from the list of addresses.
+   * @param {function(!Array<!AutofillManager.AddressEntry>):void} listener
+   */
+  removeAddressListChangedListener: assertNotReached,
+
+  /**
+   * Request the list of addresses.
+   * @param {function(!Array<!AutofillManager.AddressEntry>):void} callback
+   */
+  getAddressList: assertNotReached,
+
+  /**
+   * Saves the given address.
+   * @param {!AutofillManager.AddressEntry} address
+   */
+  saveAddress: assertNotReached,
+
+  /** @param {string} guid The guid of the address to remove.  */
+  removeAddress: assertNotReached,
+
+  /**
+   * Add an observer to the list of credit cards.
+   * @param {function(!Array<!AutofillManager.CreditCardEntry>):void} listener
+   */
+  addCreditCardListChangedListener: assertNotReached,
+
+  /**
+   * Remove an observer from the list of credit cards.
+   * @param {function(!Array<!AutofillManager.CreditCardEntry>):void} listener
+   */
+  removeCreditCardListChangedListener: assertNotReached,
+
+  /**
+   * Request the list of credit cards.
+   * @param {function(!Array<!AutofillManager.CreditCardEntry>):void} callback
+   */
+  getCreditCardList: assertNotReached,
+
+  /** @param {string} guid The GUID of the credit card to remove.  */
+  removeCreditCard: assertNotReached,
+
+  /** @param {string} guid The GUID to credit card to remove from the cache. */
+  clearCachedCreditCard: assertNotReached,
+
+  /**
+   * Saves the given credit card.
+   * @param {!AutofillManager.CreditCardEntry} creditCard
+   */
+  saveCreditCard: assertNotReached,
+};
+
+/**
+ * Implementation that accesses the private API.
+ * @implements {AutofillManager}
+ * @constructor
+ */
+function AutofillManagerImpl() {}
+cr.addSingletonGetter(AutofillManagerImpl);
+
+AutofillManagerImpl.prototype = {
+  __proto__: AutofillManager,
+
+  /** @override */
+  addAddressListChangedListener: function(listener) {
+    chrome.autofillPrivate.onAddressListChanged.addListener(listener);
+  },
+
+  /** @override */
+  removeAddressListChangedListener: function(listener) {
+    chrome.autofillPrivate.onAddressListChanged.removeListener(listener);
+  },
+
+  /** @override */
+  getAddressList: function(callback) {
+    chrome.autofillPrivate.getAddressList(callback);
+  },
+
+  /** @override */
+  saveAddress: function(address) {
+    chrome.autofillPrivate.saveAddress(address);
+  },
+
+  /** @override */
+  removeAddress: function(guid) {
+    assert(guid);
+    chrome.autofillPrivate.removeEntry(guid);
+  },
+
+  /** @override */
+  addCreditCardListChangedListener: function(listener) {
+    chrome.autofillPrivate.onCreditCardListChanged.addListener(listener);
+  },
+
+  /** @override */
+  removeCreditCardListChangedListener: function(listener) {
+    chrome.autofillPrivate.onCreditCardListChanged.removeListener(listener);
+  },
+
+  /** @override */
+  getCreditCardList: function(callback) {
+    chrome.autofillPrivate.getCreditCardList(callback);
+  },
+
+  /** @override */
+  removeCreditCard: function(guid) {
+    assert(guid);
+    chrome.autofillPrivate.removeEntry(guid);
+  },
+
+  /** @override */
+  clearCachedCreditCard: function(guid) {
+    assert(guid);
+    chrome.autofillPrivate.maskCreditCard(guid);
+  },
+
+  /** @override */
+  saveCreditCard: function(creditCard) {
+    chrome.autofillPrivate.saveCreditCard(creditCard);
+  }
+};
+
 (function() {
   'use strict';
 
@@ -17,7 +159,7 @@
     properties: {
       /**
        * An array of saved addresses.
-       * @type {!Array<!chrome.autofillPrivate.AddressEntry>}
+       * @type {!Array<!AutofillManager.AddressEntry>}
        */
       addresses: Array,
 
@@ -32,7 +174,7 @@
 
       /**
        * An array of saved credit cards.
-       * @type {!Array<!chrome.autofillPrivate.CreditCardEntry>}
+       * @type {!Array<!AutofillManager.CreditCardEntry>}
        */
       creditCards: Array,
 
@@ -46,6 +188,50 @@
       showCreditCardDialog_: Boolean,
     },
 
+    listeners: {
+      'save-address': 'saveAddress_',
+      'save-credit-card': 'saveCreditCard_',
+    },
+
+    /** @type {?function(!Array<!AutofillManager.AddressEntry>)} */
+    setAddressesListener_: null,
+
+    /** @type {?function(!Array<!AutofillManager.CreditCardEntry>)} */
+    setCreditCardsListener_: null,
+
+    /** @override */
+    ready: function() {
+      // Create listener functions.
+      this.setAddressesListener_ = function(list) {
+        this.addresses = list;
+      }.bind(this);
+
+      this.setCreditCardsListener_ = function(list) {
+        this.creditCards = list;
+      }.bind(this);
+
+      // Set the managers. These can be overridden by tests.
+      this.autofillManager_ = AutofillManagerImpl.getInstance();

[dpapad, 2017/02/14 20:43:17]

Similar issue as with the password_section.js is probably happening here. Does
the compiler even know what is the type of autofillManager_? It is not declared
anywhere. We are missing a lot of compiler checks because of this.

[hcarmona, 2017/02/15 00:13:34]

Done.

+
+      // Request initial data.
+      this.autofillManager_.getAddressList(this.setAddressesListener_);
+      this.autofillManager_.getCreditCardList(this.setCreditCardsListener_);
+
+      // Listen for changes.
+      this.autofillManager_.addAddressListChangedListener(
+          this.setAddressesListener_);
+      this.autofillManager_.addCreditCardListChangedListener(
+          this.setCreditCardsListener_);
+    },
+
+    /** @override */
+    detached: function() {
+      this.autofillManager_.removeAddressListChangedListener(
+          this.setAddressesListener_);
+      this.autofillManager_.removeCreditCardListChangedListener(
+          this.setCreditCardsListener_);
+    },
+
     /**
      * Formats the expiration date so it's displayed as MM/YYYY.
      * @param {!chrome.autofillPrivate.CreditCardEntry} item
@@ -113,7 +299,7 @@
      * @private
      */
     onMenuRemoveAddressTap_: function() {
-      this.fire('remove-address', this.activeAddress);
+      this.autofillManager_.removeAddress(this.activeAddress.guid);
       this.$.addressSharedMenu.close();
     },
 
@@ -181,7 +367,7 @@
      * @private
      */
     onMenuRemoveCreditCardTap_: function() {
-      this.fire('remove-credit-card', this.activeCreditCard);
+      this.autofillManager_.removeCreditCard(this.activeCreditCard.guid);
       this.$.creditCardSharedMenu.close();
     },
 
@@ -190,7 +376,7 @@
      * @private
      */
     onMenuClearCreditCardTap_: function() {
-      this.fire('clear-credit-card', this.activeCreditCard);
+      this.autofillManager_.clearCachedCreditCard(this.activeCreditCard.guid);
       this.$.creditCardSharedMenu.close();
     },
 
@@ -203,5 +389,23 @@
     hasSome_: function(list) {
       return !!(list && list.length);
     },
+
+    /**
+     * Listens for the save-address event, and calls the private API.
+     * @param {!Event} event
+     * @private
+     */
+    saveAddress_: function(event) {
+      this.autofillManager_.saveAddress(event.detail);
+    },
+
+    /**
+     * Listens for the save-credit-card event, and calls the private API.
+     * @param {!Event} event
+     * @private
+     */
+    saveCreditCard_: function(event) {
+      this.autofillManager_.saveCreditCard(event.detail);
+    },
   });
 })();