fix: use correct source map names for script files imported over src (#131)

Author: steplov

lib/process.js

@@ -31,25 +31,23 @@ function processScript(scriptPart, filePath, config) {
 
 module.exports = function(src, filePath, config) {
   const vueJestConfig = getVueJestConfig(config)
-  var parts = vueCompiler.parseComponent(src, { pad: true })
+  let parts = vueCompiler.parseComponent(src, { pad: true })
+  let scriptSrc = src
+  let sourceMapPath = filePath
 
   if (parts.script && parts.script.src) {
-    parts.script.content = fs.readFileSync(
-      join(filePath, '..', parts.script.src),
-      'utf8'
-    )
+    const externalScrPath = join(filePath, '..', parts.script.src)
+
+    parts.script.content = fs.readFileSync(externalScrPath, 'utf8')
+    scriptSrc = parts.script.content
+    sourceMapPath = externalScrPath
   }
 
   const result = processScript(parts.script, filePath, config)
   const script = result.code
   const inputMap = result.map
 
-  let scriptSrc = src
-  if (parts.script && parts.script.src) {
-    scriptSrc = parts.script.content
-  }
-
-  const map = generateSourceMap(script, '', filePath, scriptSrc, inputMap)
+  const map = generateSourceMap(script, '', sourceMapPath, scriptSrc, inputMap)
 
   let output =
     ';(function(){\n' +

test/resources/SourceMapsSrc.vue

@@ -0,0 +1,3 @@
+<template src="./BasicSrc.html"></template>
+
+<script src="./BasicSrc.js"></script>

test/sourceMaps.spec.js

@@ -0,0 +1,51 @@
+import { resolve } from 'path'
+import { readFileSync } from 'fs'
+import clearModule from 'clear-module'
+import cache from '../lib/cache'
+import jestVue from '../vue-jest'
+
+beforeEach(() => {
+  cache.flushAll()
+  clearModule.all()
+})
+
+const getSourceMaps = code => {
+  const sourceMapBase64 = /\/\/# sourceMappingURL=data:application\/json;charset=utf-8;base64,(.*)/gim
+
+  let matches
+  let values = []
+
+  while ((matches = sourceMapBase64.exec(code)) !== null) {
+    values.push(JSON.parse(Buffer.from(matches[1], 'base64').toString('ascii')))
+  }
+
+  return values
+}
+
+test('generates source maps for .vue files', () => {
+  const filePath = resolve(__dirname, './resources/Basic.vue')
+  const fileString = readFileSync(filePath, { encoding: 'utf8' })
+
+  const { code } = jestVue.process(fileString, filePath, {
+    moduleFileExtensions: ['js', 'vue']
+  })
+
+  const [template, js] = getSourceMaps(code)
+
+  expect(js.sources[0]).toBe('Basic.vue')
+  expect(template.sources[0]).toBe('Basic.vue')
+})
+
+test('generates source maps using src attributes', () => {
+  const filePath = resolve(__dirname, './resources/SourceMapsSrc.vue')
+  const fileString = readFileSync(filePath, { encoding: 'utf8' })
+
+  const { code } = jestVue.process(fileString, filePath, {
+    moduleFileExtensions: ['js', 'vue']
+  })
+
+  const [template, js] = getSourceMaps(code)
+
+  expect(js.sources[0]).toBe('BasicSrc.js')
+  expect(template.sources[0]).toBe('SourceMapsSrc.vue')
+})