Add CupsPrintersEntryManager class to printer settings

- CupsPrintersEntryManager contains both saved and nearby printers.
- This new class handles the model manipulation of printers and calls
  on its listeners to let the views know when the models have been
  updated.
- Adds CupsPrintersEntryListBehavior to observe the change events
  from CupsPrintersEntryManager.
- Updated tests to reflect this change.

Bug: 1009659
Test: End to end manual, browsertests
Change-Id: I86f2a4d521de644a0fb4b5e3c01ef55e704642a8
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1830292Reviewed-by: Steven Bennetts <stevenjb@chromium.org>
Reviewed-by: Kyle Horimoto <khorimoto@chromium.org>
Commit-Queue: jimmy gong <jimmyxgong@chromium.org>
Cr-Commit-Position: refs/heads/master@{#705150}

chrome/browser/resources/settings/os_settings_resources.grd

@@ -775,6 +775,18 @@
       <structure name="IDR_OS_SETTINGS_CUPS_PRINTERS_ENTRY_LIST_JS"
                  file="printing_page/cups_printers_entry_list.js"
                  type="chrome_html" />
+      <structure name="IDR_OS_SETTINGS_CUPS_PRINTERS_ENTRY_LIST_BEHAVIOR_HTML"
+                 file="printing_page/cups_printers_entry_list_behavior.html"
+                 type="chrome_html" />
+      <structure name="IDR_OS_SETTINGS_CUPS_PRINTERS_ENTRY_LIST_BEHAVIOR_JS"
+                 file="printing_page/cups_printers_entry_list_behavior.js"
+                 type="chrome_html" />
+      <structure name="IDR_OS_SETTINGS_CUPS_PRINTERS_ENTRY_MANAGER_HTML"
+                 file="printing_page/cups_printers_entry_manager.html"
+                 type="chrome_html" />
+      <structure name="IDR_OS_SETTINGS_CUPS_PRINTERS_ENTRY_MANAGER_JS"
+                 file="printing_page/cups_printers_entry_manager.js"
+                 type="chrome_html" />
       <structure name="IDR_OS_SETTINGS_CUPS_PRINTERS_LIST_HTML"
                  file="printing_page/cups_printers_list.html"
                  type="chrome_html" />

chrome/browser/resources/settings/printing_page/BUILD.gn

@@ -22,6 +22,8 @@ js_type_check("closure_compile") {
       ":cups_printers_browser_proxy",
       ":cups_printers_entry",
       ":cups_printers_entry_list",
+      ":cups_printers_entry_list_behavior",
+      ":cups_printers_entry_manager",
       ":cups_printers_list",
       ":cups_saved_printers",
       ":printing_browser_proxy",
@@ -82,6 +84,9 @@ if (is_chromeos) {
     deps = [
       ":cups_printer_types",
       ":cups_printers_browser_proxy",
+      ":cups_printers_entry_list_behavior",
+      ":cups_printers_entry_manager",
+      "//ui/webui/resources/js:list_property_update_behavior",
       "//ui/webui/resources/js:web_ui_listener_behavior",
     ]
   }
@@ -102,6 +107,7 @@ if (is_chromeos) {
     deps = [
       ":cups_nearby_printers",
       ":cups_printers_browser_proxy",
+      ":cups_printers_entry_manager",
       ":cups_saved_printers",
       "..:route",
       "//ui/webui/resources/cr_components/chromeos/network:mojo_interface_provider",
@@ -136,6 +142,22 @@ if (is_chromeos) {
     ]
   }
 
+  js_library("cups_printers_entry_list_behavior") {
+    deps = [
+      ":cups_printer_types",
+      "//ui/webui/resources/js:list_property_update_behavior",
+    ]
+  }
+
+  js_library("cups_printers_entry_manager") {
+    deps = [
+      ":cups_printer_types",
+      ":cups_printers_browser_proxy",
+      "//ui/webui/resources/js:assert",
+      "//ui/webui/resources/js:cr",
+    ]
+  }
+
   js_library("cups_printers_list") {
     deps = [
       ":cups_printers_browser_proxy",
@@ -149,7 +171,10 @@ if (is_chromeos) {
     deps = [
       ":cups_printer_types",
       ":cups_printers_browser_proxy",
+      ":cups_printers_entry_list_behavior",
+      ":cups_printers_entry_manager",
       "//ui/webui/resources/cr_elements/cr_action_menu:cr_action_menu",
+      "//ui/webui/resources/js:list_property_update_behavior",
       "//ui/webui/resources/js:web_ui_listener_behavior",
     ]
   }

chrome/browser/resources/settings/printing_page/cups_nearby_printers.html

 <link rel="import" href="chrome://resources/html/polymer.html">
 
+<link rel="import" href="chrome://resources/html/list_property_update_behavior.html">
 <link rel="import" href="chrome://resources/html/web_ui_listener_behavior.html">
 <link rel="import" href="cups_printer_types.html">
 <link rel="import" href="cups_printers_browser_proxy.html">
 <link rel="import" href="cups_printers_entry_list.html">
+<link rel="import" href="cups_printers_entry_list_behavior.html">
+<link rel="import" href="cups_printers_entry_manager.html">
 <link rel="import" href="../settings_shared_css.html">
 
 <dom-module id="settings-cups-nearby-printers">
   <template>
-    <settings-cups-printers-entry-list printers="[[nearbyPrinters_]]"
+    <settings-cups-printers-entry-list printers="[[nearbyPrinters]]"
         search-term="[[searchTerm]]">
     </settings-cups-printers-entry-list>
   </template>

chrome/browser/resources/settings/printing_page/cups_nearby_printers.js

@@ -9,20 +9,16 @@
 Polymer({
   is: 'settings-cups-nearby-printers',
 
-  behaviors: [WebUIListenerBehavior],
+  // ListPropertyUpdateBehavior is used in CupsPrintersEntryListBehavior.
+  behaviors: [
+      CupsPrintersEntryListBehavior,
+      ListPropertyUpdateBehavior,
+      WebUIListenerBehavior,
+  ],
 
   properties: {
     /**
-     * @type {!Array<!PrinterListEntry>}
-     * @private
-     */
-    nearbyPrinters_: {
-      type: Array,
-      value: () => [],
-    },
-
-    /**
-     * Search term for filtering |nearbyPrinters_|.
+     * Search term for filtering |nearbyPrinters|.
      * @type {string}
      */
     searchTerm: {
@@ -30,6 +26,12 @@ Polymer({
       value: '',
     },
 
+    /** @type {?CupsPrinterInfo} */
+    activePrinter: {
+      type: Object,
+      notify: true,
+    },
+
     /**
      * @type {number}
      * @private
@@ -38,51 +40,12 @@ Polymer({
       type: Number,
       value: -1,
     },
-
-    /** @type {?CupsPrinterInfo} */
-    activePrinter: {
-      type: Object,
-      notify: true,
-    },
   },
 
   listeners: {
     'add-automatic-printer': 'onAddAutomaticPrinter_',
   },
 
-  /** @override */
-  attached: function() {
-    settings.CupsPrintersBrowserProxyImpl.getInstance()
-        .startDiscoveringPrinters();
-    this.addWebUIListener(
-        'on-nearby-printers-changed', this.onNearbyPrintersChanged_.bind(this));
-  },
-
-  /**
-   * @param {!Array<!CupsPrinterInfo>} automaticPrinters
-   * @param {!Array<!CupsPrinterInfo>} discoveredPrinters
-   * @private
-   */
-  onNearbyPrintersChanged_: function(automaticPrinters, discoveredPrinters) {
-    if (!automaticPrinters && !discoveredPrinters) {
-      return;
-    }
-
-    const printers = /** @type{!Array<!PrinterListEntry>} */ ([]);
-
-    for (const printer of automaticPrinters) {
-      printers.push({printerInfo: printer,
-                     printerType: PrinterType.AUTOMATIC});
-    }
-
-    for (const printer of discoveredPrinters) {
-      printers.push({printerInfo: printer,
-                     printerType: PrinterType.DISCOVERED});
-    }
-
-    this.nearbyPrinters_ = printers;
-  },
-
   /**
    * @param {!CustomEvent<{item: !PrinterListEntry}>} e
    * @private
@@ -106,12 +69,11 @@ Polymer({
    * @private
    */
   setActivePrinter_: function(item) {
-    this.activePrinterListEntryIndex_ =
-        this.nearbyPrinters_.findIndex(
-            printer => printer.printerInfo == item.printerInfo);
+    this.activePrinterListEntryIndex_ = this.nearbyPrinters.findIndex(
+        printer => printer.printerInfo.printerId == item.printerInfo.printerId);
 
     this.activePrinter =
-        this.get(['nearbyPrinters_', this.activePrinterListEntryIndex_])
+        this.get(['nearbyPrinters', this.activePrinterListEntryIndex_])
         .printerInfo;
   },
 

chrome/browser/resources/settings/printing_page/cups_printers.html

@@ -16,6 +16,7 @@
 <link rel="import" href="cups_add_printer_dialog.html">
 <link rel="import" href="cups_edit_printer_dialog.html">
 <link rel="import" href="cups_printer_shared_css.html">
+<link rel="import" href="cups_printers_entry_manager.html">
 <link rel="import" href="cups_printers_list.html">
 <link rel="import" href="cups_saved_printers.html">
 <link rel="import" href="cups_nearby_printers.html">
@@ -142,7 +143,6 @@
 
           <settings-cups-saved-printers id="savedPrinters"
               active-printer="{{activePrinter}}"
-              saved-printers="[[savedPrinters_]]"
               search-term="[[searchTerm]]">
           </settings-cups-saved-printers>
         </div>

chrome/browser/resources/settings/printing_page/cups_printers.js

@@ -81,11 +81,16 @@ Polymer({
   /** @private {?chromeos.networkConfig.mojom.CrosNetworkConfigRemote} */
   networkConfig_: null,
 
+  /** @private {settings.printing.CupsPrintersEntryManager} */
+  entryManager_: null,
+
   /** @override */
   created: function() {
     this.networkConfig_ =
         network_config.MojoInterfaceProviderImpl.getInstance()
             .getMojoServiceRemote();
+    this.entryManager_ =
+        settings.printing.CupsPrintersEntryManager.getInstance();
   },
 
   /** @override */
@@ -110,7 +115,6 @@ Polymer({
     this.updateCupsPrintersList_();
   },
 
-
   /**
    * settings.RouteObserverBehavior
    * @param {!settings.Route} route
@@ -119,10 +123,14 @@ Polymer({
   currentRouteChanged: function(route) {
     if (route != settings.routes.CUPS_PRINTERS) {
       cr.removeWebUIListener('on-printers-changed');
+      this.entryManager_.removeWebUIListeners();
       return;
     }
+
+    this.entryManager_.addWebUIListeners();
     cr.addWebUIListener(
         'on-printers-changed', this.onPrintersChanged_.bind(this));
+    this.updateCupsPrintersList_();
   },
 
   /**
@@ -152,13 +160,11 @@ Polymer({
     const printerName = event.detail.printerName;
     switch (event.detail.resultCode) {
       case PrinterSetupResult.SUCCESS:
-        this.updateCupsPrintersList_();
         this.addPrinterResultText_ =
             loadTimeData.getStringF('printerAddedSuccessfulMessage',
                                     printerName);
         break;
       case PrinterSetupResult.EDIT_SUCCESS:
-        this.updateCupsPrintersList_();
         this.addPrinterResultText_ =
             loadTimeData.getStringF('printerEditedSuccessfulMessage',
                                     printerName);
@@ -203,6 +209,7 @@ Polymer({
           printer => /** @type {!PrinterListEntry} */({
               printerInfo: printer,
               printerType: PrinterType.SAVED}));
+      this.entryManager_.setSavedPrintersList(this.savedPrinters_);
     } else {
       this.printers = cupsPrintersList.printerList;
     }

chrome/browser/resources/settings/printing_page/cups_printers_entry_list.js

@@ -69,12 +69,14 @@ Polymer({
     // |filteredPrinters_| is just |printers|.
     const updatedPrinters = this.searchTerm ?
         this.printers.filter(
-            item =>this.matchesSearchTerm_(item.printerInfo,this.searchTerm)) :
+            item =>
+                this.matchesSearchTerm_(item.printerInfo, this.searchTerm)) :
         this.printers.slice();
 
     updatedPrinters.sort(this.sortPrinters_);
 
-    this.updateList('filteredPrinters_', printer => printer.printerInfo,
+    this.updateList(
+        'filteredPrinters_', printer => printer.printerInfo.printerId,
         updatedPrinters);
 
     this.showNoSearchResultsMessage_ =

chrome/browser/resources/settings/printing_page/cups_printers_entry_list_behavior.html

+<link rel="import" href="cups_printer_types.html">
+<script src="cups_printers_entry_list_behavior.js"></script>
\ No newline at end of file

chrome/browser/resources/settings/printing_page/cups_printers_entry_list_behavior.js

+// Copyright 2019 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 Polymer behavior for observing CupsPrintersEntryManager events.
+ * Use this behavior if you want to receive a dynamically updated list of both
+ * saved and nearby printers.
+ */
+
+/** @polymerBehavior */
+const CupsPrintersEntryListBehavior = {
+  properties: {
+    /** @private {!settings.printing.CupsPrintersEntryManager} */
+    entryManager_: Object,
+
+    /** @type {!Array<!PrinterListEntry>} */
+    savedPrinters: {
+      type: Array,
+      value: () => [],
+    },
+
+    /** @type {!Array<!PrinterListEntry>} */
+    nearbyPrinters: {
+      type: Array,
+      value: () => [],
+    },
+  },
+
+  /** @override */
+  created: function() {
+    this.entryManager_ =
+        settings.printing.CupsPrintersEntryManager.getInstance();
+  },
+
+  /** @override */
+  attached: function() {
+    this.entryManager_.addOnSavedPrintersChangedListener(
+        this.onSavedPrintersChanged_.bind(this));
+    this.entryManager_.addOnNearbyPrintersChangedListener(
+        this.onNearbyPrintersChanged_.bind(this));
+
+    // Initialize saved and nearby printers list.
+    this.onSavedPrintersChanged_(
+        this.entryManager_.savedPrinters, [] /* printerAdded */,
+        [] /* printerRemoved */);
+    this.onNearbyPrintersChanged_(this.entryManager_.nearbyPrinters);
+  },
+
+  /** @override */
+  detached: function() {
+    this.entryManager_.removeOnSavedPrintersChangedListener(
+        this.onSavedPrintersChanged_.bind(this));
+    this.entryManager_.removeOnNearbyPrintersChangedListener(
+        this.onNearbyPrintersChanged_.bind(this));
+  },
+
+  /**
+   * Non-empty/null fields indicate the applicable change to be notified.
+   * @param {!Array<!PrinterListEntry>} savedPrinters
+   * @param {!Array<!PrinterListEntry>} addedPrinters
+   * @param {!Array<!PrinterListEntry>} removedPrinters
+   * @private
+   */
+  onSavedPrintersChanged_: function(
+      savedPrinters, addedPrinters, removedPrinters) {
+    this.updateList(
+        'savedPrinters', printer => printer.printerInfo.printerId,
+        savedPrinters);
+  },
+
+  /**
+   * @param {!Array<!PrinterListEntry>} printerList
+   * @private
+   */
+  onNearbyPrintersChanged_: function(printerList) {
+    this.updateList(
+        'nearbyPrinters', printer => printer.printerInfo.printerId,
+        printerList);
+  }
+};
\ No newline at end of file

chrome/browser/resources/settings/printing_page/cups_printers_entry_manager.html

+<link rel="import" href="chrome://resources/html/assert.html">
+<link rel="import" href="chrome://resources/html/cr.html">
+<link rel="import" href="cups_printer_types.html">
+<link rel="import" href="cups_printers_browser_proxy.html">
+<script src="cups_printers_entry_manager.js"></script>
\ No newline at end of file

chrome/browser/resources/settings/printing_page/cups_printers_entry_manager.js

+// Copyright 2019 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.
+
+/**
+ * Function which provides the client with metadata about a change
+ * to a list of saved printers. The first parameter is the updated list of
+ * printers after the change, the second parameter is the newly-added printer
+ * (if it exists), and the third parameter is the newly-removed printer
+ * (if it exists).
+ * @typedef {!function(!Array<!PrinterListEntry>, !Array<!PrinterListEntry>,
+ *     !Array<!PrinterListEntry>): void}
+ */
+let PrintersListWithDeltasCallback;
+
+/**
+ * Function which provides the client with a list that contains the nearby
+ * printers list. The parameter is the updated list of printers after any
+ * changes.
+ * @typedef {function(!Array<!PrinterListEntry>): void}
+ */
+let PrintersListCallback;
+
+cr.define('settings.printing', function() {
+  /**
+   * @param {!PrinterListEntry} first
+   * @param {!PrinterListEntry} second
+   * @return {boolean}
+   * @private
+   */
+  function arePrinterIdsEqual_(first, second) {
+    return first.printerInfo.printerId == second.printerInfo.printerId;
+  }
+
+  /**
+   * Finds the printers that are in |firstArr| but not in |secondArr|.
+   * @param {!Array<!PrinterListEntry>} firstArr
+   * @param {!Array<!PrinterListEntry>} secondArr
+   * @return {!Array<!PrinterListEntry>}
+   * @private
+   */
+  function findDifference_(firstArr, secondArr) {
+    return firstArr.filter((firstArrEntry) => {
+      return !secondArr.some(arePrinterIdsEqual_.bind(this, firstArrEntry));
+    });
+  }
+
+  /**
+   * Class for managing printer entries. Holds both Saved and Nearby printers
+   * and notifies observers of any applicable changes to either printer lists.
+   */
+  class CupsPrintersEntryManager {
+    constructor() {
+      /** @private {!Array<!PrinterListEntry>} */
+      this.savedPrinters_ = [];
+
+      /** @private {!Array<!PrinterListEntry>} */
+      this.nearbyPrinters_ = [];
+
+      /** @private {!Array<PrintersListWithDeltasCallback>} */
+      this.onSavedPrintersChangedListeners_ = [];
+
+      /** @type {!Array<PrintersListCallback>} */
+      this.onNearbyPrintersChangedListeners_ = [];
+    }
+
+    addWebUIListeners() {
+      // TODO(1005905): Add on-printers-changed listener here once legacy code
+      // is removed.
+      cr.addWebUIListener(
+          'on-nearby-printers-changed', this.setNearbyPrintersList.bind(this));
+      settings.CupsPrintersBrowserProxyImpl.getInstance()
+          .startDiscoveringPrinters();
+    }
+
+    removeWebUIListeners() {
+      cr.removeWebUIListener('on-nearby-printers-changed');
+    }
+
+    /** @return {!Array<!PrinterListEntry>} */
+    get savedPrinters() {
+      return this.savedPrinters_;
+    }
+
+    /** @return {!Array<!PrinterListEntry>} */
+    get nearbyPrinters() {
+      return this.nearbyPrinters_;
+    }
+
+    /** @param {PrintersListWithDeltasCallback} listener */
+    addOnSavedPrintersChangedListener(listener) {
+      this.onSavedPrintersChangedListeners_.push(listener);
+    }
+
+    /** @param {PrintersListWithDeltasCallback} listener */
+    removeOnSavedPrintersChangedListener(listener) {
+      this.onSavedPrintersChangedListeners_ =
+          this.onSavedPrintersChangedListeners_.filter(lis => lis != listener);
+    }
+
+    /** @param {PrintersListCallback} listener */
+    addOnNearbyPrintersChangedListener(listener) {
+      this.onNearbyPrintersChangedListeners_.push(listener);
+    }
+
+    /** @param {PrintersListCallback} listener */
+    removeOnNearbyPrintersChangedListener(listener) {
+      this.onNearbyPrintersChangedListeners_ =
+          this.onNearbyPrintersChangedListeners_.filter(lis => lis != listener);
+    }
+
+    /**
+     * Sets the saved printers list and notifies observers of any applicable
+     * changes.
+     * @param {!Array<!PrinterListEntry>} printerList
+     */
+    setSavedPrintersList(printerList) {
+      if (printerList.length > this.savedPrinters_.length) {
+        const diff = findDifference_(printerList, this.savedPrinters_);
+        this.savedPrinters_ = printerList;
+        this.notifyOnSavedPrintersChangedListeners_(
+            this.savedPrinters_, diff, [] /* printersRemoved */);
+        return;
+      }
+
+      if (printerList.length < this.savedPrinters_.length) {
+        const diff = findDifference_(this.savedPrinters_, printerList);
+        this.savedPrinters_ = printerList;
+        this.notifyOnSavedPrintersChangedListeners_(
+            this.savedPrinters_, [] /* printersAdded */, diff);
+        return;
+      }
+
+      this.savedPrinters_ = printerList;
+      this.notifyOnSavedPrintersChangedListeners_(
+          this.savedPrinters_, [] /* printersAdded */,
+          [] /* printersRemoved */);
+    }
+
+    /**
+     * Sets the nearby printers list and notifies observers of any applicable
+     * changes.
+     * @param {!Array<!CupsPrinterInfo>} automaticPrinters
+     * @param {!Array<!CupsPrinterInfo>} discoveredPrinters
+     */
+    setNearbyPrintersList(automaticPrinters, discoveredPrinters) {
+      if (!automaticPrinters && !discoveredPrinters) {
+        return;
+      }
+
+      this.nearbyPrinters_ = [];
+
+      for (const printer of automaticPrinters) {
+        this.nearbyPrinters_.push(
+            {printerInfo: printer, printerType: PrinterType.AUTOMATIC});
+      }
+
+      for (const printer of discoveredPrinters) {
+        this.nearbyPrinters_.push(
+            {printerInfo: printer, printerType: PrinterType.DISCOVERED});
+      }
+
+      this.notifyOnNearbyPrintersChangedListeners_();
+    }
+
+    /**
+     * Non-empty/null fields indicate the applicable change to be notified.
+     * @param {!Array<!PrinterListEntry>} savedPrinters
+     * @param {!Array<!PrinterListEntry>} addedPrinter
+     * @param {!Array<!PrinterListEntry>} removedPrinter
+     * @private
+     */
+    notifyOnSavedPrintersChangedListeners_(
+        savedPrinters, addedPrinter, removedPrinter) {
+      this.onSavedPrintersChangedListeners_.forEach(
+          listener => listener(savedPrinters, addedPrinter, removedPrinter));
+    }
+
+    /** @private */
+    notifyOnNearbyPrintersChangedListeners_() {
+      this.onNearbyPrintersChangedListeners_.forEach(
+          listener => listener(this.nearbyPrinters_));
+    }
+  }
+
+  cr.addSingletonGetter(CupsPrintersEntryManager);
+
+  return {
+    CupsPrintersEntryManager: CupsPrintersEntryManager,
+  };
+});
\ No newline at end of file

chrome/browser/resources/settings/printing_page/cups_saved_printers.html

 <link rel="import" href="chrome://resources/html/polymer.html">
 
 <link rel="import" href="chrome://resources/cr_elements/cr_action_menu/cr_action_menu.html">
+<link rel="import" href="chrome://resources/html/list_property_update_behavior.html">
 <link rel="import" href="chrome://resources/html/web_ui_listener_behavior.html">
 <link rel="import" href="cups_printer_types.html">
 <link rel="import" href="cups_printers_browser_proxy.html">
 <link rel="import" href="cups_printers_entry_list.html">
+<link rel="import" href="cups_printers_entry_list_behavior.html">
 <link rel="import" href="../settings_shared_css.html">
 
 <dom-module id="settings-cups-saved-printers">

chrome/browser/resources/settings/printing_page/cups_saved_printers.js

@@ -9,16 +9,14 @@
 Polymer({
   is: 'settings-cups-saved-printers',
 
+  // ListPropertyUpdateBehavior is used in CupsPrintersEntryListBehavior.
   behaviors: [
-      WebUIListenerBehavior,
+    CupsPrintersEntryListBehavior,
+    ListPropertyUpdateBehavior,
+    WebUIListenerBehavior,
   ],
 
   properties: {
-    /** @type {!Array<!PrinterListEntry>} */
-    savedPrinters: {
-      type: Array,
-    },
-
     /**
      * Search term for filtering |savedPrinters|.
      * @type {string}
@@ -28,6 +26,12 @@ Polymer({
       value: '',
     },
 
+    /** @type {?CupsPrinterInfo} */
+    activePrinter: {
+      type: Object,
+      notify: true,
+    },
+
     /**
      * @type {number}
      * @private
@@ -36,12 +40,6 @@ Polymer({
       type: Number,
       value: -1,
     },
-
-    /** @type {?CupsPrinterInfo} */
-    activePrinter: {
-      type: Object,
-      notify: true,
-    },
   },
 
   listeners: {
@@ -62,9 +60,8 @@ Polymer({
    */
   onOpenActionMenu_: function(e) {
     const item = /** @type {!PrinterListEntry} */(e.detail.item);
-    this.activePrinterListEntryIndex_ =
-        this.savedPrinters.findIndex(
-            printer => printer.printerInfo == item.printerInfo);
+    this.activePrinterListEntryIndex_ = this.savedPrinters.findIndex(
+        printer => printer.printerInfo.printerId == item.printerInfo.printerId);
     this.activePrinter =
         this.get(['savedPrinters', this.activePrinterListEntryIndex_])
         .printerInfo;
@@ -92,5 +89,6 @@ Polymer({
   /** @private */
   closeActionMenu_: function() {
     this.$$('cr-action-menu').close();
-  }
+  },
+
 });

chrome/browser/resources/settings/settings_resources.grd

@@ -987,6 +987,18 @@
         <structure name="IDR_SETTINGS_CUPS_PRINTERS_ENTRY_LIST_JS"
                    file="printing_page/cups_printers_entry_list.js"
                    type="chrome_html" />
+        <structure name="IDR_SETTINGS_CUPS_PRINTERS_ENTRY_LIST_BEHAVIOR_HTML"
+                   file="printing_page/cups_printers_entry_list_behavior.html"
+                   type="chrome_html" />
+        <structure name="IDR_SETTINGS_CUPS_PRINTERS_ENTRY_LIST_BEHAVIOR_JS"
+                   file="printing_page/cups_printers_entry_list_behavior.js"
+                   type="chrome_html" />
+        <structure name="IDR_SETTINGS_CUPS_PRINTERS_ENTRY_MANAGER_HTML"
+                   file="printing_page/cups_printers_entry_manager.html"
+                   type="chrome_html" />
+        <structure name="IDR_SETTINGS_CUPS_PRINTERS_ENTRY_MANAGER_JS"
+                   file="printing_page/cups_printers_entry_manager.js"
+                   type="chrome_html" />
         <structure name="IDR_SETTINGS_CUPS_PRINTERS_LIST_HTML"
                    file="printing_page/cups_printers_list.html"
                    type="chrome_html" />

chrome/browser/ui/webui/settings/chromeos/cups_printers_handler.cc

@@ -966,6 +966,7 @@ void CupsPrintersHandler::VerifyPpdContents(const base::FilePath& path,
 
 void CupsPrintersHandler::HandleStartDiscovery(const base::ListValue* args) {
   PRINTER_LOG(DEBUG) << "Start printer discovery";
+  AllowJavascript();
   discovery_active_ = true;
   OnPrintersChanged(PrinterClass::kAutomatic,
                     printers_manager_->GetPrinters(PrinterClass::kAutomatic));

chrome/test/data/webui/settings/chromeos/cups_printer_landing_page_tests.js

@@ -544,10 +544,6 @@ suite('CupsNearbyPrintersTests', function() {
       nearbyPrintersElement = page.$$('settings-cups-nearby-printers');
       assertTrue(!!nearbyPrintersElement);
 
-      // Assert that no printers have been detected.
-      let nearbyPrinterEntries = getPrinterEntries(nearbyPrintersElement);
-      assertEquals(0, nearbyPrinterEntries.length);
-
       // Simuluate finding nearby printers.
       cr.webUIListenerCallback(
           'on-nearby-printers-changed', automaticPrinterList,
@@ -570,10 +566,6 @@ suite('CupsNearbyPrintersTests', function() {
           nearbyPrintersElement = page.$$('settings-cups-nearby-printers');
           assertTrue(!!nearbyPrintersElement);
 
-          // Assert that no printers are detected.
-          let nearbyPrinterEntries = getPrinterEntries(nearbyPrintersElement);
-          assertEquals(0, nearbyPrinterEntries.length);
-
           // Simuluate finding nearby printers.
           cr.webUIListenerCallback(
               'on-nearby-printers-changed', automaticPrinterList,
@@ -613,10 +605,6 @@ suite('CupsNearbyPrintersTests', function() {
           nearbyPrintersElement = page.$$('settings-cups-nearby-printers');
           assertTrue(!!nearbyPrintersElement);
 
-          // Assert that there are initially no detected printers.
-          let nearbyPrinterEntries = getPrinterEntries(nearbyPrintersElement);
-          assertEquals(0, nearbyPrinterEntries.length);
-
           // Simuluate finding nearby printers.
           cr.webUIListenerCallback(
               'on-nearby-printers-changed', automaticPrinterList,