From 814591afb184553d429e75023cbbc60321402025 Mon Sep 17 00:00:00 2001 From: Rene Haas Date: Sat, 20 Aug 2022 13:40:37 +0200 Subject: [PATCH] improve playwright coverage --- .github/codecov.yml | 2 +- local/config/src/resolve.json | 2 +- local/playwright-tooling/index.d.ts | 2 +- .../playwright-tooling/src/collectCoverage.js | 15 +++------ .../src/playwrightRollup.js | 19 ++++------- local/rollup/src/bundle/plugins.js | 3 +- local/rollup/src/bundle/script.default.js | 3 +- local/rollup/src/bundle/script.esbuild.js | 11 ++++--- local/rollup/src/bundle/styles.js | 2 +- local/rollup/src/createRollupConfig.js | 6 ++++ .../createPlaywrightRollupConfig.js | 9 ++++- .../src/playwright/rollup.pluginIstanbul.js | 33 +++++++++++++++++++ 12 files changed, 70 insertions(+), 37 deletions(-) create mode 100644 local/rollup/src/playwright/rollup.pluginIstanbul.js diff --git a/.github/codecov.yml b/.github/codecov.yml index 241a28d..90fa8aa 100644 --- a/.github/codecov.yml +++ b/.github/codecov.yml @@ -15,4 +15,4 @@ flag_management: individual_flags: - name: overlayscrollbars paths: - - packages/overlayscrollbars + - 'packages/overlayscrollbars/**' \ No newline at end of file diff --git a/local/config/src/resolve.json b/local/config/src/resolve.json index 75bc653..0a50836 100644 --- a/local/config/src/resolve.json +++ b/local/config/src/resolve.json @@ -1,5 +1,5 @@ { - "extensions": [".json", ".js", "jsx", ".mjs", ".ts", ".tsx"], + "extensions": [".json", ".js", ".jsx", ".cjs", ".mjs", ".ts", ".tsx"], "directories": ["node_modules", "src"], "styleExtensions": [".scss", ".sass", ".css"] } diff --git a/local/playwright-tooling/index.d.ts b/local/playwright-tooling/index.d.ts index 9d4dfb0..5ef1038 100644 --- a/local/playwright-tooling/index.d.ts +++ b/local/playwright-tooling/index.d.ts @@ -1,4 +1,4 @@ declare module '@~local/playwright-tooling' { - export function playwrightRollup(): void; + export function playwrightRollup(useEsbuild?: boolean): void; export function expectSuccess(page: any): Promise; } diff --git a/local/playwright-tooling/src/collectCoverage.js b/local/playwright-tooling/src/collectCoverage.js index da5278b..0cefce1 100644 --- a/local/playwright-tooling/src/collectCoverage.js +++ b/local/playwright-tooling/src/collectCoverage.js @@ -1,22 +1,15 @@ const fs = require('fs'); const { basename, dirname, join } = require('path'); -const v8toIstanbul = require('v8-to-istanbul'); const { tmpCoverageDirectory } = require('@~local/config/playwright.coverage'); -module.exports = async (coverageOutputDir, sourceDir, coverage, testfile) => { - // eslint-disable-next-line no-restricted-syntax - for (const entry of coverage) { - process.chdir(sourceDir); - const converter = v8toIstanbul('', 0, { source: entry.source }); - // eslint-disable-next-line no-await-in-loop - await converter.load(); - converter.applyCoverage(entry.functions); - +module.exports = async (coverageOutputDir, coverage, testfile) => { + if (coverage) { + // eslint-disable-next-line no-restricted-syntax const coveragePath = join( coverageOutputDir, `${tmpCoverageDirectory}/${basename(dirname(testfile))}_${Date.now()}.json` ); fs.mkdirSync(dirname(coveragePath), { recursive: true }); - fs.writeFileSync(coveragePath, JSON.stringify(converter.toIstanbul())); + fs.writeFileSync(coveragePath, coverage); } }; diff --git a/local/playwright-tooling/src/playwrightRollup.js b/local/playwright-tooling/src/playwrightRollup.js index 81dac19..57dd3c5 100644 --- a/local/playwright-tooling/src/playwrightRollup.js +++ b/local/playwright-tooling/src/playwrightRollup.js @@ -54,10 +54,8 @@ const createRollupBundle = async (testDir, useEsbuild, dev) => { }; module.exports = (useEsbuild = true) => { - const originalCwd = process.cwd(); let url; let close; - let output; const isDev = (config, timeout) => config.globalTimeout === 0 && timeout === 0 && config.workers === 1; @@ -68,25 +66,20 @@ module.exports = (useEsbuild = true) => { test.setTimeout(0); } - ({ close, url, output } = await createRollupBundle( - dirname(file), - useEsbuild, - isDev(config, timeout) - )); + ({ close, url } = await createRollupBundle(dirname(file), useEsbuild, isDev(config, timeout))); }); - test.beforeEach(async ({ page, browserName }, { config, timeout }) => { + test.beforeEach(async ({ page }) => { await page.goto(url, { waitUntil: 'domcontentloaded' }); await page.waitForTimeout(500); - if (browserName === 'chromium' && !isDev(config, timeout)) { - await page.coverage.startJSCoverage(); - } }); test.afterEach(async ({ page, browserName }, { file, config, timeout }) => { if (browserName === 'chromium' && !isDev(config, timeout)) { - const coverage = await page.coverage.stopJSCoverage(); - await collectCoverage(originalCwd, dirname(output), coverage, file); + const coverageJSON = await page + .evaluate(() => JSON.stringify(window.__coverage__)) + .catch(() => null); + await collectCoverage(process.cwd(), coverageJSON, file); } }); diff --git a/local/rollup/src/bundle/plugins.js b/local/rollup/src/bundle/plugins.js index 14de853..99438f2 100644 --- a/local/rollup/src/bundle/plugins.js +++ b/local/rollup/src/bundle/plugins.js @@ -59,8 +59,9 @@ module.exports = { }); } }, - rollupEsBuild: () => + rollupEsBuild: (sourceMap) => rollupPluginEsBuild({ + sourceMap, include: /\.[jt]sx?$/, target: 'es6', }), diff --git a/local/rollup/src/bundle/script.default.js b/local/rollup/src/bundle/script.default.js index 41fec76..306be13 100644 --- a/local/rollup/src/bundle/script.default.js +++ b/local/rollup/src/bundle/script.default.js @@ -53,7 +53,6 @@ module.exports = (resolve, options) => { format, generatedCode, file: typeof filePathOverride === 'function' ? filePathOverride(filePath) : filePath, - plugins: (outputConfig.plugins || []).filter(Boolean), }; const output = [baseOutput, minifiedVersion && createMinifiedOutput(baseOutput)].filter( Boolean @@ -72,7 +71,7 @@ module.exports = (resolve, options) => { rollupCommonjs(sourcemap, resolve), rollupBabel(resolve, generatedCode === 'es2015'), ...plugins, - ].filter(Boolean), + ], }; }) .flat(); diff --git a/local/rollup/src/bundle/script.esbuild.js b/local/rollup/src/bundle/script.esbuild.js index 18f249a..5825d83 100644 --- a/local/rollup/src/bundle/script.esbuild.js +++ b/local/rollup/src/bundle/script.esbuild.js @@ -5,10 +5,11 @@ const { rollupResolve, rollupAlias, rollupScss, + rollupLicense, } = require('./plugins'); module.exports = (resolve, options) => { - const { rollup, paths, alias, extractStyles } = options; + const { rollup, paths, alias, extractStyles, banner } = options; const { output: rollupOutput, input, plugins = [], ...rollupOptions } = rollup; const { file, sourcemap: rawSourcemap, ...outputConfig } = rollupOutput; const { dist: distPath } = paths; @@ -16,11 +17,10 @@ module.exports = (resolve, options) => { const output = { ...outputConfig, - sourcemap: true, + sourcemap, format: 'esm', generatedCode: 'es2015', file: path.resolve(distPath, `${file}.js`), - plugins: (outputConfig.plugins || []).filter(Boolean), }; return { @@ -28,12 +28,13 @@ module.exports = (resolve, options) => { output, ...rollupOptions, plugins: [ + rollupLicense(banner, sourcemap), rollupAlias(alias), rollupScss(resolve, sourcemap, extractStyles, false), - rollupEsBuild(), + rollupEsBuild(sourcemap), rollupCommonjs(sourcemap, resolve), rollupResolve(resolve), ...plugins, - ].filter(Boolean), + ], }; }; diff --git a/local/rollup/src/bundle/styles.js b/local/rollup/src/bundle/styles.js index a7758dd..cc416b5 100644 --- a/local/rollup/src/bundle/styles.js +++ b/local/rollup/src/bundle/styles.js @@ -20,7 +20,7 @@ module.exports = (resolve, options) => { banner, minified ), - rollupEsBuild(), + rollupEsBuild(false), rollupResolve(resolve, (module) => resolve.styleExtensions.some((ext) => module.endsWith(ext)) ), diff --git a/local/rollup/src/createRollupConfig.js b/local/rollup/src/createRollupConfig.js index 721fc0c..002ac51 100644 --- a/local/rollup/src/createRollupConfig.js +++ b/local/rollup/src/createRollupConfig.js @@ -84,6 +84,8 @@ const mergeAndResolveOptions = (userOptions) => { }, }; const { dist, types, styles } = mergedOptions.paths; + const pluginFromFn = (plugin) => + typeof plugin === 'function' ? plugin(mergedOptions, workspaceRoot, workspaces) : plugin; mergedOptions.paths.dist = resolvePath(projectPath, dist); mergedOptions.paths.types = resolvePath(projectPath, types); @@ -95,6 +97,10 @@ const mergeAndResolveOptions = (userOptions) => { name: mergedOptions.rollup.output?.name || mergedOptions.project, file: mergedOptions.rollup.output?.file || mergedOptions.project.toLocaleLowerCase(), }; + mergedOptions.rollup.plugins = + mergedOptions.rollup.plugins?.map(pluginFromFn).filter(Boolean) || []; + mergedOptions.rollup.output.plugins = + mergedOptions.rollup.output?.plugins?.map(pluginFromFn).filter(Boolean) || []; return mergedOptions; }; diff --git a/local/rollup/src/playwright/createPlaywrightRollupConfig.js b/local/rollup/src/playwright/createPlaywrightRollupConfig.js index 6e21d28..3fe3c50 100644 --- a/local/rollup/src/playwright/createPlaywrightRollupConfig.js +++ b/local/rollup/src/playwright/createPlaywrightRollupConfig.js @@ -5,10 +5,12 @@ const path = require('path'); const rollupPluginStyles = require('rollup-plugin-styles'); const rollupPluginServe = require('rollup-plugin-serve'); const rollupPluginLivereload = require('rollup-plugin-livereload'); +const resolve = require('@~local/config/resolve'); const rollupPluginHtml = require('./rollup.pluginHtml'); const createRollupConfig = require('../createRollupConfig'); const rollupAdditionalWatchFiles = require('./rollup.pluginAdditionalWatchFiles'); +const rollupIstanbul = require('./rollup.pluginIstanbul'); const portRange = { min: 20000, @@ -80,7 +82,7 @@ module.exports = (testDir, useEsbuild, dev) => { context: 'this', moduleContext: () => 'this', output: { - sourcemap: isDev, + sourcemap: !isDev, }, plugins: [ rollupPluginStyles(), @@ -104,6 +106,11 @@ module.exports = (testDir, useEsbuild, dev) => { port: port - 1, verbose: false, }), + !isDev && + rollupIstanbul({ + include: resolve.extensions.map((extension) => `/**/*${extension}`).flat(), + exclude: ['**/node_modules/**', `**/${path.relative(process.cwd(), testDir)}/**`], + }), ], }, }); diff --git a/local/rollup/src/playwright/rollup.pluginIstanbul.js b/local/rollup/src/playwright/rollup.pluginIstanbul.js new file mode 100644 index 0000000..f4c80ad --- /dev/null +++ b/local/rollup/src/playwright/rollup.pluginIstanbul.js @@ -0,0 +1,33 @@ +const { createFilter } = require('@rollup/pluginutils'); +const istanbul = require('istanbul-lib-instrument'); + +module.exports = (options = {}) => { + const filter = createFilter(options.include, options.exclude); + + return { + name: 'istanbul', + transform(code, id) { + if (!filter(id)) { + return; + } + + const instrumenter = istanbul.createInstrumenter({ + esModules: true, + compact: true, + produceSourceMap: true, + autoWrap: true, + preserveComments: true, + ...options.instrumenterConfig, + }); + + const combinedSourceMap = this.getCombinedSourcemap(); + const instrumentedCode = instrumenter.instrumentSync(code, id, { + ...combinedSourceMap, + version: String(combinedSourceMap.version), + }); + const sourceMap = instrumenter.lastSourceMap(); + + return { code: instrumentedCode, map: { ...sourceMap, version: Number(sourceMap.version) } }; + }, + }; +};