fix: replace sourcemap's path by the corresponding absolute file path (#23)

Author: rndmerle

.gitignore

@@ -4,3 +4,5 @@ cypress/screenshots
 coverage/
 .nyc_output/
 dist/
+.cache/
+.vscode/

.vscode/settings.json

@@ -30,18 +30,16 @@ context('Unit tests', () => {
     expect(add('foo', 'Bar')).to.equal('fooBar')
   })
 
-  it('fixes webpack loader source-map path', () => {
+  it('fixes webpack loader source-map pathes', () => {
     const coverage = {
-      '/folder/module.js': {
-        inputSourceMap: {
-          sources: ['/folder/module.js']
-        }
-      },
-      '/folder/component.vue': {
+      '/absolute/src/component.vue': {
+        path: '/absolute/src/component.vue',
         inputSourceMap: {
           sources: [
-            '/folder/node_modules/cache-loader/dist/cjs.js??ref--0-0!/folder/node_modules/vue-loader/lib/index.js??vue-loader-options!/folder/component.vue?vue&type=script&lang=ts&'
-          ]
+            '/folder/node_modules/cache-loader/dist/cjs.js??ref--0-0!/folder/node_modules/vue-loader/lib/index.js??vue-loader-options!component.vue?vue&type=script&lang=ts&',
+            'otherFile.js'
+          ],
+          sourceRoot: 'src'
         }
       },
       '/folder/module-without-sourcemap.js': {
@@ -51,11 +49,17 @@ context('Unit tests', () => {
 
     fixSourcePathes(coverage)
 
-    expect(coverage['/folder/module.js'].inputSourceMap.sources)
-      .to.deep.equal(['/folder/module.js'])
-    expect(coverage['/folder/component.vue'].inputSourceMap.sources)
-      .to.deep.equal(['/folder/component.vue'])
-    expect(coverage['/folder/module-without-sourcemap.js'].path)
-      .to.eq('/folder/module-without-sourcemap.js')
+    expect(coverage).to.deep.eq({
+      '/absolute/src/component.vue': {
+        path: '/absolute/src/component.vue',
+        inputSourceMap: {
+          sources: ['/absolute/src/component.vue', 'otherFile.js'],
+          sourceRoot: ''
+        }
+      },
+      '/folder/module-without-sourcemap.js': {
+        path: '/folder/module-without-sourcemap.js'
+      }
+    })
   })
 })

cypress/integration/spec.js

@@ -1,17 +1,19 @@
 module.exports = {
   /**
-   * Remove potential Webpack loaders string and query parameters from sourcemap path
+   * Replace source-map's path by the corresponding absolute file path
+   * (coverage report wouldn't work with source-map path being relative
+   * or containing Webpack loaders and query parameters)
    */
-  fixSourcePathes (coverage) {
-    Object.keys(coverage).forEach(file => {
-      const sourcemap = coverage[file].inputSourceMap
-      if (!sourcemap) return
-      sourcemap.sources = sourcemap.sources.map(source => {
-        let cleaned = source
-        if (cleaned.includes('!')) cleaned = cleaned.split('!').pop()
-        if (cleaned.includes('?')) cleaned = cleaned.split('?').shift()
-        return cleaned
-      })
+  fixSourcePathes(coverage) {
+    Object.values(coverage).forEach(file => {
+      const { path: absolutePath, inputSourceMap } = file
+      const fileName = /([^\/\\]+)$/.exec(absolutePath)[1]
+      if (!inputSourceMap || !fileName) return
+
+      if (inputSourceMap.sourceRoot) inputSourceMap.sourceRoot = ''
+      inputSourceMap.sources = inputSourceMap.sources.map(source =>
+        source.includes(fileName) ? absolutePath : source
+      )
     })
   }
-}
+}