Use mojo API in Settings>Internet: cr_network_listener_behavior.js

This is a signficant re-factor of cr_network_listener_behavior.js
intended to simplify the implementations.

When the behavior was introduced it was intended to share some code
intended to reduce the overhead and complexity of binding extension
observers to each internet page element that needed to know about
network changes.

With Mojo the overhead is very lightweight, and the binding code can be
shared in the behavior.

Bug: 853953
Change-Id: Ieb866b7dd24f652e0625809b95840a0aaa760c75
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1654231
Commit-Queue: Steven Bennetts <stevenjb@chromium.org>
Reviewed-by: Kyle Horimoto <khorimoto@chromium.org>
Cr-Commit-Position: refs/heads/master@{#669759}
diff --git a/chrome/browser/resources/settings/internet_page/BUILD.gn b/chrome/browser/resources/settings/internet_page/BUILD.gn
index 29c26dab..a5443e5 100644
--- a/chrome/browser/resources/settings/internet_page/BUILD.gn
+++ b/chrome/browser/resources/settings/internet_page/BUILD.gn
@@ -27,7 +27,6 @@
     "../settings_page:settings_animated_pages",
     "//chromeos/services/network_config/public/mojom:mojom_js_library_for_compile",
     "//ui/webui/resources/cr_components/chromeos/network:mojo_interface_provider",
-    "//ui/webui/resources/cr_elements/chromeos/network:cr_network_listener_behavior",
     "//ui/webui/resources/cr_elements/chromeos/network:cr_onc_types",
     "//ui/webui/resources/js:assert",
     "//ui/webui/resources/js:i18n_behavior",
@@ -67,6 +66,7 @@
     ":internet_page_browser_proxy",
     ":tether_connection_dialog",
     "..:route",
+    "//ui/webui/resources/cr_elements/chromeos/network:cr_network_listener_behavior",
     "//ui/webui/resources/cr_elements/chromeos/network:cr_onc_types",
     "//ui/webui/resources/cr_elements/policy:cr_policy_network_behavior",
     "//ui/webui/resources/js:assert",
@@ -81,6 +81,7 @@
 
 js_library("internet_known_networks_page") {
   deps = [
+    "//ui/webui/resources/cr_elements/chromeos/network:cr_network_listener_behavior",
     "//ui/webui/resources/cr_elements/chromeos/network:cr_onc_types",
     "//ui/webui/resources/cr_elements/cr_action_menu:cr_action_menu",
     "//ui/webui/resources/cr_elements/policy:cr_policy_network_behavior",
@@ -94,6 +95,7 @@
   deps = [
     ":internet_page_browser_proxy",
     "..:route",
+    "//ui/webui/resources/cr_elements/chromeos/network:cr_network_listener_behavior",
     "//ui/webui/resources/cr_elements/chromeos/network:cr_onc_types",
     "//ui/webui/resources/cr_elements/policy:cr_policy_network_behavior",
     "//ui/webui/resources/js:assert",
@@ -118,6 +120,7 @@
 
 js_library("network_summary") {
   deps = [
+    "//ui/webui/resources/cr_elements/chromeos/network:cr_network_listener_behavior",
     "//ui/webui/resources/cr_elements/chromeos/network:cr_onc_types",
     "//ui/webui/resources/cr_elements/policy:cr_policy_network_behavior",
     "//ui/webui/resources/js:assert",
diff --git a/chrome/browser/resources/settings/internet_page/internet_config.js b/chrome/browser/resources/settings/internet_page/internet_config.js
index 97cca74..0b3760d 100644
--- a/chrome/browser/resources/settings/internet_page/internet_config.js
+++ b/chrome/browser/resources/settings/internet_page/internet_config.js
@@ -113,7 +113,6 @@
    */
   onClose_: function(event) {
     this.close();
-    this.fire('networks-changed');
     event.stopPropagation();
   },
 
diff --git a/chrome/browser/resources/settings/internet_page/internet_detail_page.html b/chrome/browser/resources/settings/internet_page/internet_detail_page.html
index a380b921..a6b78bae 100644
--- a/chrome/browser/resources/settings/internet_page/internet_detail_page.html
+++ b/chrome/browser/resources/settings/internet_page/internet_detail_page.html
@@ -7,6 +7,7 @@
 <link rel="import" href="chrome://resources/cr_components/chromeos/network/network_property_list.html">
 <link rel="import" href="chrome://resources/cr_components/chromeos/network/network_siminfo.html">
 <link rel="import" href="chrome://resources/cr_elements/chromeos/network/cr_network_icon.html">
+<link rel="import" href="chrome://resources/cr_elements/chromeos/network/cr_network_listener_behavior.html">
 <link rel="import" href="chrome://resources/cr_elements/chromeos/network/cr_onc_types.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_button/cr_button.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_expand_button/cr_expand_button.html">
diff --git a/chrome/browser/resources/settings/internet_page/internet_detail_page.js b/chrome/browser/resources/settings/internet_page/internet_detail_page.js
index 090c91a9..abf4d55 100644
--- a/chrome/browser/resources/settings/internet_page/internet_detail_page.js
+++ b/chrome/browser/resources/settings/internet_page/internet_detail_page.js
@@ -13,8 +13,12 @@
 Polymer({
   is: 'settings-internet-detail-page',
 
-  behaviors:
-      [CrPolicyNetworkBehavior, settings.RouteObserverBehavior, I18nBehavior],
+  behaviors: [
+    CrNetworkListenerBehavior,
+    CrPolicyNetworkBehavior,
+    settings.RouteObserverBehavior,
+    I18nBehavior,
+  ],
 
   properties: {
     /** The network GUID to display details for. */
@@ -65,9 +69,9 @@
 
     /**
      * Whether the network has been lost (e.g., has gone out of range). A
-     * network is considered to be lost when a 'network-list-changed' event
-     * occurs, and the new network list does not contain the GUID of the current
-     * network.
+     * network is considered to be lost when a OnNetworkStateListChanged
+     * is signaled and the new network list does not contain the GUID of the
+     * current network.
      * @private
      */
     outOfRange_: {
@@ -178,11 +182,6 @@
     'autoConnectChanged_(autoConnect_.*)', 'alwaysOnVpnChanged_(alwaysOnVpn_.*)'
   ],
 
-  listeners: {
-    'network-list-changed': 'checkNetworkExists_',
-    'networks-changed': 'updateNetworkDetails_'
-  },
-
   /** @private {boolean} */
   didSetFocus_: false,
 
@@ -276,7 +275,33 @@
     });
   },
 
-  /** @param {!chrome.networkingPrivate.GlobalPolicy} globalPolicy */
+  /**
+   * CrosNetworkConfigObserver impl
+   * @param {!Array<chromeos.networkConfig.mojom.NetworkStateProperties>}
+   *     networks
+   */
+  onActiveNetworksChanged: function(networks) {
+    if (networks.find(network => network.guid == this.guid)) {
+      this.getNetworkDetails_();
+    }
+  },
+
+  /** CrosNetworkConfigObserver impl */
+  onNetworkStateListChanged: function() {
+    this.checkNetworkExists_();
+  },
+
+  /** CrosNetworkConfigObserver impl */
+  onDeviceStateListChanged: function() {
+    if (this.guid) {
+      this.getNetworkDetails_();
+    }
+  },
+
+  /**
+   * @param {!chrome.networkingPrivate.GlobalPolicy} globalPolicy
+   * @private
+   */
   globalPolicyChanged_: function(globalPolicy) {
     this.updateAutoConnectPref_(
         !!(this.autoConnect_ && this.autoConnect_.value), globalPolicy);
@@ -384,24 +409,25 @@
     this.setNetworkProperties_(onc);
   },
 
-  /**
-   * @param {!CustomEvent<!Array<string>>} event
-   * @private
-   */
-  checkNetworkExists_: function(event) {
-    const networkIds = event.detail;
-    this.outOfRange_ = networkIds.indexOf(this.guid) == -1;
-  },
-
-  /**
-   * @param {!CustomEvent<!Array<string>>} event
-   * @private
-   */
-  updateNetworkDetails_: function(event) {
-    const networkIds = event.detail;
-    if (networkIds.indexOf(this.guid) != -1) {
-      this.getNetworkDetails_();
-    }
+  /** @private */
+  checkNetworkExists_: function() {
+    const filter = {
+      networkType: CrOnc.Type.ALL,
+      visible: true,
+      configured: false
+    };
+    this.networkingPrivate.getNetworks(filter, networks => {
+      if (networks.find(network => network.GUID == this.guid)) {
+        return;
+      }
+      this.outOfRange_ = true;
+      if (this.networkProperties_) {
+        // Set the connection state since we won't receive an update for a non
+        // existent network.
+        this.networkProperties_.ConnectionState =
+            CrOnc.ConnectionState.NOT_CONNECTED;
+      }
+    });
   },
 
   /**
@@ -444,7 +470,7 @@
     }
 
     if (!properties) {
-      console.error('No properties for: ' + this.guid);
+      // Edge case, may occur when disabling. Close this.
       this.close();
       return;
     }
@@ -467,9 +493,7 @@
    */
   getStateCallback_: function(state) {
     if (!state) {
-      // If |state| is null, the network is no longer visible, close this.
-      console.error('Network no longer exists: ' + this.guid);
-      this.networkProperties_ = undefined;
+      // Edge case, may occur when disabling. Close this.
       this.close();
       return;
     }
@@ -850,8 +874,7 @@
   /** @private */
   updateAlwaysOnVpnPrefValue_: function() {
     this.alwaysOnVpn_.value = this.prefs.arc && this.prefs.arc.vpn &&
-        this.prefs.arc.vpn.always_on &&
-        this.prefs.arc.vpn.always_on.lockdown &&
+        this.prefs.arc.vpn.always_on && this.prefs.arc.vpn.always_on.lockdown &&
         this.prefs.arc.vpn.always_on.lockdown.value;
   },
 
@@ -868,8 +891,7 @@
     // Only mark VPN networks as enforced. This fake pref also controls the
     // policy indicator on the connect/disconnect buttons, so it shouldn't be
     // shown on non-VPN networks.
-    if (this.isVpn_(this.networkProperties_) &&
-        this.prefs.vpn_config_allowed &&
+    if (this.isVpn_(this.networkProperties_) && this.prefs.vpn_config_allowed &&
         !this.prefs.vpn_config_allowed.value) {
       fakeAlwaysOnVpnEnforcementPref.enforcement =
           chrome.settingsPrivate.Enforcement.ENFORCED;
diff --git a/chrome/browser/resources/settings/internet_page/internet_known_networks_page.html b/chrome/browser/resources/settings/internet_page/internet_known_networks_page.html
index 3685d4c..c9db328 100644
--- a/chrome/browser/resources/settings/internet_page/internet_known_networks_page.html
+++ b/chrome/browser/resources/settings/internet_page/internet_known_networks_page.html
@@ -1,5 +1,6 @@
 <link rel="import" href="chrome://resources/html/polymer.html">
 
+<link rel="import" href="chrome://resources/cr_elements/chromeos/network/cr_network_listener_behavior.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_action_menu/cr_action_menu.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_icon_button/cr_icon_button.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_link_row/cr_link_row.html">
diff --git a/chrome/browser/resources/settings/internet_page/internet_known_networks_page.js b/chrome/browser/resources/settings/internet_page/internet_known_networks_page.js
index f5196b0..b52f897d3 100644
--- a/chrome/browser/resources/settings/internet_page/internet_known_networks_page.js
+++ b/chrome/browser/resources/settings/internet_page/internet_known_networks_page.js
@@ -10,7 +10,10 @@
 Polymer({
   is: 'settings-internet-known-networks-page',
 
-  behaviors: [CrPolicyNetworkBehavior],
+  behaviors: [
+    CrNetworkListenerBehavior,
+    CrPolicyNetworkBehavior,
+  ],
 
   properties: {
     /**
@@ -54,11 +57,14 @@
     enableForget_: Boolean,
   },
 
-  listeners: {'network-list-changed': 'refreshNetworks_'},
-
   /** @private {string} */
   selectedGuid_: '',
 
+  /** CrosNetworkConfigObserver impl */
+  onNetworkStateListChanged: function() {
+    this.refreshNetworks_();
+  },
+
   /** @private */
   networkTypeChanged_: function() {
     this.refreshNetworks_();
diff --git a/chrome/browser/resources/settings/internet_page/internet_page.html b/chrome/browser/resources/settings/internet_page/internet_page.html
index 59e490d..063144d 100644
--- a/chrome/browser/resources/settings/internet_page/internet_page.html
+++ b/chrome/browser/resources/settings/internet_page/internet_page.html
@@ -1,7 +1,6 @@
 <link rel="import" href="chrome://resources/html/polymer.html">
 
 <link rel="import" href="chrome://resources/cr_components/chromeos/network/mojo_interface_provider.html">
-<link rel="import" href="chrome://resources/cr_elements/chromeos/network/cr_network_listener_behavior.html">
 <link rel="import" href="chrome://resources/cr_elements/chromeos/network/cr_onc_types.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_expand_button/cr_expand_button.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_icon_button/cr_icon_button.html">
diff --git a/chrome/browser/resources/settings/internet_page/internet_page.js b/chrome/browser/resources/settings/internet_page/internet_page.js
index 016b3f4e4..da5717c 100644
--- a/chrome/browser/resources/settings/internet_page/internet_page.js
+++ b/chrome/browser/resources/settings/internet_page/internet_page.js
@@ -11,8 +11,9 @@
   is: 'settings-internet-page',
 
   behaviors: [
-    I18nBehavior, settings.RouteObserverBehavior, WebUIListenerBehavior,
-    CrNetworkListenerBehavior
+    I18nBehavior,
+    settings.RouteObserverBehavior,
+    WebUIListenerBehavior,
   ],
 
   properties: {
@@ -93,31 +94,6 @@
       value: false,
     },
 
-    /** Overridden from NetworkListenerBehavior. */
-    networkListChangeSubscriberSelectors_: {
-      type: Array,
-      value: function() {
-        return [
-          'network-summary',
-          'settings-internet-detail-page',
-          'settings-internet-known-networks-page',
-          'settings-internet-subpage',
-        ];
-      }
-    },
-
-    /** Overridden from NetworkListenerBehavior. */
-    networksChangeSubscriberSelectors_: {
-      type: Array,
-      value: function() {
-        return [
-          'network-summary',
-          'settings-internet-detail-page',
-          'settings-internet-subpage',
-        ];
-      }
-    },
-
     /**
      * List of third party VPN providers.
      * @type {!Array<!chrome.networkingPrivate.ThirdPartyVPNProperties>}
diff --git a/chrome/browser/resources/settings/internet_page/internet_subpage.html b/chrome/browser/resources/settings/internet_page/internet_subpage.html
index 6378a878..0cc871e 100644
--- a/chrome/browser/resources/settings/internet_page/internet_subpage.html
+++ b/chrome/browser/resources/settings/internet_page/internet_subpage.html
@@ -1,6 +1,7 @@
 <link rel="import" href="chrome://resources/html/polymer.html">
 
 <link rel="import" href="chrome://resources/cr_elements/chromeos/network/cr_network_list.html">
+<link rel="import" href="chrome://resources/cr_elements/chromeos/network/cr_network_listener_behavior.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_icon_button/cr_icon_button.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_link_row/cr_link_row.html">
 <link rel="import" href="chrome://resources/cr_elements/cr_toggle/cr_toggle.html">
diff --git a/chrome/browser/resources/settings/internet_page/internet_subpage.js b/chrome/browser/resources/settings/internet_page/internet_subpage.js
index a7e399e..1e47c0dd 100644
--- a/chrome/browser/resources/settings/internet_page/internet_subpage.js
+++ b/chrome/browser/resources/settings/internet_page/internet_subpage.js
@@ -11,6 +11,7 @@
   is: 'settings-internet-subpage',
 
   behaviors: [
+    CrNetworkListenerBehavior,
     CrPolicyNetworkBehavior,
     settings.RouteObserverBehavior,
     I18nBehavior,
@@ -125,11 +126,6 @@
     },
   },
 
-  listeners: {
-    'network-list-changed': 'getNetworkStateList_',
-    'networks-changed': 'getNetworkStateList_',
-  },
-
   observers: ['deviceStateChanged_(networkingPrivate, deviceState)'],
 
   /** @private {number|null} */
@@ -174,6 +170,20 @@
     this.updateScanning_();
   },
 
+  /**
+   * CrosNetworkConfigObserver impl
+   * @param {!Array<chromeos.networkConfig.mojom.NetworkStateProperties>}
+   *     networks
+   */
+  onActiveNetworksChanged: function(networks) {
+    this.getNetworkStateList_();
+  },
+
+  /** CrosNetworkConfigObserver impl */
+  onNetworkStateListChanged: function() {
+    this.getNetworkStateList_();
+  },
+
   /** @private */
   deviceStateChanged_: function() {
     this.showSpinner =
diff --git a/chrome/browser/resources/settings/internet_page/network_summary.html b/chrome/browser/resources/settings/internet_page/network_summary.html
index f31a25c..ed9f6e73 100644
--- a/chrome/browser/resources/settings/internet_page/network_summary.html
+++ b/chrome/browser/resources/settings/internet_page/network_summary.html
@@ -1,5 +1,6 @@
 <link rel="import" href="chrome://resources/html/polymer.html">
 
+<link rel="import" href="chrome://resources/cr_elements/chromeos/network/cr_network_listener_behavior.html">
 <link rel="import" href="chrome://resources/cr_elements/chromeos/network/cr_onc_types.html">
 <link rel="import" href="chrome://resources/cr_elements/policy/cr_policy_network_behavior.html">
 <link rel="import" href="network_summary_item.html">
diff --git a/chrome/browser/resources/settings/internet_page/network_summary.js b/chrome/browser/resources/settings/internet_page/network_summary.js
index 4bdfa6b5..e28764d 100644
--- a/chrome/browser/resources/settings/internet_page/network_summary.js
+++ b/chrome/browser/resources/settings/internet_page/network_summary.js
@@ -32,7 +32,10 @@
 Polymer({
   is: 'network-summary',
 
-  behaviors: [CrPolicyNetworkBehavior],
+  behaviors: [
+    CrNetworkListenerBehavior,
+    CrPolicyNetworkBehavior,
+  ],
 
   properties: {
     /**
@@ -91,18 +94,6 @@
     },
   },
 
-  listeners: {
-    'network-list-changed': 'getNetworkLists_',
-    'networks-changed': 'updateActiveNetworks_',
-  },
-
-  /**
-   * Listener function for chrome.networkingPrivate.onDeviceStateListChanged
-   * event.
-   * @private {?function(!Array<string>)}
-   */
-  deviceStateListChangedListener_: null,
-
   /**
    * Set of GUIDs identifying active networks, one for each type.
    * @private {?Set<string>}
@@ -112,43 +103,35 @@
   /** @override */
   attached: function() {
     this.getNetworkLists_();
-
-    this.deviceStateListChangedListener_ =
-        this.deviceStateListChangedListener_ ||
-        this.onDeviceStateListChangedEvent_.bind(this);
-    this.networkingPrivate.onDeviceStateListChanged.addListener(
-        this.deviceStateListChangedListener_);
-  },
-
-  /** @override */
-  detached: function() {
-    this.networkingPrivate.onDeviceStateListChanged.removeListener(
-        assert(this.deviceStateListChangedListener_));
   },
 
   /**
-   * networkingPrivate.onDeviceStateListChanged event callback.
-   * @private
+   * CrosNetworkConfigObserver impl
+   * @param {!Array<chromeos.networkConfig.mojom.NetworkStateProperties>}
+   *     networks
    */
-  onDeviceStateListChangedEvent_: function() {
-    this.getNetworkLists_();
-  },
-
-  /**
-   * @param {!CustomEvent<!Array<string>>} event
-   * @private
-   */
-  updateActiveNetworks_: function(event) {
+  onActiveNetworksChanged: function(networks) {
     if (!this.activeNetworkIds_) {
+      // Initial list of networks not received yet.
       return;
-    }  // Initial list of networks not received yet.
-    const networkIds = event.detail;
-    networkIds.forEach(function(id) {
+    }
+    networks.forEach(network => {
+      const id = network.guid;
       if (this.activeNetworkIds_.has(id)) {
         this.networkingPrivate.getState(
             id, this.getActiveStateCallback_.bind(this, id));
       }
-    }, this);
+    });
+  },
+
+  /** CrosNetworkConfigObserver impl */
+  onNetworkStateListChanged: function() {
+    this.getNetworkLists_();
+  },
+
+  /** CrosNetworkConfigObserver impl */
+  onDeviceStateListChanged: function() {
+    this.getNetworkLists_();
   },
 
   /**
diff --git a/chrome/browser/resources/settings/multidevice_page/BUILD.gn b/chrome/browser/resources/settings/multidevice_page/BUILD.gn
index f00e9cb..6f6bd02 100644
--- a/chrome/browser/resources/settings/multidevice_page/BUILD.gn
+++ b/chrome/browser/resources/settings/multidevice_page/BUILD.gn
@@ -108,6 +108,7 @@
     deps = [
       ":multidevice_feature_behavior",
       "..:route",
+      "//ui/webui/resources/cr_elements/chromeos/network:cr_network_listener_behavior",
       "//ui/webui/resources/cr_elements/chromeos/network:cr_onc_types",
     ]
     externs_list = [ "$externs_path/networking_private.js" ]
diff --git a/chrome/browser/resources/settings/multidevice_page/multidevice_subpage.js b/chrome/browser/resources/settings/multidevice_page/multidevice_subpage.js
index 08bc3dfb..11bea12e 100644
--- a/chrome/browser/resources/settings/multidevice_page/multidevice_subpage.js
+++ b/chrome/browser/resources/settings/multidevice_page/multidevice_subpage.js
@@ -12,10 +12,7 @@
 Polymer({
   is: 'settings-multidevice-subpage',
 
-  behaviors: [
-    MultiDeviceFeatureBehavior,
-    CrNetworkListenerBehavior,
-  ],
+  behaviors: [MultiDeviceFeatureBehavior],
 
   properties: {
     /**
@@ -32,18 +29,6 @@
       type: Object,
       value: chrome.networkingPrivate,
     },
-
-    /** Overridden from NetworkListenerBehavior. */
-    networkListChangeSubscriberSelectors_: {
-      type: Array,
-      value: () => ['settings-multidevice-tether-item'],
-    },
-
-    /** Overridden from NetworkListenerBehavior. */
-    networksChangeSubscriberSelectors_: {
-      type: Array,
-      value: () => ['settings-multidevice-tether-item'],
-    },
   },
 
   /** @private {?settings.MultiDeviceBrowserProxy} */
@@ -140,9 +125,10 @@
    * @private
    */
   isAndroidMessagesSetupButtonDisabled_: function() {
-    const messagesFeatureState = this.getFeatureState(
-        settings.MultiDeviceFeature.MESSAGES);
-    return !this.isSuiteOn() ||  messagesFeatureState ===
+    const messagesFeatureState =
+        this.getFeatureState(settings.MultiDeviceFeature.MESSAGES);
+    return !this.isSuiteOn() ||
+        messagesFeatureState ===
         settings.MultiDeviceFeatureState.PROHIBITED_BY_POLICY;
   }
 });
diff --git a/chrome/browser/resources/settings/multidevice_page/multidevice_tether_item.html b/chrome/browser/resources/settings/multidevice_page/multidevice_tether_item.html
index 42431eb..6475b01 100644
--- a/chrome/browser/resources/settings/multidevice_page/multidevice_tether_item.html
+++ b/chrome/browser/resources/settings/multidevice_page/multidevice_tether_item.html
@@ -2,6 +2,7 @@
 
 <link rel="import" href="chrome://resources/cr_elements/chromeos/network/cr_onc_types.html">
 <link rel="import" href="chrome://resources/cr_elements/chromeos/network/cr_network_icon.html">
+<link rel="import" href="chrome://resources/cr_elements/chromeos/network/cr_network_listener_behavior.html">
 <link rel="import" href="../i18n_setup.html">
 <link rel="import" href="../route.html">
 <link rel="import" href="../settings_shared_css.html">
diff --git a/chrome/browser/resources/settings/multidevice_page/multidevice_tether_item.js b/chrome/browser/resources/settings/multidevice_page/multidevice_tether_item.js
index a5c84407..210705b 100644
--- a/chrome/browser/resources/settings/multidevice_page/multidevice_tether_item.js
+++ b/chrome/browser/resources/settings/multidevice_page/multidevice_tether_item.js
@@ -14,7 +14,10 @@
 Polymer({
   is: 'settings-multidevice-tether-item',
 
-  behaviors: [MultiDeviceFeatureBehavior],
+  behaviors: [
+    CrNetworkListenerBehavior,
+    MultiDeviceFeatureBehavior,
+  ],
 
   properties: {
     /**
@@ -62,54 +65,25 @@
     },
   },
 
-  listeners: {
-    'network-list-changed': 'updateTetherNetworkState_',
-    // network-changed is fired by the settings-multidevice-subpage element's
-    // CrNetworkListenerBehavior.
-    // TODO (jordynass): Refactor to allow this element to listen to network
-    // changes without requiring the settings-multidevice-subpage to communicate
-    // with the networkingPrivate API.
-    'networks-changed': 'onNetworksChanged_',
-  },
-
-  /**
-   * Listener function for chrome.networkingPrivate.onDeviceStateListChanged
-   * event.
-   * @private {?function(!Array<string>)}
-   */
-  deviceStateListChangedListener_: null,
-
   /** @override */
   attached: function() {
     this.updateTetherDeviceState_();
     this.updateTetherNetworkState_();
-
-    this.deviceStateListChangedListener_ =
-        this.deviceStateListChangedListener_ ||
-        this.updateTetherDeviceState_.bind(this);
-    this.networkingPrivate_.onDeviceStateListChanged.addListener(
-        this.deviceStateListChangedListener_);
-  },
-
-  /** @override */
-  detached: function() {
-    this.networkingPrivate_.onDeviceStateListChanged.removeListener(
-        assert(this.deviceStateListChangedListener_));
   },
 
   /**
-   * Callback for the a network changing state. Note that any change to leading
-   * to a new active network would fire the 'network-list-changed' event,
-   * triggering updateTetherNetworkState_ and rendering this callback
-   * redundant. As a result, we return early if the active network is not
-   * changed.
-   * @param {!CustomEvent<!Array<string>>} event stores an array of the GUIDs of
-   *     all networks that changed in its detail property.
+   * CrosNetworkConfigObserver impl
+   * Note that any change to leading to a new active network will also trigger
+   * onNetworkStateListChanged, triggering updateTetherNetworkState_ and
+   * rendering this callback redundant. As a result, we return early if the
+   * active network is not changed.
+   * @param {!Array<chromeos.networkConfig.mojom.NetworkStateProperties>}
+   *     networks
    * @private
    */
-  onNetworksChanged_: function(event) {
+  onActiveNetworksChanged: function(networks) {
     const id = this.activeNetworkState_.GUID;
-    if (!event.detail.includes(id)) {
+    if (!networks.find(network => network.guid == id)) {
       return;
     }
     this.networkingPrivate_.getState(id, newNetworkState => {
@@ -127,6 +101,16 @@
     });
   },
 
+  /** CrosNetworkConfigObserver impl */
+  onNetworkStateListChanged: function() {
+    this.updateTetherNetworkState_();
+  },
+
+  /** CrosNetworkConfigObserver impl */
+  onDeviceStateListChanged: function() {
+    this.updateTetherDeviceState_();
+  },
+
   /**
    * Retrieves device states (CrOnc.DeviceStateProperties) and sets
    * this.deviceState_ to the retrieved Instant Tethering state (or undefined if
diff --git a/chrome/browser/ui/webui/settings/settings_ui.cc b/chrome/browser/ui/webui/settings/settings_ui.cc
index 61d1075..7b8f140 100644
--- a/chrome/browser/ui/webui/settings/settings_ui.cc
+++ b/chrome/browser/ui/webui/settings/settings_ui.cc
@@ -119,7 +119,7 @@
 #include "chromeos/constants/chromeos_pref_names.h"
 #include "chromeos/constants/chromeos_switches.h"
 #include "chromeos/services/multidevice_setup/public/cpp/prefs.h"
-#include "chromeos/services/network_config/public/mojom/constants.mojom.h"
+#include "chromeos/services/network_config/public/mojom/constants.mojom.h"  // nogncheck
 #include "components/arc/arc_util.h"
 #include "components/prefs/pref_service.h"
 #include "services/service_manager/public/cpp/connector.h"
diff --git a/chrome/browser/ui/webui/settings/settings_ui.h b/chrome/browser/ui/webui/settings/settings_ui.h
index 45703738..16d535fe 100644
--- a/chrome/browser/ui/webui/settings/settings_ui.h
+++ b/chrome/browser/ui/webui/settings/settings_ui.h
@@ -10,7 +10,7 @@
 #include "chrome/browser/ui/webui/webui_load_timer.h"
 
 #if defined(OS_CHROMEOS)
-#include "chromeos/services/network_config/public/mojom/cros_network_config.mojom.h"
+#include "chromeos/services/network_config/public/mojom/cros_network_config.mojom.h"  // nogncheck
 #include "ui/webui/mojo_web_ui_controller.h"
 #else
 #include "content/public/browser/web_ui_controller.h"
diff --git a/chrome/test/data/webui/chromeos/fake_network_config_mojom.js b/chrome/test/data/webui/chromeos/fake_network_config_mojom.js
index 13cfbde..a71ab23 100644
--- a/chrome/test/data/webui/chromeos/fake_network_config_mojom.js
+++ b/chrome/test/data/webui/chromeos/fake_network_config_mojom.js
@@ -14,6 +14,28 @@
   /** @param {!NetworkingPrivate} extensionApi */
   constructor(extensionApi) {
     this.extensionApi_ = extensionApi;
+
+    this.observers_ = [];
+    extensionApi.onNetworkListChanged.addListener(
+        this.onNetworkListChanged.bind(this));
+    extensionApi.onDeviceStateListChanged.addListener(
+        this.onDeviceStateListChanged.bind(this));
+  }
+
+  onNetworkListChanged(networks) {
+    this.observers_.forEach(o => o.onNetworkStateListChanged());
+  }
+
+  onDeviceStateListChanged() {
+    this.observers_.forEach(o => o.onDeviceStateListChanged());
+  }
+
+  /**
+   * @param { !chromeos.networkConfig.mojom.CrosNetworkConfigObserverProxy }
+   *     observer
+   */
+  addObserver(observer) {
+    this.observers_.push(observer);
   }
 
   /**
diff --git a/chrome/test/data/webui/settings/internet_page_tests.js b/chrome/test/data/webui/settings/internet_page_tests.js
index 760c68f..8d5d433 100644
--- a/chrome/test/data/webui/settings/internet_page_tests.js
+++ b/chrome/test/data/webui/settings/internet_page_tests.js
@@ -56,9 +56,8 @@
 
   function flushAsync() {
     Polymer.dom.flush();
-    return new Promise(resolve => {
-      internetPage.async(resolve);
-    });
+    // Use setTimeout to wait for the next macrotask.
+    return new Promise(resolve => setTimeout(resolve));
   }
 
   function setNetworksForTest(networks) {
@@ -88,6 +87,14 @@
   });
 
   teardown(function() {
+    const subPage = internetPage.$$('settings-internet-subpage');
+    if (subPage) {
+      subPage.remove();
+    }
+    const detailPage = internetPage.$$('settings-internet-detail-page');
+    if (detailPage) {
+      detailPage.remove();
+    }
     internetPage.remove();
     internetPage = null;
     // Navigating to the details page changes the Route state.
@@ -112,32 +119,35 @@
         {GUID: 'wifi12_guid', Name: 'wifi2', Type: 'WiFi'},
       ]);
       api_.enableNetworkType('WiFi');
-      Polymer.dom.flush();
-      const wifi = networkSummary_.$$('#WiFi');
-      assertTrue(!!wifi);
-      assertEquals(2, wifi.networkStateList.length);
+      return flushAsync().then(() => {
+        const wifi = networkSummary_.$$('#WiFi');
+        assertTrue(!!wifi);
+        assertEquals(2, wifi.networkStateList.length);
+      });
     });
 
     test('WiFiToggle', function() {
       // Make WiFi an available but disabled technology.
       api_.disableNetworkType('WiFi');
-      Polymer.dom.flush();
-      const wifi = networkSummary_.$$('#WiFi');
-      assertTrue(!!wifi);
+      return flushAsync().then(() => {
+        const wifi = networkSummary_.$$('#WiFi');
+        assertTrue(!!wifi);
 
-      // Ensure that the initial state is disabled and the toggle is
-      // enabled but unchecked.
-      assertEquals('Disabled', api_.getDeviceStateForTest('WiFi').State);
-      const toggle = wifi.$$('#deviceEnabledButton');
-      assertTrue(!!toggle);
-      assertFalse(toggle.disabled);
-      assertFalse(toggle.checked);
+        // Ensure that the initial state is disabled and the toggle is
+        // enabled but unchecked.
+        assertEquals('Disabled', api_.getDeviceStateForTest('WiFi').State);
+        const toggle = wifi.$$('#deviceEnabledButton');
+        assertTrue(!!toggle);
+        assertFalse(toggle.disabled);
+        assertFalse(toggle.checked);
 
-      // Tap the enable toggle button and ensure the state becomes enabled.
-      toggle.click();
-      Polymer.dom.flush();
-      assertTrue(toggle.checked);
-      assertEquals('Enabled', api_.getDeviceStateForTest('WiFi').State);
+        // Tap the enable toggle button and ensure the state becomes enabled.
+        toggle.click();
+        return flushAsync().then(() => {
+          assertTrue(toggle.checked);
+          assertEquals('Enabled', api_.getDeviceStateForTest('WiFi').State);
+        });
+      });
     });
   });
 
@@ -148,20 +158,21 @@
         {GUID: 'wifi12_guid', Name: 'wifi2', Type: 'WiFi'},
       ]);
       api_.enableNetworkType('WiFi');
-      Polymer.dom.flush();
-      const wifi = networkSummary_.$$('#WiFi');
-      assertTrue(!!wifi);
-      wifi.$$('.subpage-arrow').click();
       return flushAsync().then(() => {
-        const subpage = internetPage.$$('settings-internet-subpage');
-        assertTrue(!!subpage);
-        assertEquals(2, subpage.networkStateList_.length);
-        const toggle = wifi.$$('#deviceEnabledButton');
-        assertTrue(!!toggle);
-        assertFalse(toggle.disabled);
-        const networkList = subpage.$$('#networkList');
-        assertTrue(!!networkList);
-        assertEquals(2, networkList.networks.length);
+        const wifi = networkSummary_.$$('#WiFi');
+        assertTrue(!!wifi);
+        wifi.$$('.subpage-arrow').click();
+        return flushAsync().then(() => {
+          const subpage = internetPage.$$('settings-internet-subpage');
+          assertTrue(!!subpage);
+          assertEquals(2, subpage.networkStateList_.length);
+          const toggle = wifi.$$('#deviceEnabledButton');
+          assertTrue(!!toggle);
+          assertFalse(toggle.disabled);
+          const networkList = subpage.$$('#networkList');
+          assertTrue(!!networkList);
+          assertEquals(2, networkList.networks.length);
+        });
       });
     });
 
@@ -170,25 +181,15 @@
         {GUID: 'cellular1_guid', Name: 'cellular1', Type: 'Cellular'},
       ]);
       api_.enableNetworkType('Cellular');
-      return flushAsync()
-          .then(() => {
-            return Promise.all([
-              api_.whenCalled('getNetworks'),
-              api_.whenCalled('getDeviceStates'),
-            ]);
-          })
-          .then(() => {
-            const mobile = networkSummary_.$$('#Cellular');
-            assertTrue(!!mobile);
-            mobile.$$('.subpage-arrow').click();
-            return Promise.all([
-              api_.whenCalled('getManagedProperties'),
-            ]);
-          })
-          .then(() => {
-            const detailPage = internetPage.$$('settings-internet-detail-page');
-            assertTrue(!!detailPage);
-          });
+      return flushAsync().then(() => {
+        const mobile = networkSummary_.$$('#Cellular');
+        assertTrue(!!mobile);
+        mobile.$$('.subpage-arrow').click();
+        return flushAsync().then(() => {
+          const detailPage = internetPage.$$('settings-internet-detail-page');
+          assertTrue(!!detailPage);
+        });
+      });
     });
 
     test('Tether', function() {
@@ -201,20 +202,21 @@
         const mobile = networkSummary_.$$('#Tether');
         assertTrue(!!mobile);
         mobile.$$('.subpage-arrow').click();
-        Polymer.dom.flush();
-        const subpage = internetPage.$$('settings-internet-subpage');
-        assertTrue(!!subpage);
-        assertEquals(2, subpage.networkStateList_.length);
-        const toggle = mobile.$$('#deviceEnabledButton');
-        assertTrue(!!toggle);
-        assertFalse(toggle.disabled);
-        const networkList = subpage.$$('#networkList');
-        assertTrue(!!networkList);
-        assertEquals(2, networkList.networks.length);
-        const tetherToggle = mobile.$$('#tetherEnabledButton');
-        // No separate tether toggle when Celular is not available; the
-        // primary toggle enables or disables Tether in that case.
-        assertFalse(!!tetherToggle);
+        return flushAsync().then(() => {
+          const subpage = internetPage.$$('settings-internet-subpage');
+          assertTrue(!!subpage);
+          assertEquals(2, subpage.networkStateList_.length);
+          const toggle = mobile.$$('#deviceEnabledButton');
+          assertTrue(!!toggle);
+          assertFalse(toggle.disabled);
+          const networkList = subpage.$$('#networkList');
+          assertTrue(!!networkList);
+          assertEquals(2, networkList.networks.length);
+          const tetherToggle = mobile.$$('#tetherEnabledButton');
+          // No separate tether toggle when Celular is not available; the
+          // primary toggle enables or disables Tether in that case.
+          assertFalse(!!tetherToggle);
+        });
       });
     });
 
@@ -229,20 +231,22 @@
       return flushAsync().then(() => {
         const mobile = networkSummary_.$$('#Cellular');
         assertTrue(!!mobile);
+        assertTrue(!!mobile.$$('.subpage-arrow'));
         mobile.$$('.subpage-arrow').click();
-        Polymer.dom.flush();
-        const subpage = internetPage.$$('settings-internet-subpage');
-        assertTrue(!!subpage);
-        assertEquals(3, subpage.networkStateList_.length);
-        const toggle = mobile.$$('#deviceEnabledButton');
-        assertTrue(!!toggle);
-        assertFalse(toggle.disabled);
-        const networkList = subpage.$$('#networkList');
-        assertTrue(!!networkList);
-        assertEquals(3, networkList.networks.length);
-        const tetherToggle = subpage.$$('#tetherEnabledButton');
-        assertTrue(!!tetherToggle);
-        assertFalse(tetherToggle.disabled);
+        return flushAsync().then(() => {
+          const subpage = internetPage.$$('settings-internet-subpage');
+          assertTrue(!!subpage);
+          assertEquals(3, subpage.networkStateList_.length);
+          const toggle = mobile.$$('#deviceEnabledButton');
+          assertTrue(!!toggle);
+          assertFalse(toggle.disabled);
+          const networkList = subpage.$$('#networkList');
+          assertTrue(!!networkList);
+          assertEquals(3, networkList.networks.length);
+          const tetherToggle = subpage.$$('#tetherEnabledButton');
+          assertTrue(!!tetherToggle);
+          assertFalse(tetherToggle.disabled);
+        });
       });
     });
 
@@ -283,15 +287,16 @@
         const vpn = networkSummary_.$$('#VPN');
         assertTrue(!!vpn);
         vpn.$$('.subpage-arrow').click();
-        Polymer.dom.flush();
-        const subpage = internetPage.$$('settings-internet-subpage');
-        assertTrue(!!subpage);
-        assertEquals(2, subpage.networkStateList_.length);
-        const networkList = subpage.$$('#networkList');
-        assertTrue(!!networkList);
-        assertEquals(2, networkList.networks.length);
-        // TODO(stevenjb): Implement fake management API and test third
-        // party provider sections.
+        return flushAsync().then(() => {
+          const subpage = internetPage.$$('settings-internet-subpage');
+          assertTrue(!!subpage);
+          assertEquals(2, subpage.networkStateList_.length);
+          const networkList = subpage.$$('#networkList');
+          assertTrue(!!networkList);
+          assertEquals(2, networkList.networks.length);
+          // TODO(stevenjb): Implement fake management API and test third
+          // party provider sections.
+        });
       });
     });
 
@@ -315,14 +320,16 @@
         assertTrue(!!expandAddConnections);
         assertTrue(!expandAddConnections.expanded);
         internetPage.addConnectionExpanded_ = true;
-        Polymer.dom.flush();
-        const addArcVpn = internetPage.$$('#addArcVpn');
-        assertTrue(!!addArcVpn);
-        addArcVpn.click();
-        Polymer.dom.flush();
-        const subpage = internetPage.$$('settings-internet-subpage');
-        assertTrue(!!subpage);
-        assertEquals(2, subpage.arcVpnProviders.length);
+        return flushAsync().then(() => {
+          const addArcVpn = internetPage.$$('#addArcVpn');
+          assertTrue(!!addArcVpn);
+          addArcVpn.click();
+          return flushAsync().then(() => {
+            const subpage = internetPage.$$('settings-internet-subpage');
+            assertTrue(!!subpage);
+            assertEquals(2, subpage.arcVpnProviders.length);
+          });
+        });
       });
     });
 
@@ -331,38 +338,24 @@
         {GUID: 'wifi1_guid', Name: 'wifi1', Type: 'WiFi'},
       ]);
       api_.enableNetworkType('WiFi');
-      return flushAsync()
-          .then(() => {
-            const wifi = networkSummary_.$$('#WiFi');
-            assertTrue(!!wifi);
-            wifi.$$('.subpage-arrow').click();
-            return flushAsync();
-          })
-          .then(() => {
-            // Call setTimeout to populate iron-list.
-            return new Promise((resolve) => {
-              setTimeout(function() {
-                Polymer.dom.flush();
-                resolve();
-              });
-            });
-          })
-          .then(() => {
-            const subpage = internetPage.$$('settings-internet-subpage');
-            assertTrue(!!subpage);
-            const networkList = subpage.$$('#networkList');
-            assertTrue(!!networkList);
-            assertEquals(1, networkList.networks.length);
-            assertEquals(1, networkList.listItems_.length);
-            const ironList = networkList.$$('iron-list');
-            assertTrue(!!ironList);
-            assertEquals(1, ironList.items.length);
-            const networkListItem = networkList.$$('cr-network-list-item');
-            assertTrue(!!networkListItem);
-            networkListItem.click();
-            return flushAsync();
-          })
-          .then(() => {
+      return flushAsync().then(() => {
+        const wifi = networkSummary_.$$('#WiFi');
+        assertTrue(!!wifi);
+        wifi.$$('.subpage-arrow').click();
+        return flushAsync().then(() => {
+          const subpage = internetPage.$$('settings-internet-subpage');
+          assertTrue(!!subpage);
+          const networkList = subpage.$$('#networkList');
+          assertTrue(!!networkList);
+          assertEquals(1, networkList.networks.length);
+          assertEquals(1, networkList.listItems_.length);
+          const ironList = networkList.$$('iron-list');
+          assertTrue(!!ironList);
+          assertEquals(1, ironList.items.length);
+          const networkListItem = networkList.$$('cr-network-list-item');
+          assertTrue(!!networkListItem);
+          networkListItem.click();
+          return flushAsync().then(() => {
             const detailPage = internetPage.$$('settings-internet-detail-page');
             assertTrue(!!detailPage);
             assertEquals('wifi1_guid', detailPage.guid);
@@ -370,6 +363,8 @@
               api_.whenCalled('getManagedProperties'),
             ]);
           });
+        });
+      });
     });
   });
 });
diff --git a/ui/webui/resources/cr_elements/chromeos/network/BUILD.gn b/ui/webui/resources/cr_elements/chromeos/network/BUILD.gn
index 92effd9..47f3122 100644
--- a/ui/webui/resources/cr_elements/chromeos/network/BUILD.gn
+++ b/ui/webui/resources/cr_elements/chromeos/network/BUILD.gn
@@ -55,6 +55,7 @@
 
   js_library("cr_network_listener_behavior") {
     deps = [
+      "//ui/webui/resources/cr_components/chromeos/network:mojo_interface_provider",
       "//ui/webui/resources/js:assert",
     ]
     externs_list = [ "$externs_path/networking_private.js" ]
diff --git a/ui/webui/resources/cr_elements/chromeos/network/cr_network_listener_behavior.html b/ui/webui/resources/cr_elements/chromeos/network/cr_network_listener_behavior.html
index 6f8d242..929b810c 100644
--- a/ui/webui/resources/cr_elements/chromeos/network/cr_network_listener_behavior.html
+++ b/ui/webui/resources/cr_elements/chromeos/network/cr_network_listener_behavior.html
@@ -1 +1,2 @@
+<link rel="import" href="chrome://resources/cr_components/chromeos/network/mojo_interface_provider.html">
 <script src="cr_network_listener_behavior.js"></script>
diff --git a/ui/webui/resources/cr_elements/chromeos/network/cr_network_listener_behavior.js b/ui/webui/resources/cr_elements/chromeos/network/cr_network_listener_behavior.js
index dfc2c38..91c2c23 100644
--- a/ui/webui/resources/cr_elements/chromeos/network/cr_network_listener_behavior.js
+++ b/ui/webui/resources/cr_elements/chromeos/network/cr_network_listener_behavior.js
@@ -3,98 +3,36 @@
 // found in the LICENSE file.
 
 /**
- * @fileoverview Polymer behavior for alerting specified child elements of
- * changes to the devices network data.
+ * @fileoverview Polymer behavior for observing CrosNetworkConfigObserver
+ * events.
  */
 
 /** @polymerBehavior */
 const CrNetworkListenerBehavior = {
-  properties: {
-    /**
-     * Array of selectors specifying all children to alert of changes to the
-     * network list.
-     * @private {!Array<string>}
-     */
-    networkListChangeSubscriberSelectors_: Array,
-
-    /**
-     * Array of selectors specifying all children to alert of important changes
-     * to the specific networks.
-     * @private {!Array<string>}
-     */
-    networksChangeSubscriberSelectors_: Array,
-
-    /** @type {!NetworkingPrivate} */
-    networkingPrivate: Object,
-  },
-
-  /** @private {?function(!Array<string>)} */
-  networkListChangedListener_: null,
-
-  /** @private {?function(!Array<string>)} */
-  networksChangedListener_: null,
+  /** @private {?chromeos.networkConfig.mojom.CrosNetworkConfigObserver} */
+  observer_: null,
 
   /** @override */
   attached: function() {
-    this.networkListChangedListener_ = this.networkListChangedListener_ ||
-        this.onNetworkListChanged_.bind(this);
-    this.networkingPrivate.onNetworkListChanged.addListener(
-        this.networkListChangedListener_);
-
-    this.networksChangedListener_ =
-        this.networksChangedListener_ || this.onNetworksChanged_.bind(this);
-    this.networkingPrivate.onNetworksChanged.addListener(
-        this.networksChangedListener_);
+    this.observer_ =
+        new chromeos.networkConfig.mojom.CrosNetworkConfigObserver(this);
+    network_config.MojoInterfaceProviderImpl.getInstance()
+        .getMojoServiceProxy()
+        .addObserver(this.observer_.createProxy());
   },
 
-  /** @override */
-  detached: function() {
-    this.networkingPrivate.onNetworkListChanged.removeListener(
-        assert(this.networkListChangedListener_));
-    this.networkingPrivate.onNetworksChanged.removeListener(
-        assert(this.networksChangedListener_));
-  },
+  // CrosNetworkConfigObserver methods. Override these in the implementation.
 
   /**
-   * This event is triggered when the list of networks changes.
-   * |networkIds| contains the ids for all visible or configured networks.
-   * networkingPrivate.onNetworkListChanged event callback.
-   * @param {!Array<string>} networkIds
-   * @private
+   * CrosNetworkConfigObserver impl
+   * @param {!Array<chromeos.networkConfig.mojom.NetworkStateProperties>}
+   *     activeNetworks
    */
-  onNetworkListChanged_: function(networkIds) {
-    const event = new CustomEvent('network-list-changed', {detail: networkIds});
-    for (let i = 0; i < this.networkListChangeSubscriberSelectors_.length;
-         i++) {
-      this.maybeDispatchEvent_(
-          this.networkListChangeSubscriberSelectors_[i], event);
-    }
-  },
+  onActiveNetworksChanged: function(activeNetworks) {},
 
-  /**
-   * This event is triggered when interesting properties of a network change.
-   * |networkIds| contains the ids for networks whose properties have changed.
-   * networkingPrivate.onNetworksChanged event callback.
-   * @param {!Array<string>} networkIds
-   * @private
-   */
-  onNetworksChanged_: function(networkIds) {
-    const event = new CustomEvent('networks-changed', {detail: networkIds});
-    for (let i = 0; i < this.networksChangeSubscriberSelectors_.length; i++) {
-      this.maybeDispatchEvent_(
-          this.networksChangeSubscriberSelectors_[i], event);
-    }
-  },
+  /** CrosNetworkConfigObserver impl */
+  onNetworkStateListChanged: function() {},
 
-  /**
-   * @param {!Event} event
-   * @private
-   */
-  maybeDispatchEvent_: function(selectors, event) {
-    const element = this.$$(selectors);
-    if (!element) {
-      return;
-    }
-    element.dispatchEvent(event);
-  },
+  /** CrosNetworkConfigObserver impl */
+  onDeviceStateListChanged: function() {},
 };