fix(middleware): catch errors when loading a module (#3605)

Fix #3572

Co-authored-by: https://github.com/jehon

Author: johnjbarton

lib/middleware/karma.js

@@ -191,7 +191,11 @@ function createKarmaMiddleware (
             } else {
               const scriptType = (SCRIPT_TYPE[fileType] || 'text/javascript')
               const crossOriginAttribute = includeCrossOriginAttribute ? 'crossorigin="anonymous"' : ''
-              scriptTags.push(`<script type="${scriptType}" src="${filePath}" ${crossOriginAttribute}></script>`)
+              if (fileType === 'module') {
+                scriptTags.push(`<script onerror="throw 'Error loading ${filePath}'" type="${scriptType}" src="${filePath}" ${crossOriginAttribute}></script>`)
+              } else {
+                scriptTags.push(`<script type="${scriptType}" src="${filePath}" ${crossOriginAttribute}></script>`)
+              }
             }
           }
 

test/e2e/error.feature

@@ -40,3 +40,19 @@ Feature: Error Display
       """
       SyntaxError: Unexpected token '}'
       """
+
+Scenario: Missing module Error in a test file
+    Given a configuration with:
+      """
+      files = [{pattern: 'error/import-something-from-somewhere.js', type: 'module'}];
+      browsers = ['ChromeHeadlessNoSandbox'];
+      plugins = [
+        'karma-jasmine',
+        'karma-chrome-launcher'
+      ];
+      """
+    When I start Karma
+    Then it fails with:
+      """
+      Uncaught Error loading error/import-something-from-somewhere.js
+      """

test/e2e/support/error/import-something-from-somewhere.js

@@ -0,0 +1,2 @@
+import { something } from './somewhere.js'
+console.log(something)