window.__coverage__ not showing anything after vue3 vitejs vite-plugin-istanbul configuration

user_11286367 0
Viewed 300

I am trying code coverage for my vue3 vite application. Here are Vue3 vite app creation instructions. I am using vite-plugin-istanbul lib to instrument the code, but it is still not showing anything in window.__coverage__ variable after configuration. My configurations are given below:

// vite.config.ts

import istanbul from "vite-plugin-istanbul"

export default defineConfig({
  envPrefix: "FRONTEND_",
  plugins: [
    vue({
      template: { transformAssetUrls },
    }),
    istanbul({
      include: "src/*",
      exclude: ["node_modules", "test/"],
      extension: [".js", ".ts", ".vue"],
      requireEnv: true
    }),
  ],
  build: {
    sourcemap: true,
  },
})


# .env
VITE_COVERAGE=true

After this I run app npm run dev(i.e. npx vite) and trying window.__coverage__ in browser console but getting undefined. I have set/export VITE_COVERAGE=true but still it is not working.

vite e2e-testing vuejs3 istanbul code-coverage
1 Answers

You have declared requireEnv: true which means istanbul is expecting there to be the environment variable VITE_COVERAGE present and set to true in order to track files.

You should set VITE_COVERAGE=true inside your .env.* files and then try again. Alternatively, you can remove the requireEnv line and try that way, as Istanbul will instrument your code by default.

user_173175140
Related