Import unit tests from a separate entrypoint

This allows removing duplicate awaits from context.html and debug.html
and ensuring the order of test imports. This change is not required for
test IDs.

Bug: 393986723
Change-Id: I0debffb91c1d17ed117649fe6f65f0654abb89f2
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/8085463
Reviewed-by: Philip Pfaffe <pfaffe@chromium.org>
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>

test/unit/context.html

diff --git a/test/unit/context.html b/test/unit/context.html
index e30bb74..a91b088 100644
--- a/test/unit/context.html
+++ b/test/unit/context.html
@@ -49,23 +49,9 @@
       %MAPPINGS%
     </script>
     %SCRIPTS%
-    <script type="module">
-      // Relying on the script module loading order is not sufficient if modules
-      // use top-level awaits so we need to wait till all modules are actually
-      // imported.
-      await Promise.all(
-        Array.from(document.body.querySelectorAll('script[type=module]')).map(
-          script => {
-            if (script.src) {
-              return import(script.src);
-            }
-          },
-        ),
-      );
-      window.__karma__.loaded();
-    </script>
-    <script nomodule>
-      window.__karma__.loaded();
+    <script
+      type="module"
+      src="/base/tests.js">
     </script>
   </body>
 </html>

test/unit/debug.html

diff --git a/test/unit/debug.html b/test/unit/debug.html
index 42d9fc8..d9ac84e 100644
--- a/test/unit/debug.html
+++ b/test/unit/debug.html
@@ -50,23 +50,9 @@
       %MAPPINGS%
     </script>
     %SCRIPTS%
-    <script type="module">
-      // Relying on the script module loading order is not sufficient if modules
-      // use top-level awaits so we need to wait till all modules are actually
-      // imported.
-      await Promise.all(
-        Array.from(document.body.querySelectorAll('script[type=module]')).map(
-          script => {
-            if (script.src) {
-              return import(script.src);
-            }
-          },
-        ),
-      );
-      window.__karma__.loaded();
-    </script>
-    <script nomodule>
-      window.__karma__.loaded();
+    <script
+      type="module"
+      src="/base/tests.js">
     </script>
   </body>
 </html>

test/unit/karma.conf.ts

diff --git a/test/unit/karma.conf.ts b/test/unit/karma.conf.ts
index a37d839..a08bd0e 100644
--- a/test/unit/karma.conf.ts
+++ b/test/unit/karma.conf.ts
@@ -255,6 +255,25 @@
 } :
                                                     {};
 
+function testsEntrypointMiddleware(config: any) {
+  return (req: any, res: any, next: any) => {
+    if (req.url.startsWith('/base/tests.js')) {
+      res.writeHead(200, {'Content-Type': 'application/javascript'});
+      const imports = tests
+                          .map(testPath => {
+                            const relativePath = path.relative(config.basePath, testPath).replace(/\\/g, '/');
+                            const importPath = `/base/${relativePath}`;
+                            return `import ${JSON.stringify(importPath)};`;
+                          })
+                          .join('\n');
+      return res.end(imports + `window.__karma__.loaded();\n`);
+    }
+    next();
+  };
+}
+
+testsEntrypointMiddleware.$inject = ['config'];
+
 module.exports = function(config: any) {
   const targetDir = path.relative(SOURCE_ROOT, GEN_DIR);
   const devToolsRoot = path.relative(CHECKOUT_ROOT, SOURCE_ROOT);
@@ -271,7 +290,7 @@
       {pattern: path.join(SOURCE_ROOT, 'node_modules/sinon/**/*'), served: true, included: false},
       {pattern: path.join(GEN_DIR, 'test/unit/mocha-interface.js'), served: true, included: true},
       {pattern: path.join(GEN_DIR, 'front_end', 'testing', 'test_setup.js'), type: 'module'},
-      ...tests.map(pattern => ({pattern, type: 'module'})),
+      ...tests.map(pattern => ({pattern, type: 'module', served: true, included: false})),
       ...tests.map(pattern => ({pattern: `${pattern}.map`, served: true, included: false, watched: true})),
       {pattern: path.join(GEN_DIR, 'front_end/Images/*.{svg,png}'), served: true, included: false},
       {pattern: path.join(GEN_DIR, 'front_end/core/i18n/locales/*.json'), served: true, included: false},
@@ -317,6 +336,7 @@
     },
 
     plugins: [
+      {'middleware:esm-entry': ['factory', testsEntrypointMiddleware]},
       {[`launcher:${CustomChrome.prototype.name}`]: ['type', CustomChrome]},
       require('karma-mocha'),
       require('karma-sourcemap-loader'),
@@ -341,7 +361,7 @@
       '/sinon': `/base/${devToolsRoot}/node_modules/sinon`,
     },
 
-    middleware: ['snapshotTester'],
+    middleware: ['esm-entry', 'snapshotTester'],
 
     coverageReporter: {
       dir: path.join(TestConfig.artifactsDir, COVERAGE_OUTPUT_DIRECTORY),