Add VPN disablement tests for internet page

Following up on CL: https://crrev.com/c/2190216: Support disabling
Chrome OS native VPNs by policy; this CL adds tests that address the
internet page changes which were mainly showing a policy indicator
beside the button used for adding a new VPN when VPN is disabled by
policy.

Bug: 1098653
Change-Id: I54c24d74511f528f1e6dd4dc64af81fceec9bdb2
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2414239Reviewed-by: Steven Bennetts <stevenjb@chromium.org>
Reviewed-by: Azeem Arshad <azeemarshad@chromium.org>
Commit-Queue: Omar Morsi <omorsi@google.com>
Cr-Commit-Position: refs/heads/master@{#808278}

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

@@ -75,7 +75,7 @@
                   $i18n{internetAddVPN}
                 </div>
                 <template is="dom-if" if="[[!vpnIsEnabled_]]">
-                  <cr-policy-indicator
+                  <cr-policy-indicator id="vpnPolicyIndicator"
                       icon-aria-label="$i18n{networkVpnBuiltin}"
                       indicator-type="devicePolicy"
                       on-click="doNothing_">

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

@@ -63,7 +63,7 @@
         </template>
 
         <template is="dom-if" if="[[showPolicyIndicator_(activeNetworkState)]]">
-          <cr-policy-indicator
+          <cr-policy-indicator id="policyIndicator"
               icon-aria-label="[[getTitleText_(activeNetworkState)]]"
               indicator-type="[[getPolicyIndicatorType_(activeNetworkState)]]"
               on-click="doNothing_">

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

@@ -150,40 +150,91 @@ suite('InternetPage', function() {
           'Toggle WiFi should be focused for settingId=4.');
     });
 
-    test('VpnProviders', function() {
-      const mojom = chromeos.networkConfig.mojom;
-      mojoApi_.setVpnProvidersForTest([
-        {
-          type: mojom.VpnType.kExtension,
-          providerId: 'extension_id1',
-          providerName: 'MyExtensionVPN1',
-          appId: 'extension_id1',
-          lastLaunchTime: {internalValue: 0},
-        },
-        {
-          type: mojom.VpnType.kArc,
-          providerId: 'vpn.app.package1',
-          providerName: 'MyArcVPN1',
-          appId: 'arcid1',
-          lastLaunchTime: {internalValue: 1},
-        },
-        {
-          type: mojom.VpnType.kArc,
-          providerId: 'vpn.app.package2',
-          providerName: 'MyArcVPN2',
-          appId: 'arcid2',
-          lastLaunchTime: {internalValue: 2},
-        }
-      ]);
-      return flushAsync().then(() => {
-        assertEquals(3, internetPage.vpnProviders_.length);
-        // Ensure providers are sorted by type and lastLaunchTime.
-        assertEquals('extension_id1', internetPage.vpnProviders_[0].providerId);
-        assertEquals(
-            'vpn.app.package2', internetPage.vpnProviders_[1].providerId);
-        assertEquals(
-            'vpn.app.package1', internetPage.vpnProviders_[2].providerId);
+    suite('VPN', function() {
+      test('VpnProviders', function() {
+        const mojom = chromeos.networkConfig.mojom;
+        mojoApi_.setVpnProvidersForTest([
+          {
+            type: mojom.VpnType.kExtension,
+            providerId: 'extension_id1',
+            providerName: 'MyExtensionVPN1',
+            appId: 'extension_id1',
+            lastLaunchTime: {internalValue: 0},
+          },
+          {
+            type: mojom.VpnType.kArc,
+            providerId: 'vpn.app.package1',
+            providerName: 'MyArcVPN1',
+            appId: 'arcid1',
+            lastLaunchTime: {internalValue: 1},
+          },
+          {
+            type: mojom.VpnType.kArc,
+            providerId: 'vpn.app.package2',
+            providerName: 'MyArcVPN2',
+            appId: 'arcid2',
+            lastLaunchTime: {internalValue: 2},
+          }
+        ]);
+        return flushAsync().then(() => {
+          assertEquals(3, internetPage.vpnProviders_.length);
+          // Ensure providers are sorted by type and lastLaunchTime.
+          assertEquals(
+              'extension_id1', internetPage.vpnProviders_[0].providerId);
+          assertEquals(
+              'vpn.app.package2', internetPage.vpnProviders_[1].providerId);
+          assertEquals(
+              'vpn.app.package1', internetPage.vpnProviders_[2].providerId);
+        });
+      });
+
+      function clickAddConnectionsButton() {
+        const button = internetPage.$$('#expandAddConnections');
+        assertTrue(!!button);
+        button.expanded = true;
+      }
+
+      test('should show VPN policy indicator when VPN is disabled', function() {
+        clickAddConnectionsButton();
+
+        const mojom = chromeos.networkConfig.mojom;
+        setNetworksForTest([
+          OncMojo.getDefaultNetworkState(mojom.NetworkType.kVPN, 'vpn'),
+        ]);
+        mojoApi_.setDeviceStateForTest({
+          type: mojom.NetworkType.kVPN,
+          deviceState: mojom.DeviceStateType.kProhibited
+        });
+
+        return flushAsync().then(() => {
+          assertTrue(
+              test_util.isVisible(internetPage.$$('#vpnPolicyIndicator')));
+          assertTrue(test_util.isVisible(
+              networkSummary_.$$('#VPN').$$('#policyIndicator')));
+        });
       });
+
+      test(
+          'should not show VPN policy indicator when VPN is enabled',
+          function() {
+            clickAddConnectionsButton();
+
+            const mojom = chromeos.networkConfig.mojom;
+            setNetworksForTest([
+              OncMojo.getDefaultNetworkState(mojom.NetworkType.kVPN, 'vpn'),
+            ]);
+            mojoApi_.setDeviceStateForTest({
+              type: mojom.NetworkType.kVPN,
+              deviceState: mojom.DeviceStateType.kEnabled
+            });
+
+            return flushAsync().then(() => {
+              assertFalse(
+                  test_util.isVisible(internetPage.$$('#vpnPolicyIndicator')));
+              assertFalse(test_util.isVisible(
+                  networkSummary_.$$('#VPN').$$('#policyIndicator')));
+            });
+          });
     });
 
     test('Deep link to mobile on/off toggle', async () => {