fix(coverage): trim URL parameters from file paths in c8 coverage

packages/coverage-c8/src/provider.ts

@@ -58,7 +58,7 @@ export class C8CoverageProvider implements CoverageProvider {
         if (!map)
           return
 
-        const url = _url.pathToFileURL(file).href
+        const url = _url.pathToFileURL(file.split('?')[0]).href
 
         let code: string | undefined
         try {
@@ -86,7 +86,7 @@ export class C8CoverageProvider implements CoverageProvider {
     const offset = 224
 
     report._getSourceMap = (coverage: Profiler.ScriptCoverage) => {
-      const path = _url.pathToFileURL(coverage.url).href
+      const path = _url.pathToFileURL(coverage.url.split('?')[0]).href
       const data = sourceMapMeta[path]
 
       if (!data)

test/coverage-test/coverage-test/c8/coverage-report/SFC.test.ts

@@ -0,0 +1,14 @@
+/**
+ * @vitest-environment happy-dom
+ */
+
+import { mount } from '@vue/test-utils'
+import { expect, test } from 'vitest'
+import SFC from '../../../src/coverage-report/SFC.vue'
+
+test('Should update count', async () => {
+  const wrapper = mount(SFC)
+
+  await wrapper.find('button').trigger('click')
+  expect(wrapper.text()).contain(1)
+})

test/coverage-test/coverage-test/c8/coverage-report/math.test.ts

@@ -0,0 +1,10 @@
+import { expect, test } from 'vitest'
+import { add, multiply } from '../../../src/coverage-report/math'
+
+test('add', () => {
+  expect(add(10, 15)).toBe(25)
+})
+
+test('multiply', () => {
+  expect(multiply(2, 5)).toBe(10)
+})

test/coverage-test/coverage-test/c8/coverage-report/not-SFC/not-SFC.test.ts

@@ -0,0 +1,14 @@
+/**
+ * @vitest-environment happy-dom
+ */
+
+import { mount } from '@vue/test-utils'
+import { expect, test } from 'vitest'
+import notSFC from '../../../../src/coverage-report/not-SFC/not-SFC.vue'
+
+test('Should update count', async () => {
+  const wrapper = mount(notSFC)
+
+  await wrapper.find('button').trigger('click')
+  expect(wrapper.text()).contain(1)
+})

test/coverage-test/coverage-test/c8/coverage-report/utils.test.js

@@ -0,0 +1,6 @@
+import { expect, test } from 'vitest'
+import { add } from '../../../src/coverage-report/utils.js'
+
+test('add', () => {
+  expect(add(10, 15)).toBe(25)
+})

test/coverage-test/coverage-test/coverage.c8.test.ts

@@ -1,11 +1,42 @@
 import fs from 'fs'
+import { execa } from 'execa'
 import { resolve } from 'pathe'
 import { expect, test } from 'vitest'
 
+async function run(...runOptions: string[]): Promise<string> {
+  const root = resolve(__dirname, '..')
+
+  const { stdout } = await execa('npx', ['vitest', 'run', ...runOptions], {
+    cwd: root,
+    env: {
+      ...process.env,
+      CI: 'true',
+      NO_COLOR: 'true',
+    },
+    windowsHide: false,
+  })
+
+  return stdout
+}
+
 test('coverage c8', async () => {
   const coveragePath = resolve('./coverage/tmp/')
   const stat = fs.statSync(coveragePath)
   expect(stat.isDirectory()).toBe(true)
   const files = fs.readdirSync(coveragePath)
   expect(files.length > 0).toBe(true)
 })
+
+test('Should show coverage', async () => {
+  const stdout = await run('--config', 'vitest.config-c8-internal-coverage.ts', '--coverage')
+
+  // For Vue SFC and vue + ts files
+  expect(stdout).toContain('not-SFC.ts')
+  expect(stdout).not.toContain('not-SFC.ts?vue')
+  expect(stdout).toContain('not-SFC.vue')
+  expect(stdout).toContain('SFC.vue')
+
+  // For ts and js files
+  expect(stdout).toContain('math.ts')
+  expect(stdout).toContain('utils.js')
+}, 30000)

test/coverage-test/package.json

@@ -19,6 +19,7 @@
   "devDependencies": {
     "@vitejs/plugin-vue": "latest",
     "@vue/test-utils": "latest",
+    "execa": "^6.1.0",
     "happy-dom": "latest",
     "vite": "latest",
     "vitest": "workspace:*",

test/coverage-test/src/coverage-report/SFC.vue

@@ -0,0 +1,17 @@
+<script lang="ts">
+import { defineComponent, ref } from 'vue'
+
+export default defineComponent({
+  setup() {
+    const count = ref(0)
+
+    return { count }
+  },
+})
+</script>
+
+<template>
+  <button @click="count++">
+    {{ count }}
+  </button>
+</template>

test/coverage-test/src/coverage-report/math.ts

@@ -0,0 +1,15 @@
+export function add(a: number, b: number) {
+  return a + b
+}
+
+export function multiply(a: number, b: number) {
+  return a * b
+}
+
+export function untestedFn(a: number, b: number) {
+  return a * b
+}
+
+export function untestedFn2(a: number, b: number) {
+  return a * b
+}

test/coverage-test/src/coverage-report/not-SFC/not-SFC.ts

@@ -0,0 +1,9 @@
+import { defineComponent, ref } from 'vue'
+
+export default defineComponent({
+  setup() {
+    const count = ref(0)
+
+    return { count }
+  },
+})

test/coverage-test/src/coverage-report/not-SFC/not-SFC.vue

@@ -0,0 +1,7 @@
+<script lang="ts" src="./not-SFC.ts"></script>
+
+<template>
+  <button @click="count++">
+    {{ count }}
+  </button>
+</template>

test/coverage-test/src/coverage-report/utils.js

@@ -0,0 +1,3 @@
+export function add(a, b) {
+  return a + b
+}

test/coverage-test/vitest.config-c8-coverage.ts

@@ -1,9 +1,16 @@
 import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
 
 export default defineConfig({
+  plugins: [vue()],
   test: {
     include: [
       './coverage-test/*.c8.test.ts',
     ],
+    coverage: {
+      reporter: ['html', 'text', 'lcov'],
+      include: ['src/**'],
+      extension: ['.ts', '.vue', '.js'],
+    },
   },
 })

test/coverage-test/vitest.config-c8-internal-coverage.ts

@@ -0,0 +1,16 @@
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+
+export default defineConfig({
+  plugins: [vue()],
+  test: {
+    include: [
+      './coverage-test/c8/**/*test.{ts,js}',
+    ],
+    coverage: {
+      reporter: ['html', 'text', 'lcov'],
+      include: ['src/**'],
+      extension: ['.ts', '.vue', '.js'],
+    },
+  },
+})

test/coverage-test/vitest.config.ts

@@ -14,7 +14,7 @@ export default defineConfig({
       'test/*.test.ts',
     ],
     exclude: [
-      'coverage-test/*.test.ts',
+      'coverage-test/**/*',
     ],
     coverage: {
       enabled: true,