I've been looking for a way to get code coverage report for my component tests that use @playwright/experimental-ct-react , and I've followed the guide mentioned here, but it seems, the vite-instanbul-plugin isn't able to transform the relevant code.
I added a custom plugin to debug if transform would happen, but the callback doesn't trigger.
ctViteConfig: {
plugins: [
react(),
// Custom debug plugin to check if plugins are loading
{
name: 'debug-plugin-loader',
configResolved(config: any) {
console.log('🔧 DEBUG: Plugin loaded - configResolved hook called');
console.log(
'🔧 DEBUG: Vite config plugins:',
config.plugins?.map((p: any) => p.name || 'unnamed'),
);
console.log('🔧 DEBUG: Environment:', config.env);
console.log('🔧 DEBUG: Command:', config.command);
console.log('🔧 DEBUG: Mode:', config.mode);
},
buildStart() {
console.log('🚀 DEBUG: Build started - buildStart hook called');
},
transform(code: string, id: string) {
if (id.includes('/src/') && (id.endsWith('.tsx') || id.endsWith('.ts'))) {
console.log('🔄 DEBUG: Transforming file:', id);
console.log('🔍 DEBUG: Code sample (first 100 chars):', code.substring(0, 100));
// Check if Istanbul has already instrumented this code
const isInstrumented = code.includes('__cov_') || code.includes('__coverage__');
console.log('📊 DEBUG: File instrumented by Istanbul:', isInstrumented);
}
return null; // Don't modify the code, just log
},
generateBundle() {
console.log('📦 DEBUG: Bundle generation - generateBundle hook called');
},
},
istanbul({
include: 'src/**/*',
exclude: ['node_modules', 'test', '**/*.spec.*', '**/*.story.*'],
extension: ['.js', '.jsx', '.ts', '.tsx'],
requireEnv: false,
forceBuildInstrument: true,
checkProd: false,
}),
] as any,
build: {
sourcemap: true,
},
},
@playwright/experimental-ct-react: 1.56.1
playwright: 1.56.1
vite-plugin-istanbul: 7.2.0
I've been looking for a way to get code coverage report for my component tests that use
@playwright/experimental-ct-react, and I've followed the guide mentioned here, but it seems, thevite-instanbul-pluginisn't able to transform the relevant code.I added a custom plugin to debug if transform would happen, but the callback doesn't trigger.
Here'e my ctViteConfig :
Relevant package versions :
Any pointers that would help me with this?