WebUI: Generate JS Module for unittest for some cr.ui.* elements

Add module for
- list_test.js
- context_menu_handler_test.js
- command_test.js
- array_data_model_test.js
- cr_test.js
- event_target_test.js

Bug: 1133198
Change-Id: I839c440ea5072b3daacf21bfa69db5a0f7ce2e37
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2486531
Commit-Queue: Luciano Pacheco <lucmult@chromium.org>
Reviewed-by: dpapad <dpapad@chromium.org>
Cr-Commit-Position: refs/heads/master@{#819729}

chrome/test/data/webui/BUILD.gn

@@ -441,7 +441,7 @@ group("modulize") {
     "./cr_components:modulize",
     "./cr_components/chromeos:modulize",
     "./cr_elements:modulize",
-    "./js/cr/ui:modulize",
+    "./js/cr:modulize",
     "./resources:modulize",
     "./settings:modulize",
   ]
@@ -454,6 +454,7 @@ group("modulize") {
 js_modulizer("modulize_local") {
   input_files = [
     "cr_focus_row_behavior_test.js",
+    "cr_test.js",
     "fake_chrome_event.js",
     "mock_controller.js",
     "mock_timer.js",
@@ -461,7 +462,8 @@ js_modulizer("modulize_local") {
     "test_store.js",
     "test_util.js",
   ]
-  namespace_rewrites = test_namespace_rewrites
+  namespace_rewrites =
+      test_namespace_rewrites + [ "cr.addSingletonGetter|addSingletonGetter" ]
 }
 
 group("closure_compile") {

chrome/test/data/webui/cr_test.js

@@ -2,10 +2,12 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-var EventTarget;
+// #import {addSingletonGetter} from 'chrome://resources/js/cr.m.js';
+
+/* #ignore */ var EventTarget;
 
 function setUp() {
-  EventTarget = cr.EventTarget;
+  /* #ignore */ EventTarget = cr.EventTarget;
 }
 
 function testDefineProperty() {
@@ -218,7 +220,7 @@ function testDefinePropertyBoolAttrEventWithHook() {
   assertTrue(hit);
 }
 
-function testAddSingletonGetter() {
+/* #export */ function testAddSingletonGetter() {
   function Foo() {}
   cr.addSingletonGetter(Foo);
 
@@ -242,7 +244,7 @@ function testAddSingletonGetter() {
       x, z, 'Should return a different object after clearing for testing');
 }
 
-function testDefineWithGetter() {
+/* #export */ function testDefineWithGetter() {
   var v = 0;
   cr.define('foo', function() {
     return {
@@ -257,3 +259,6 @@ function testDefineWithGetter() {
   v = 1;
   assertEquals(1, foo.v);
 }
+
+window.setUp = setUp;
+window.testAddSingletonGetter = testAddSingletonGetter;

chrome/test/data/webui/js/cr/BUILD.gn

+# Copyright 2020 The Chromium Authors. All rights reserved.
+# Use of this source code is governed by a BSD-style license that can be
+# found in the LICENSE file.
+
+import("//third_party/closure_compiler/compile_js.gni")
+import("//ui/webui/resources/tools/js_modulizer.gni")
+
+group("modulize") {
+  deps = [
+    ":modulize_local",
+    "./ui:modulize",
+  ]
+}
+
+js_modulizer("modulize_local") {
+  input_files = [ "event_target_test.js" ]
+}

chrome/test/data/webui/js/cr/event_target_test.js

@@ -2,13 +2,17 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-/* @const */ var EventTarget;
+// clang-format off
+// #import {NativeEventTarget as EventTarget} from 'chrome://resources/js/cr/event_target.m.js';
+// clang-format on
 
-function setUp() {
-  EventTarget = cr.EventTarget;
+/* #ignore */ /* @const */ var EventTarget;
+
+/* #export */ function setUp() {
+  /* #ignore */ EventTarget = cr.EventTarget;
 }
 
-function testFunctionListener() {
+/* #export */ function testFunctionListener() {
   var fi = 0;
   function f(e) {
     fi++;
@@ -37,7 +41,7 @@ function testFunctionListener() {
   assertEquals(1, gi, 'Should have been called once');
 }
 
-function testHandleEvent() {
+/* #export */ function testHandleEvent() {
   var fi = 0;
   var f = {
     handleEvent: function(e) {
@@ -70,7 +74,7 @@ function testHandleEvent() {
   assertEquals(1, gi, 'Should have been called once');
 }
 
-function testPreventDefault() {
+/* #export */ function testPreventDefault() {
   var i = 0;
   function prevent(e) {
     i++;
@@ -95,3 +99,8 @@ function testPreventDefault() {
   assertEquals(2, j);
   assertEquals(1, i);
 }
+
+window.setUp = setUp;
+window.testFunctionListener = testFunctionListener;
+window.testHandleEvent = testHandleEvent;
+window.testPreventDefault = testPreventDefault;

chrome/test/data/webui/js/cr/ui/BUILD.gn

@@ -2,18 +2,17 @@
 # Use of this source code is governed by a BSD-style license that can be
 # found in the LICENSE file.
 
-import("//third_party/closure_compiler/compile_js.gni")
+import("//ui/webui/resources/js/cr.gni")
 import("//ui/webui/resources/tools/js_modulizer.gni")
 
-group("modulize") {
-  deps = [ ":modulize_local" ]
-}
-
-js_modulizer("modulize_local") {
-  input_files = [ "grid_test.js" ]
-
-  namespace_rewrites = [
-    "cr.ui.Grid|Grid",
-    "cr.ui.ArrayDataModel|ArrayDataModel",
+js_modulizer("modulize") {
+  input_files = [
+    "grid_test.js",
+    "array_data_model_test.js",
+    "command_test.js",
+    "context_menu_handler_test.js",
+    "list_test.js",
   ]
+
+  namespace_rewrites = cr_namespace_rewrites
 }

chrome/test/data/webui/js/cr/ui/array_data_model_test.js

@@ -2,14 +2,18 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-function testSlice() {
+// clang-format off
+// #import {ArrayDataModel} from 'chrome://resources/js/cr/ui/array_data_model.m.js';
+// clang-format on
+
+/* #export */ function testSlice() {
   var m = new cr.ui.ArrayDataModel([0, 1, 2]);
   assertArrayEquals([0, 1, 2], m.slice());
   assertArrayEquals([1, 2], m.slice(1));
   assertArrayEquals([1], m.slice(1, 2));
 }
 
-function testPush() {
+/* #export */ function testPush() {
   var m = new cr.ui.ArrayDataModel([0, 1, 2]);
 
   var count = 0;
@@ -27,7 +31,7 @@ function testPush() {
   assertEquals(1, count, 'The splice event should only fire once');
 }
 
-function testSplice() {
+/* #export */ function testSplice() {
   function compare(array, args) {
     var m = new cr.ui.ArrayDataModel(array.slice());
     var expected = array.slice();
@@ -46,7 +50,7 @@ function testSplice() {
   compare([1, 2, 3], [5, 3, 1, 2, 3]);
 }
 
-function testPermutation() {
+/* #export */ function testPermutation() {
   function doTest(sourceArray, spliceArgs) {
     var m = new cr.ui.ArrayDataModel(sourceArray.slice());
     var permutation;
@@ -73,7 +77,7 @@ function testPermutation() {
   doTest([1, 2, 3], [0, 3, 1, 2, 3]);
 }
 
-function testUpdateIndexes() {
+/* #export */ function testUpdateIndexes() {
   var m = new cr.ui.ArrayDataModel([1, 2, 3]);
   var changedIndexes = [];
   m.addEventListener('change', function(event) {
@@ -83,7 +87,7 @@ function testUpdateIndexes() {
   assertArrayEquals([0, 1, 2], changedIndexes);
 }
 
-function testReplaceItem() {
+/* #export */ function testReplaceItem() {
   var m = new cr.ui.ArrayDataModel([1, 2, 3]);
   var permutation = null;
   var changeIndex;
@@ -97,3 +101,10 @@ function testReplaceItem() {
   assertEquals(null, permutation);
   assertEquals(1, changeIndex);
 }
+
+window.testSlice = testSlice;
+window.testPush = testPush;
+window.testSplice = testSplice;
+window.testPermutation = testPermutation;
+window.testUpdateIndexes = testUpdateIndexes;
+window.testReplaceItem = testReplaceItem;

chrome/test/data/webui/js/cr/ui/command_test.html

@@ -4,7 +4,6 @@
 <title>cr.ui.Command test</title>
 </head>
 <body>
-<command shortcut="n|Ctrl"></command>
 <script src="chrome://resources/js/assert.js"></script>
 <script src="chrome://resources/js/cr.js"></script>
 <script src="chrome://resources/js/cr/ui.js"></script>

chrome/test/data/webui/js/cr/ui/command_test.js

@@ -2,7 +2,16 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-function testCommandDefaultPrevented() {
+// #import {Command} from 'chrome://resources/js/cr/ui/command.m.js';
+// #import {decorate} from 'chrome://resources/js/cr/ui.m.js';
+
+/* #export */ function setUp() {
+  const cmd = document.createElement('command');
+  cmd.setAttribute('shortcut', 'n|Ctrl');
+  document.body.appendChild(cmd);
+}
+
+/* #export */ function testCommandDefaultPrevented() {
   var calls = 0;
   document.addEventListener('canExecute', function(e) {
     ++calls;
@@ -28,7 +37,7 @@ function createEvent(key, code, keyCode) {
   };
 }
 
-function testShortcuts() {
+/* #export */ function testShortcuts() {
   cr.ui.decorate('command', cr.ui.Command);
   const cmd = document.querySelector('command');
   // US keyboard - qwerty-N should work.
@@ -40,3 +49,7 @@ function testShortcuts() {
   // RU keyboard - qwerty-N (Cyrillic Te) should work.
   assertTrue(cmd.matchesEvent(createEvent('т', 'KeyN', 0x4e)));
 }
+
+window.setUp = setUp;
+window.testCommandDefaultPrevented = testCommandDefaultPrevented;
+window.testShortcuts = testShortcuts;

chrome/test/data/webui/js/cr/ui/context_menu_handler_test.js

@@ -2,7 +2,13 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-function testShowAndHideEvents() {
+// clang-format off
+// #import {contextMenuHandler} from 'chrome://resources/js/cr/ui/context_menu_handler.m.js';
+// #import {decorate} from 'chrome://resources/js/cr/ui.m.js';
+// #import {Menu} from 'chrome://resources/js/cr/ui/menu.m.js';
+// clang-format on
+
+/* #export */ function testShowAndHideEvents() {
   // Keep original Date.now not to affect other code.
   var originalDateNow = Date.now;
 
@@ -64,3 +70,5 @@ function testShowAndHideEvents() {
 
   Date.now = originalDateNow;
 }
+
+window.testShowAndHideEvents = testShowAndHideEvents;

chrome/test/data/webui/js/cr/ui/list_test.js

@@ -2,7 +2,12 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-function testClearPinnedItem() {
+// clang-format off
+// #import {List} from 'chrome://resources/js/cr/ui/list.m.js';
+// #import {ArrayDataModel} from 'chrome://resources/js/cr/ui/array_data_model.m.js';
+// clang-format on
+
+/* #export */ function testClearPinnedItem() {
   var list = document.createElement('ul');
   list.style.position = 'absolute';
   list.style.width = '800px';
@@ -24,7 +29,7 @@ function testClearPinnedItem() {
   assertEquals('Item B', list.querySelectorAll('li')[0].textContent);
 }
 
-function testClickOutsideListItem() {
+/* #export */ function testClickOutsideListItem() {
   const list = document.createElement('ul');
   list.style.position = 'absolute';
   list.style.width = '800px';
@@ -57,3 +62,6 @@ function testClickOutsideListItem() {
   assertEquals(item, list.getListItemAncestor(item));
   assertEquals(item, list.getListItemAncestor(span));
 }
+
+window.testClearPinnedItem = testClearPinnedItem;
+window.testClickOutsideListItem = testClickOutsideListItem;

chrome/test/data/webui/webui_resource_browsertest.cc

@@ -51,10 +51,20 @@ IN_PROC_BROWSER_TEST_F(WebUIResourceBrowserTest, ArrayDataModelTest) {
   LoadTestUrl("js/cr/ui/array_data_model_test.html");
 }
 
+#if defined(OS_CHROMEOS)
+IN_PROC_BROWSER_TEST_F(WebUIResourceBrowserTest, ArrayDataModelModuleTest) {
+  LoadTestUrl("?module=js/cr/ui/array_data_model_test.m.js");
+}
+#endif
+
 IN_PROC_BROWSER_TEST_F(WebUIResourceBrowserTest, CrTest) {
   LoadTestUrl("cr_test.html");
 }
 
+IN_PROC_BROWSER_TEST_F(WebUIResourceBrowserTest, CrModuleTest) {
+  LoadTestUrl("?module=cr_test.m.js");
+}
+
 IN_PROC_BROWSER_TEST_F(WebUIResourceBrowserTest, CrReloadTest) {
   LoadTestUrl("cr_reload_test.html");
 }
@@ -63,6 +73,10 @@ IN_PROC_BROWSER_TEST_F(WebUIResourceBrowserTest, EventTargetTest) {
   LoadTestUrl("js/cr/event_target_test.html");
 }
 
+IN_PROC_BROWSER_TEST_F(WebUIResourceBrowserTest, EventTargetModuleTest) {
+  LoadTestUrl("?module=js/cr/event_target_test.m.js");
+}
+
 IN_PROC_BROWSER_TEST_F(WebUIResourceBrowserTest, I18nProcessCssTest) {
   LoadTestUrl("i18n_process_css_test.html");
 }
@@ -122,6 +136,10 @@ IN_PROC_BROWSER_TEST_F(WebUIResourceBrowserTest, ListTest) {
 }
 
 #if defined(OS_CHROMEOS)
+IN_PROC_BROWSER_TEST_F(WebUIResourceBrowserTest, ListModuleTest) {
+  LoadTestUrl("?module=js/cr/ui/list_test.m.js");
+}
+
 IN_PROC_BROWSER_TEST_F(WebUIResourceBrowserTest, GridTest) {
   LoadTestUrl("js/cr/ui/grid_test.html");
 }
@@ -159,10 +177,22 @@ IN_PROC_BROWSER_TEST_F(WebUIResourceBrowserTest, CommandTest) {
   LoadTestUrl("js/cr/ui/command_test.html");
 }
 
+#if defined(OS_CHROMEOS)
+IN_PROC_BROWSER_TEST_F(WebUIResourceBrowserTest, CommandModuleTest) {
+  LoadTestUrl("?module=js/cr/ui/command_test.m.js");
+}
+#endif
+
 IN_PROC_BROWSER_TEST_F(WebUIResourceBrowserTest, ContextMenuHandlerTest) {
   LoadTestUrl("js/cr/ui/context_menu_handler_test.html");
 }
 
+#if defined(OS_CHROMEOS)
+IN_PROC_BROWSER_TEST_F(WebUIResourceBrowserTest, ContextMenuHandlerModuleTest) {
+  LoadTestUrl("?module=js/cr/ui/context_menu_handler_test.m.js");
+}
+#endif
+
 IN_PROC_BROWSER_TEST_F(WebUIResourceBrowserTest, MenuButtonTest) {
   LoadTestUrl("js/cr/ui/menu_button_test.html");
 }

ui/webui/resources/js/cr.gni

+# Copyright 2020 The Chromium Authors. All rights reserved.
+# Use of this source code is governed by a BSD-style license that can be
+# found in the LICENSE file.
+
+cr_namespace_rewrites = [
+  "cr.getPropertyDescriptor|getPropertyDescriptor",
+  "cr.PropertyKind|PropertyKind",
+  "cr.dispatchPropertyChange|dispatchPropertyChange",
+  "cr.EventTarget|EventTarget",
+  "cr.ui.Command|Command",
+  "cr.ui.contextMenuHandler|contextMenuHandler",
+  "cr.ui.decorate|decorate",
+  "cr.ui.dialogs.BaseDialog|BaseDialog",
+  "cr.ui.dialogs.AlertDialog|AlertDialog",
+  "cr.ui.dialogs.ConfirmDialog|ConfirmDialog",
+  "cr.ui.dialogs.PromptDialog|PromptDialog",
+  "cr.ui.Action|Action",
+  "cr.ui.AnchorType|AnchorType",
+  "cr.ui.ArrayDataModel|ArrayDataModel",
+  "cr.ui.define|crUiDefine",
+  "cr.ui.DeferredAction|DeferredAction",
+  "cr.ui.DragWrapperDelegate|DragWrapperDelegate",
+  "cr.ui.FocusRowDelegate|FocusRowDelegate",
+  "cr.ui.FocusRow|FocusRow",
+  "cr.ui.Grid|Grid",
+  "cr.ui.HideType|HideType",
+  "cr.ui.limitInputWidth|limitInputWidth",
+  "cr.ui.List|List",
+  "cr.ui.ListItem|ListItem",
+  "cr.ui.ListSelectionModel|ListSelectionModel",
+  "cr.ui.ListSelectionController|ListSelectionController",
+  "cr.ui.Menu|Menu",
+  "cr.ui.positionPopupAroundElement|positionPopupAroundElement",
+  "cr.ui.positionPopupAtPoint|positionPopupAtPoint",
+  "cr.ui.swallowDoubleClick|swallowDoubleClick",
+  "cr.ui.Size|Size",
+  "cr.ui.StoreObserver|StoreObserver",
+  "cr.ui.Tab|Tab",
+  "cr.ui.Tree|Tree",
+  "cr.ui.TreeItem|TreeItem",
+  "cr.ui.VirtualFocusRow|VirtualFocusRow",
+]

ui/webui/resources/js/cr/ui/BUILD.gn

@@ -4,6 +4,7 @@
 
 import("//third_party/closure_compiler/compile_js.gni")
 import("../../../tools/js_modulizer.gni")
+import("../../cr.gni")
 
 group("closure_compile") {
   deps = [
@@ -275,43 +276,7 @@ js_modulizer("modulize") {
     "tabs.js",
     "tree.js",
   ]
-  namespace_rewrites = [
-    "cr.getPropertyDescriptor|getPropertyDescriptor",
-    "cr.PropertyKind|PropertyKind",
-    "cr.dispatchPropertyChange|dispatchPropertyChange",
-    "cr.EventTarget|EventTarget",
-    "cr.ui.Command|Command",
-    "cr.ui.decorate|decorate",
-    "cr.ui.dialogs.BaseDialog|BaseDialog",
-    "cr.ui.dialogs.AlertDialog|AlertDialog",
-    "cr.ui.dialogs.ConfirmDialog|ConfirmDialog",
-    "cr.ui.dialogs.PromptDialog|PromptDialog",
-    "cr.ui.Action|Action",
-    "cr.ui.AnchorType|AnchorType",
-    "cr.ui.ArrayDataModel|ArrayDataModel",
-    "cr.ui.define|crUiDefine",
-    "cr.ui.DeferredAction|DeferredAction",
-    "cr.ui.DragWrapperDelegate|DragWrapperDelegate",
-    "cr.ui.FocusRowDelegate|FocusRowDelegate",
-    "cr.ui.FocusRow|FocusRow",
-    "cr.ui.Grid|Grid",
-    "cr.ui.HideType|HideType",
-    "cr.ui.limitInputWidth|limitInputWidth",
-    "cr.ui.List|List",
-    "cr.ui.ListItem|ListItem",
-    "cr.ui.ListSelectionModel|ListSelectionModel",
-    "cr.ui.ListSelectionController|ListSelectionController",
-    "cr.ui.Menu|Menu",
-    "cr.ui.positionPopupAroundElement|positionPopupAroundElement",
-    "cr.ui.positionPopupAtPoint|positionPopupAtPoint",
-    "cr.ui.swallowDoubleClick|swallowDoubleClick",
-    "cr.ui.Size|Size",
-    "cr.ui.StoreObserver|StoreObserver",
-    "cr.ui.Tab|Tab",
-    "cr.ui.Tree|Tree",
-    "cr.ui.TreeItem|TreeItem",
-    "cr.ui.VirtualFocusRow|VirtualFocusRow",
-  ]
+  namespace_rewrites = cr_namespace_rewrites
 }
 
 js_type_check("ui_resources_modules") {