docs: Document how to generate and visualize test coverage locally (no-changelog) (#15385)

.vscode/extensions.json

@@ -7,6 +7,7 @@
 		"EditorConfig.EditorConfig",
 		"esbenp.prettier-vscode",
 		"mjmlio.vscode-mjml",
+		"ryanluker.vscode-coverage-gutters",
 		"Vue.volar",
 		"vitest.explorer"
 	]

CONTRIBUTING.md

@@ -19,9 +19,14 @@ Great that you are here and you want to contribute to n8n
 		- [Actual n8n setup](#actual-n8n-setup)
 		- [Start](#start)
 	- [Development cycle](#development-cycle)
-		-	[Community PR Guidelines](#community-pr-guidelines)
+		- [Community PR Guidelines](#community-pr-guidelines)
+			- [**1. Change Request/Comment**](#1-change-requestcomment)
+			- [**2. General Requirements**](#2-general-requirements)
+			- [**3. PR Specific Requirements**](#3-pr-specific-requirements)
+			- [**4. Workflow Summary for Non-Compliant PRs**](#4-workflow-summary-for-non-compliant-prs)
 		- [Test suite](#test-suite)
 			- [Unit tests](#unit-tests)
+			- [Code Coverage](#code-coverage)
 			- [E2E tests](#e2e-tests)
 	- [Releasing](#releasing)
 	- [Create custom nodes](#create-custom-nodes)
@@ -253,6 +258,10 @@ tests of all packages.
 
 If you made a change which requires an update on a `.test.ts.snap` file, pass `-u` to the command to run tests or press `u` in watch mode.
 
+#### Code Coverage
+We track coverage for all our code on [Codecov](https://app.codecov.io/gh/n8n-io/n8n).
+But when you are working on tests locally, we recommend running your tests with env variable `COVERAGE_ENABLED` set to `true`. You can then view the code coverage in the `coverage` folder, or you can use [this VSCode extension](https://marketplace.visualstudio.com/items?itemName=ryanluker.vscode-coverage-gutters) to visualize the coverage directly in VSCode.
+
 #### E2E tests
 
 ⚠️ You have to run `pnpm cypress:install` to install cypress before running the tests for the first time and to update cypress.

jest.config.js

@@ -31,11 +31,11 @@ const config = {
 	setupFilesAfterEnv: ['jest-expect-message'],
 	collectCoverage: isCoverageEnabled,
 	coverageReporters: ['text-summary', 'lcov', 'html-spa'],
-	collectCoverageFrom: ['src/**/*.ts'],
 	workerIdleMemoryLimit: '1MB',
 };
 
 if (process.env.CI === 'true') {
+	config.collectCoverageFrom = ['src/**/*.ts'];
 	config.reporters = ['default', 'jest-junit'];
 	config.coverageReporters = ['cobertura'];
 }

packages/@n8n/vitest-config/frontend.mjs

@@ -11,16 +11,12 @@ export const vitestConfig = defineVitestConfig({
 		globals: true,
 		environment: 'jsdom',
 		setupFiles: ['./src/__tests__/setup.ts'],
-		...(process.env.COVERAGE_ENABLED === 'true'
-			? {
-					coverage: {
-						enabled: true,
-						provider: 'v8',
-						reporter: process.env.CI === 'true' ? 'cobertura' : 'text-summary',
-						all: true,
-					},
-				}
-			: {}),
+		coverage: {
+			enabled: false,
+			all: false,
+			provider: 'v8',
+			reporter: ['text-summary', 'lcov', 'html-spa'],
+		},
 		css: {
 			modules: {
 				classNameStrategy: 'non-scoped',
@@ -28,3 +24,12 @@ export const vitestConfig = defineVitestConfig({
 		},
 	},
 });
+
+if (process.env.COVERAGE_ENABLED === 'true') {
+	const { coverage } = vitestConfig.test;
+	coverage.enabled = true;
+	if (process.env.CI === 'true') {
+		coverage.all = true;
+		coverage.reporter = ['cobertura'];
+	}
+}