[CrOS Cellular] Fix ESim network list in mobile data subpage.

This fixes issue with eSIM networks incorrectly appearing
in pSIM group. This was caused because the eid property was
not being checked properly.

Bug: 1093185
Change-Id: I9c3f2f72810e186dd35f47dedff61bf7efd2c06b
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2575149Reviewed-by: Kyle Horimoto <khorimoto@chromium.org>
Commit-Queue: Azeem Arshad <azeemarshad@chromium.org>
Cr-Commit-Position: refs/heads/master@{#834354}

chrome/browser/resources/settings/chromeos/internet_page/BUILD.gn

@@ -213,6 +213,7 @@ js_library("cellular_networks_list") {
   deps = [
     ":cellular_eid_popup",
     "//ui/webui/resources/cr_components/chromeos/cellular_setup:cellular_types",
+    "//ui/webui/resources/cr_components/chromeos/network:mojo_interface_provider",
     "//ui/webui/resources/cr_components/chromeos/network:onc_mojo",
     "//ui/webui/resources/cr_elements/cr_icon_button:cr_icon_button",
     "//ui/webui/resources/js:i18n_behavior",

chrome/browser/resources/settings/chromeos/internet_page/cellular_networks_list.html

 <link rel="import" href="chrome://resources/html/polymer.html">
 
 <link rel="import" href="chrome://resources/cr_components/chromeos/network/onc_mojo.html">
+<link rel="import" href="chrome://resources/cr_components/chromeos/network/mojo_interface_provider.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_icons_css.html">
 <link rel="import" href="chrome://resources/cr_components/chromeos/cellular_setup/cellular_types.html">

chrome/browser/resources/settings/chromeos/internet_page/cellular_networks_list.js

@@ -24,7 +24,7 @@ Polymer({
       value() {
         return [];
       },
-      observer: 'networksListChange_',
+      observer: 'onNetworksListChanged_',
     },
 
     /**
@@ -85,34 +85,51 @@ Polymer({
     'close-eid-popup': 'toggleEidPopup_',
   },
 
+  /** @private {?chromeos.networkConfig.mojom.CrosNetworkConfigRemote} */
+  networkConfig_: null,
+
+  /** @override */
+  created() {
+    this.networkConfig_ = network_config.MojoInterfaceProviderImpl.getInstance()
+                              .getMojoServiceRemote();
+  },
+
   /**
    * @private
    */
-  networksListChange_() {
+  async onNetworksListChanged_() {
     const mojom = chromeos.networkConfig.mojom;
 
     const pSimNetworks = [];
     const eSimNetworks = [];
     const tetherNetworks = [];
 
-
     for (const network of this.networks) {
-      if (network.eid) {
-        eSimNetworks.push(network);
-        continue;
-      }
       if (network.type === mojom.NetworkType.kTether) {
         tetherNetworks.push(network);
         continue;
       }
-      pSimNetworks.push(network);
+
+      const managedPropertiesResponse =
+          await this.networkConfig_.getManagedProperties(network.guid);
+      if (!managedPropertiesResponse || !managedPropertiesResponse.result) {
+        console.error(
+            'Unable to get managed properties for network. guid=',
+            network.guid);
+        continue;
+      }
+
+      if (managedPropertiesResponse.result.typeProperties.cellular.eid) {
+        eSimNetworks.push(network);
+      } else {
+        pSimNetworks.push(network);
+      }
     }
     this.eSimNetworks_ = eSimNetworks;
     this.pSimNetworks_ = pSimNetworks;
     this.tetherNetworks_ = tetherNetworks;
   },
 
-
   /**
    * @param {!Array<!OncMojo.NetworkStateProperties>} list
    * @returns {boolean}

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

@@ -50,18 +50,34 @@ suite('CellularNetworkList', function() {
   }
 
   test('Tether plus cellular', async () => {
+    const eSimNetwork1 = OncMojo.getDefaultNetworkState(
+        mojom.NetworkType.kCellular, 'cellular_esim1');
+    const eSimNetwork2 = OncMojo.getDefaultNetworkState(
+        mojom.NetworkType.kCellular, 'cellular_esim2');
     setNetworksForTest(mojom.NetworkType.kCellular, [
       OncMojo.getDefaultNetworkState(mojom.NetworkType.kCellular, 'cellular1'),
       OncMojo.getDefaultNetworkState(mojom.NetworkType.kCellular, 'cellular2'),
+      eSimNetwork1,
+      eSimNetwork2,
       OncMojo.getDefaultNetworkState(mojom.NetworkType.kTether, 'tether1'),
       OncMojo.getDefaultNetworkState(mojom.NetworkType.kTether, 'tether2'),
     ]);
-    Polymer.dom.flush();
+
+    const eSimManagedProperties1 = OncMojo.getDefaultManagedProperties(
+        mojom.NetworkType.kCellular, eSimNetwork1.guid, eSimNetwork1.name);
+    const eSimManagedProperties2 = OncMojo.getDefaultManagedProperties(
+        mojom.NetworkType.kCellular, eSimNetwork2.guid, eSimNetwork2.name);
+    eSimManagedProperties1.typeProperties.cellular.eid =
+        '11111111111111111111111111111111';
+    eSimManagedProperties2.typeProperties.cellular.eid =
+        '22222222222222222222222222222222';
+    mojoApi_.setManagedPropertiesForTest(eSimManagedProperties1);
+    mojoApi_.setManagedPropertiesForTest(eSimManagedProperties2);
 
     await flushAsync();
 
-    assertEquals(2, cellularNetworkList.pSimNetworks_.length);
-    assertEquals(2, cellularNetworkList.tetherNetworks_.length);
+    const eSimNetworkList = cellularNetworkList.$$('#esimNetworkList');
+    assertTrue(!!eSimNetworkList);
 
     const pSimNetworkList = cellularNetworkList.$$('#psimNetworkList');
     assertTrue(!!pSimNetworkList);
@@ -69,6 +85,7 @@ suite('CellularNetworkList', function() {
     const tetherNetworkList = cellularNetworkList.$$('#tetherNetworkList');
     assertTrue(!!tetherNetworkList);
 
+    assertEquals(2, eSimNetworkList.networks.length);
     assertEquals(2, pSimNetworkList.networks.length);
     assertEquals(2, tetherNetworkList.networks.length);
   });
@@ -109,6 +126,7 @@ suite('CellularNetworkList', function() {
             pSimCellularEvent.detail.pageName,
             cellularSetup.CellularSetupPageName.PSIM_FLOW_UI);
       });
+
   test('Show EID and QR code popup', async () => {
     let eidPopup = cellularNetworkList.$$('.eid-popup');
     assertFalse(!!eidPopup);