CrOS Settings: Convert borealis and plugin vm detail views to TS

Additionally loads HTML templates for custom elements at runtime.

Bug: chromium:1315757, chromium:1292025
Test: browser_tests --gtest_filter="OSSettingsAppManagement*"
Change-Id: Ifdb2a65f17501ebc1bd162c700acc55b979f198c
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4035910
Reviewed-by: Xiaohui Chen <xiaohuic@chromium.org>
Commit-Queue: Wes Okuhara <wesokuhara@google.com>
Cr-Commit-Position: refs/heads/main@{#1073640}

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

@@ -306,8 +306,6 @@ group("generate_web_components") {
     "os_a11y_page:web_components",
     "os_apps_page:web_components",
     "os_apps_page/app_management_page:web_components",
-    "os_apps_page/app_management_page/borealis_page:web_components",
-    "os_apps_page/app_management_page/plugin_vm_page:web_components",
     "os_bluetooth_page:web_components",
     "os_people_page:web_components",
     "os_privacy_page:web_components",
@@ -324,8 +322,6 @@ group("closure_compile_module") {
     "os_a11y_page:closure_compile_module",
     "os_apps_page:closure_compile_module",
     "os_apps_page/app_management_page:closure_compile_module",
-    "os_apps_page/app_management_page/borealis_page:closure_compile_module",
-    "os_apps_page/app_management_page/plugin_vm_page:closure_compile_module",
     "os_bluetooth_page:closure_compile_module",
     "os_languages_page:closure_compile_module",
     "os_people_page:closure_compile_module",

chrome/browser/resources/settings/chromeos/os_apps_page/app_management_page/BUILD.gn

@@ -70,8 +70,6 @@ js_library("app_detail_view") {
     "../..:os_route",
     "../..:route_observer_behavior",
     "../../..:router",
-    "./borealis_page:borealis_detail_view",
-    "./plugin_vm_page:plugin_vm_detail_view",
     "//ui/webui/resources/js:assert",
   ]
 }

chrome/browser/resources/settings/chromeos/os_apps_page/app_management_page/borealis_page/borealis_detail_view.js → chrome/browser/resources/settings/chromeos/os_apps_page/app_management_page/borealis_page/borealis_detail_view.ts

@@ -10,43 +10,42 @@ import 'chrome://resources/cr_elements/icons.html.js';
 
 import {App} from 'chrome://resources/cr_components/app_management/app_management.mojom-webui.js';
 import {getSelectedApp} from 'chrome://resources/cr_components/app_management/util.js';
-import {html, mixinBehaviors, PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
+import {mixinBehaviors, PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
 
 import {Router} from '../../../../router.js';
 import {routes} from '../../../os_route.js';
 import {AppManagementStoreClient, AppManagementStoreClientInterface} from '../store_client.js';
 
+import {getTemplate} from './borealis_detail_view.html.js';
+
 const kBorealisClientAppId = 'epfhbkiklgmlkhfpbcdleadnhcfdjfmo';
 
-/**
- * @constructor
- * @extends {PolymerElement}
- * @implements {AppManagementStoreClientInterface}
- */
 const AppManagementBorealisDetailViewElementBase =
-    mixinBehaviors([AppManagementStoreClient], PolymerElement);
+    mixinBehaviors([AppManagementStoreClient], PolymerElement) as {
+      new (): PolymerElement & AppManagementStoreClientInterface,
+    };
 
-/** @polymer */
 class AppManagementBorealisDetailViewElement extends
     AppManagementBorealisDetailViewElementBase {
   static get is() {
     return 'app-management-borealis-detail-view';
   }
 
   static get template() {
-    return html`{__html_template__}`;
+    return getTemplate();
   }
 
   static get properties() {
     return {
-      /** @private {App} */
       app_: {
         type: Object,
       },
     };
   }
 
-  connectedCallback() {
+  private app_: App;
+
+  override connectedCallback() {
     super.connectedCallback();
 
     // When the state is changed, get the new selected app and assign it to
@@ -55,26 +54,25 @@ class AppManagementBorealisDetailViewElement extends
     this.updateFromStore();
   }
 
-  /**
-   * @return {boolean}
-   * @protected
-   */
-  isMainApp_() {
+  private isMainApp_(): boolean {
     return this.app_.id === kBorealisClientAppId;
   }
 
-  /**
-   * @param {!Event} event
-   * @private
-   */
-  onBorealisLinkClicked_(event) {
+  private onBorealisLinkClicked_(event: CustomEvent<{event: Event}>): void {
     event.detail.event.preventDefault();
     const params = new URLSearchParams();
     params.append('id', kBorealisClientAppId);
     Router.getInstance().navigateTo(routes.APP_MANAGEMENT_DETAIL, params);
   }
 }
 
+declare global {
+  interface HTMLElementTagNameMap {
+    'app-management-borealis-detail-view':
+        AppManagementBorealisDetailViewElement;
+  }
+}
+
 customElements.define(
     AppManagementBorealisDetailViewElement.is,
     AppManagementBorealisDetailViewElement);

chrome/browser/resources/settings/chromeos/os_apps_page/app_management_page/plugin_vm_page/plugin_vm_browser_proxy.ts

@@ -0,0 +1,35 @@
+// Copyright 2019 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+/**
+ * @fileoverview A helper object used by the Plugin VM section
+ * to manage the Plugin VM.
+ */
+
+import {sendWithPromise} from 'chrome://resources/js/cr.m.js';
+
+export interface PluginVmBrowserProxy {
+  isRelaunchNeededForNewPermissions(): Promise<boolean>;
+  relaunchPluginVm(): void;
+}
+
+let instance: PluginVmBrowserProxy|null = null;
+
+export class PluginVmBrowserProxyImpl implements PluginVmBrowserProxy {
+  static getInstance(): PluginVmBrowserProxy {
+    return instance || (instance = new PluginVmBrowserProxyImpl());
+  }
+
+  static setInstanceForTesting(obj: PluginVmBrowserProxy): void {
+    instance = obj;
+  }
+
+  isRelaunchNeededForNewPermissions(): Promise<boolean> {
+    return sendWithPromise('isRelaunchNeededForNewPermissions');
+  }
+
+  relaunchPluginVm(): void {
+    chrome.send('relaunchPluginVm');
+  }
+}