Convert chrome://interventions-internals to use JS modules.

This is part of the effort to remove usages of cr.js and eliminate
dependencies to JS Compiler's --chrome_pass flag.

Bug: 1028829
Change-Id: Ic963a5dbfe0c18f0428e4432b2e6db3fb930a081
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1938074
Commit-Queue: John Lee <johntlee@chromium.org>
Auto-Submit: dpapad <dpapad@chromium.org>
Reviewed-by: John Lee <johntlee@chromium.org>
Cr-Commit-Position: refs/heads/master@{#838242}

chrome/browser/resources/interventions_internals/BUILD.gn

@@ -5,14 +5,14 @@
 import("//third_party/closure_compiler/compile_js.gni")
 
 js_type_check("closure_compile") {
+  uses_js_modules = true
   deps = [ ":index" ]
 }
 
 js_library("index") {
   deps = [
     "//chrome/browser/ui/webui/interventions_internals:mojo_bindings_js_library_for_compile",
-    "//ui/webui/resources/js:assert",
-    "//ui/webui/resources/js:cr",
-    "//ui/webui/resources/js:util",
+    "//ui/webui/resources/js:assert.m",
+    "//ui/webui/resources/js:util.m",
   ]
 }

chrome/browser/resources/interventions_internals/index.html

@@ -4,14 +4,7 @@
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Interventions-Internals</title>
-    <script src="chrome://resources/js/cr.js"></script>
-    <script src="chrome://resources/mojo/mojo/public/js/mojo_bindings_lite.js"></script>
-    <script src="chrome://resources/mojo/url/mojom/url.mojom-lite.js"></script>
-    <script src="chrome://resources/js/assert.js"></script>
-    <script src="chrome://resources/js/util.js"></script>
-    <script src="chrome/browser/ui/webui/interventions_internals/interventions_internals.mojom-lite.js">
-    </script>
-    <script src="index.js"></script>
+    <script type="module" src="index.js"></script>
     <link rel="stylesheet" type="text/css" href="index.css">
   </head>
 

chrome/browser/resources/interventions_internals/index.js

@@ -2,11 +2,20 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+import 'chrome://resources/mojo/mojo/public/js/mojo_bindings_lite.js';
+import 'chrome://resources/mojo/url/mojom/url.mojom-lite.js';
+import './chrome/browser/ui/webui/interventions_internals/interventions_internals.mojom-lite.js';
+
+import {assert} from 'chrome://resources/js/assert.m.js';
+import {$} from 'chrome://resources/js/util.m.js';
+
 /** The columns that are used to find rows that contain the keyword. */
 const ENABLE_BLOCKLIST_BUTTON = 'Enable Blocklist';
 const IGNORE_BLOCKLIST_BUTTON = 'Ignore Blocklist';
 const IGNORE_BLOCKLIST_MESSAGE = 'Blocklist decisions are ignored.';
 const URL_THRESHOLD = 40;  // Maximum URL length
+// Export on |window| for tests.
+window.URL_THRESHOLD = URL_THRESHOLD;
 
 window.logTableMap = {};
 
@@ -44,6 +53,8 @@ function getTimeFormat(time) {
   const millisec = getPaddedValue(date.getMilliseconds(), 3);
   return dateString + ' ' + hour + ':' + min + ':' + sec + '.' + millisec;
 }
+// Export on |window| for tests.
+window.getTimeFormat = getTimeFormat;
 
 /**
  * Append a button to |element|, so that when the button is clicked, the
@@ -454,6 +465,8 @@ function setupLogClear() {
 const InterventionsInternalPageImpl = function() {
   this.receiver_ = new mojom.InterventionsInternalsPageReceiver(this);
 };
+// Export on |window| for tests.
+window.InterventionsInternalPageImpl = InterventionsInternalPageImpl;
 
 InterventionsInternalPageImpl.prototype = {
   /**
@@ -594,7 +607,6 @@ InterventionsInternalPageImpl.prototype = {
   },
 };
 
-cr.define('interventions_internals', () => {
   let pageHandler = null;
 
   function init(handler) {
@@ -674,10 +686,6 @@ cr.define('interventions_internals', () => {
         });
   }
 
-  return {
-    init: init,
-  };
-});
 
 window.setupFn = window.setupFn || function() {
   return Promise.resolve();
@@ -702,6 +710,6 @@ document.addEventListener('DOMContentLoaded', () => {
       pageHandler.setClientPage(pageImpl.bindNewPipeAndPassRemote());
     }
 
-    interventions_internals.init(pageHandler);
+    init(pageHandler);
   });
 });

chrome/test/data/webui/interventions_internals_browsertest.js

@@ -186,7 +186,7 @@ TEST_F('InterventionsInternalsUITest', 'GetPreviewsFlagsDetails', function() {
 
 TEST_F('InterventionsInternalsUITest', 'LogNewMessage', function() {
   test('LogMessageIsPostedCorrectly', () => {
-    let pageImpl = new InterventionsInternalPageImpl(null);
+    let pageImpl = new window.InterventionsInternalPageImpl(null);
     let logs = [
       {
         type: 'Type_a',
@@ -225,7 +225,7 @@ TEST_F('InterventionsInternalsUITest', 'LogNewMessage', function() {
                                                 // log table).
 
       expectEquals(
-          getTimeFormat(log.time), row.querySelector('.log-time').textContent);
+          window.getTimeFormat(log.time), row.querySelector('.log-time').textContent);
       expectEquals(log.type, row.querySelector('.log-type').textContent);
       expectEquals(
           log.description, row.querySelector('.log-description').textContent);
@@ -239,7 +239,7 @@ TEST_F('InterventionsInternalsUITest', 'LogNewMessage', function() {
 
 TEST_F('InterventionsInternalsUITest', 'LogNewMessageWithLongUrl', function() {
   test('LogMessageIsPostedCorrectly', () => {
-    let pageImpl = new InterventionsInternalPageImpl(null);
+    let pageImpl = new window.InterventionsInternalPageImpl(null);
     let log = {
       type: 'Some type',
       url: {url: ''},
@@ -263,7 +263,7 @@ TEST_F('InterventionsInternalsUITest', 'LogNewMessageWithLongUrl', function() {
 
 TEST_F('InterventionsInternalsUITest', 'LogNewMessageWithNoUrl', function() {
   test('LogMessageIsPostedCorrectly', () => {
-    let pageImpl = new InterventionsInternalPageImpl(null);
+    let pageImpl = new window.InterventionsInternalPageImpl(null);
     let log = {
       type: 'Some type',
       url: {url: ''},
@@ -285,7 +285,7 @@ TEST_F('InterventionsInternalsUITest', 'LogNewMessageWithNoUrl', function() {
 
 TEST_F('InterventionsInternalsUITest', 'LogNewMessagePageIdZero', function() {
   test('LogMessageWithPageIdZero', () => {
-    let pageImpl = new InterventionsInternalPageImpl(null);
+    let pageImpl = new window.InterventionsInternalPageImpl(null);
     let logs = [
       {
         type: 'Type_a',
@@ -330,7 +330,7 @@ TEST_F('InterventionsInternalsUITest', 'LogNewMessagePageIdZero', function() {
 
 TEST_F('InterventionsInternalsUITest', 'LogNewMessageNewPageId', function() {
   test('LogMessageWithNewPageId', () => {
-    let pageImpl = new InterventionsInternalPageImpl(null);
+    let pageImpl = new window.InterventionsInternalPageImpl(null);
     let logs = [
       {
         type: 'Type_a',
@@ -375,7 +375,7 @@ TEST_F('InterventionsInternalsUITest', 'LogNewMessageNewPageId', function() {
 TEST_F(
     'InterventionsInternalsUITest', 'LogNewMessageExistedPageId', function() {
       test('LogMessageWithExistedPageId', () => {
-        let pageImpl = new InterventionsInternalPageImpl(null);
+        let pageImpl = new window.InterventionsInternalPageImpl(null);
         let logs = [
           {
             type: 'Type_a',
@@ -437,7 +437,7 @@ TEST_F(
     'InterventionsInternalsUITest',
     'LogNewMessageExistedPageIdGroupToTopOfTable', function() {
       test('NewMessagePushedToTopOfTable', () => {
-        let pageImpl = new InterventionsInternalPageImpl(null);
+        let pageImpl = new window.InterventionsInternalPageImpl(null);
         let logs = [
           {
             type: 'Type_a',
@@ -486,7 +486,7 @@ TEST_F(
 
 TEST_F('InterventionsInternalsUITest', 'AddNewBlocklistedHost', function() {
   test('AddNewBlocklistedHost', () => {
-    let pageImpl = new InterventionsInternalPageImpl(null);
+    let pageImpl = new window.InterventionsInternalPageImpl(null);
     let time = 758675653000;  // Jan 15 1994 23:14:13 UTC
     let expectedHost = 'example.com';
     pageImpl.onBlocklistedHost(expectedHost, time);
@@ -507,7 +507,7 @@ TEST_F('InterventionsInternalsUITest', 'AddNewBlocklistedHost', function() {
 
 TEST_F('InterventionsInternalsUITest', 'HostAlreadyBlocklisted', function() {
   test('HostAlreadyBlocklisted', () => {
-    let pageImpl = new InterventionsInternalPageImpl(null);
+    let pageImpl = new window.InterventionsInternalPageImpl(null);
     let time0 = 758675653000;   // Jan 15 1994 23:14:13 UTC
     let time1 = 1507221689240;  // Oct 05 2017 16:41:29 UTC
     let expectedHost = 'example.com';
@@ -536,7 +536,7 @@ TEST_F('InterventionsInternalsUITest', 'HostAlreadyBlocklisted', function() {
 
 TEST_F('InterventionsInternalsUITest', 'UpdateUserBlocklisted', function() {
   test('UpdateUserBlocklistedDisplayCorrectly', () => {
-    let pageImpl = new InterventionsInternalPageImpl(null);
+    let pageImpl = new window.InterventionsInternalPageImpl(null);
     let state = $('user-blocklisted-status-value');
 
     pageImpl.onUserBlocklistedStatusChange(true /* blocklisted */);
