From bcaae16cd59b71f7cae78e28ad4f3f279f807c63 Mon Sep 17 00:00:00 2001
From: falsandtru <falsandtru@users.noreply.github.com>
Date: Wed, 6 May 2020 08:16:04 +0900
Subject: [PATCH 1/2] fix(middleware): remove query params and fragment
 identifiers from URLs

---
 lib/helper.js            | 4 ++++
 lib/middleware/karma.js  | 3 +--
 test/unit/helper.spec.js | 9 +++++++++
 3 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/lib/helper.js b/lib/helper.js
index 34b349efd..b1313d5a3 100644
--- a/lib/helper.js
+++ b/lib/helper.js
@@ -141,6 +141,10 @@ const replaceWinPath = (path) => {
 
 exports.normalizeWinPath = process.platform === 'win32' ? replaceWinPath : _.identity
 
+exports.getFileType = (file) => {
+  return file.type || path.extname(file.path.split(/[?#]/, 1)[0] || '').substring(1)
+}
+
 exports.mkdirIfNotExists = (directory, done) => {
   // TODO(vojta): handle if it's a file
   /* eslint-disable handle-callback-err */
diff --git a/lib/middleware/karma.js b/lib/middleware/karma.js
index dd1ee1d00..588fa609e 100644
--- a/lib/middleware/karma.js
+++ b/lib/middleware/karma.js
@@ -11,7 +11,6 @@
  * - setting propert caching headers
  */
 
-const path = require('path')
 const url = require('url')
 const helper = require('../helper')
 
@@ -164,7 +163,7 @@ function createKarmaMiddleware (
           const scriptTags = []
           for (const file of files.included) {
             let filePath = file.path
-            const fileType = file.type || path.extname(filePath).substring(1)
+            const fileType = helper.getFileType(file)
 
             if (helper.isDefined(fileType) && !FILE_TYPES.includes(fileType)) {
               log.warn(`Invalid file type (${fileType}), defaulting to js.`)
diff --git a/test/unit/helper.spec.js b/test/unit/helper.spec.js
index 8c5808c50..50318d150 100644
--- a/test/unit/helper.spec.js
+++ b/test/unit/helper.spec.js
@@ -228,6 +228,15 @@ describe('helper', () => {
     })
   })
 
+  describe('getFileType', () => {
+    it('should extract file type', () => {
+      expect(helper.getFileType({ path: 'a.js' })).to.equal('js')
+      expect(helper.getFileType({ path: 'a.js#' })).to.equal('js')
+      expect(helper.getFileType({ path: 'a.js?#' })).to.equal('js')
+      expect(helper.getFileType({ type: 'js', path: 'a' })).to.equal('js')
+    })
+  })
+
   describe('mkdirIfNotExists', () => {
     const fsMock = require('mocks').fs
     const loadFile = require('mocks').loadFile

From 8870cb50c5666d09b0a7584c474e14c70a21e65d Mon Sep 17 00:00:00 2001
From: falsandtru <falsandtru@users.noreply.github.com>
Date: Sun, 10 May 2020 09:23:49 +0900
Subject: [PATCH 2/2] refactor(middleware): handle paths as URLs

---
 lib/middleware/karma.js | 38 +++++++++++++++++++-------------------
 1 file changed, 19 insertions(+), 19 deletions(-)

diff --git a/lib/middleware/karma.js b/lib/middleware/karma.js
index 588fa609e..85d30a179 100644
--- a/lib/middleware/karma.js
+++ b/lib/middleware/karma.js
@@ -162,31 +162,31 @@ function createKarmaMiddleware (
 
           const scriptTags = []
           for (const file of files.included) {
-            let filePath = file.path
+            const urlPath = file.isUrl
+              ? file.path
+              : requestUrl === '/context.html'
+                ? filePathToUrlPath(file.path, basePath, urlRoot, proxyPath) + '?' + file.sha
+                : filePathToUrlPath(file.path, basePath, urlRoot, proxyPath)
             const fileType = helper.getFileType(file)
 
             if (helper.isDefined(fileType) && !FILE_TYPES.includes(fileType)) {
               log.warn(`Invalid file type (${fileType}), defaulting to js.`)
             }
 
-            if (!file.isUrl) {
-              filePath = filePathToUrlPath(filePath, basePath, urlRoot, proxyPath)
-
-              if (requestUrl === '/context.html') {
-                filePath += '?' + file.sha
-              }
-            }
-
-            if (fileType === 'css') {
-              scriptTags.push(`<link type="text/css" href="${filePath}" rel="stylesheet">`)
-            } else if (fileType === 'dom') {
-              scriptTags.push(file.content)
-            } else if (fileType === 'html') {
-              scriptTags.push(`<link href="${filePath}" rel="import">`)
-            } else {
-              const scriptType = (SCRIPT_TYPE[fileType] || 'text/javascript')
-              const crossOriginAttribute = includeCrossOriginAttribute ? 'crossorigin="anonymous"' : ''
-              scriptTags.push(`<script type="${scriptType}" src="${filePath}" ${crossOriginAttribute}></script>`)
+            switch (fileType) {
+              case 'dom':
+                scriptTags.push(file.content)
+                break
+              case 'css':
+                scriptTags.push(`<link type="text/css" href="${urlPath}" rel="stylesheet">`)
+                break
+              case 'html':
+                scriptTags.push(`<link href="${urlPath}" rel="import">`)
+                break
+              default:
+                const scriptType = (SCRIPT_TYPE[fileType] || 'text/javascript')
+                const crossOriginAttribute = includeCrossOriginAttribute ? 'crossorigin="anonymous"' : ''
+                scriptTags.push(`<script type="${scriptType}" src="${urlPath}" ${crossOriginAttribute}></script>`)
             }
           }