@@ -553,7 +553,7 @@ TEST_F('InterventionsInternalsUITest', 'UpdateUserBlocklisted', function() {
 
 TEST_F('InterventionsInternalsUITest', 'OnBlocklistCleared', function() {
   test('OnBlocklistClearedRemovesAllBlocklistedHostInTable', () => {
-    let pageImpl = new InterventionsInternalPageImpl(null);
+    let pageImpl = new window.InterventionsInternalPageImpl(null);
     let state = $('user-blocklisted-status-value');
     let time = 758675653000;  // Jan 15 1994 23:14:13 UTC
 
@@ -572,7 +572,7 @@ TEST_F(
     'InterventionsInternalsUITest', 'ClearLogMessageOnBlocklistCleared',
     function() {
       test('ClearLogsTableOnBlocklistCleared', () => {
-        let pageImpl = new InterventionsInternalPageImpl(null);
+        let pageImpl = new window.InterventionsInternalPageImpl(null);
         let time = 758675653000;  // Jan 15 1994 23:14:13 UTC
         let log = {
           type: 'Some type',
@@ -598,7 +598,7 @@ TEST_F(
 
 TEST_F('InterventionsInternalsUITest', 'OnECTChanged', function() {
   test('UpdateETCOnChange', () => {
-    let pageImpl = new InterventionsInternalPageImpl(null);
+    let pageImpl = new window.InterventionsInternalPageImpl(null);
     let ectTypes = ['type1', 'type2', 'type3'];
     ectTypes.forEach((type) => {
       pageImpl.updateEffectiveConnectionType(type, 'max');
@@ -612,7 +612,7 @@ TEST_F('InterventionsInternalsUITest', 'OnECTChanged', function() {
 
 TEST_F('InterventionsInternalsUITest', 'OnBlocklistIgnoreChange', function() {
   test('OnBlocklistIgnoreChangeDisable', () => {
-    let pageImpl = new InterventionsInternalPageImpl(null);
+    let pageImpl = new window.InterventionsInternalPageImpl(null);
     pageImpl.onIgnoreBlocklistDecisionStatusChanged(true /* ignored */);
     expectEquals('Enable Blocklist', $('ignore-blocklist-button').textContent);
     expectEquals(