From 8ddf3eed2dcf8b35e61e5a135abf58d38ee48868 Mon Sep 17 00:00:00 2001 From: Yann Braga Date: Tue, 30 Jan 2024 17:46:16 +0100 Subject: [PATCH] prebundle dependencies --- .storybook/test-runner.ts | 2 +- package.json | 93 ++++++++++++++------------- playwright/custom-environment.js | 2 +- playwright/test-runner-jest.config.js | 2 +- playwright/transform.js | 2 +- src/config/jest-playwright.ts | 4 +- src/index.ts | 1 + src/setup-page.ts | 9 ++- tsup.config.ts | 20 ++++-- yarn.lock | 61 ++++++++++++++++++ 10 files changed, 137 insertions(+), 59 deletions(-) diff --git a/.storybook/test-runner.ts b/.storybook/test-runner.ts index caed9e28..11045b57 100644 --- a/.storybook/test-runner.ts +++ b/.storybook/test-runner.ts @@ -1,5 +1,5 @@ import { toMatchImageSnapshot } from 'jest-image-snapshot'; -import { getStoryContext, waitForPageReady } from '../dist/playwright/hooks'; +import { getStoryContext, waitForPageReady } from '../dist'; import type { TestRunnerConfig } from '../dist'; const snapshotsDir = process.env.SNAPSHOTS_DIR || '__snapshots__'; diff --git a/package.json b/package.json index b315d141..d20a7ddf 100644 --- a/package.json +++ b/package.json @@ -14,8 +14,8 @@ "type": "git", "url": "https://github.com/storybookjs/test-runner" }, - "author": "shilman", "license": "MIT", + "author": "shilman", "main": "dist/index.js", "module": "dist/index.mjs", "types": "dist/index.d.ts", @@ -30,22 +30,48 @@ ], "scripts": { "build": "tsup", - "build:watch": "tsup --watch", - "test": "jest", - "storybook": "storybook dev -p 6006", - "start": "concurrently \"yarn build:watch\" \"yarn storybook -- --quiet\"", "build-storybook": "storybook build", + "build:watch": "tsup --watch", + "generate-dynamic-stories": "node scripts/generate-dynamic-stories.js", + "prepare": "husky install", "release": "yarn build && auto shipit", + "start": "concurrently \"yarn build:watch\" \"yarn storybook -- --quiet\"", + "storybook": "storybook dev -p 6006", + "test": "jest", "test-storybook": "node dist/test-storybook", - "test-storybook:failures": "SKIP_SNAPSHOTS=true TEST_FAILURES=1 yarn test-storybook --json --failOnConsole --outputFile test-results.json", - "test-storybook:no-cache": "yarn test-storybook --no-cache", - "test-storybook:json": "yarn test-storybook --stories-json", "test-storybook:ci": "concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"yarn build-storybook --quiet && npx serve storybook-static -l 6006\" \"wait-on tcp:6006 && yarn test-storybook\"", - "test-storybook:ci-failures": "concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"TEST_FAILURES=1 yarn build-storybook --quiet && npx serve storybook-static -l 6006\" \"wait-on tcp:6006 && yarn test-storybook:failures\"", "test-storybook:ci-coverage": "concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"yarn build-storybook --quiet && npx serve storybook-static -l 6006\" \"wait-on tcp:6006 && yarn test-storybook --coverage\"", + "test-storybook:ci-failures": "concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"TEST_FAILURES=1 yarn build-storybook --quiet && npx serve storybook-static -l 6006\" \"wait-on tcp:6006 && yarn test-storybook:failures\"", "test-storybook:ci-json": "concurrently -k -s first -n \"SB,TEST\" -c \"magenta,blue\" \"yarn build-storybook --quiet && npx serve storybook-static -l 6006\" \"wait-on tcp:6006 && SKIP_SNAPSHOTS=true yarn test-storybook:json\"", - "generate-dynamic-stories": "node scripts/generate-dynamic-stories.js", - "prepare": "husky install" + "test-storybook:failures": "SKIP_SNAPSHOTS=true TEST_FAILURES=1 yarn test-storybook --json --failOnConsole --outputFile test-results.json", + "test-storybook:json": "yarn test-storybook --stories-json", + "test-storybook:no-cache": "yarn test-storybook --no-cache" + }, + "lint-staged": { + "*.{ts,js,tsx,jsx,css,md}": "prettier --write" + }, + "dependencies": { + "@babel/core": "^7.22.5", + "@babel/generator": "^7.22.5", + "@babel/template": "^7.22.5", + "@babel/types": "^7.22.5", + "@jest/types": "^29.6.3", + "@storybook/core-common": "next", + "@storybook/csf": "^0.1.2", + "@storybook/csf-tools": "next", + "@storybook/preview-api": "next", + "@swc/core": "^1.3.18", + "@swc/jest": "^0.2.23", + "expect-playwright": "^0.8.0", + "jest": "^29.6.4", + "jest-circus": "^29.6.4", + "jest-environment-node": "^29.6.4", + "jest-junit": "^16.0.0", + "jest-playwright-preset": "^4.0.0", + "jest-runner": "^29.6.4", + "jest-serializer-html": "^7.1.0", + "jest-watch-typeahead": "^2.0.0", + "playwright": "^1.14.0" }, "devDependencies": { "@auto-it/released": "^11.0.1", @@ -66,62 +92,37 @@ "babel-jest": "^29.0.0", "babel-loader": "^8.1.0", "babel-plugin-istanbul": "^6.1.1", + "can-bind-to-host": "^1.1.1", + "commander": "^9.0.0", "concurrently": "^7.0.0", "detect-package-manager": "^3.0.1", + "glob": "^10.2.2", "husky": "^8.0.0", "jest-image-snapshot": "^6.2.0", "lint-staged": "^13.0.3", + "node-fetch": "^2", + "pkg-up": "^5.0.0", "prettier": "^2.8.1", "react": "^17.0.1", "react-dom": "^17.0.1", + "read-pkg-up": "^7.0.1", "rimraf": "^3.0.2", "semver": "^7.5.4", "storybook": "next", + "tempy": "^1.0.1", + "ts-dedent": "^2.0.0", "ts-jest": "^29.0.0", "tsup": "^6.5.0", "typescript": "~4.9.4", "vite": "^4.4.5", "wait-on": "^7.2.0" }, - "lint-staged": { - "*.{ts,js,tsx,jsx,css,md}": "prettier --write" + "engines": { + "node": "^16.10.0 || ^18.0.0 || >=20.0.0" }, "publishConfig": { "access": "public" }, - "dependencies": { - "@babel/core": "^7.22.5", - "@babel/generator": "^7.22.5", - "@babel/template": "^7.22.5", - "@babel/types": "^7.22.5", - "@jest/types": "^29.6.3", - "@storybook/core-common": "next", - "@storybook/csf": "^0.1.2", - "@storybook/csf-tools": "next", - "@storybook/preview-api": "next", - "@swc/core": "^1.3.18", - "@swc/jest": "^0.2.23", - "can-bind-to-host": "^1.1.1", - "commander": "^9.0.0", - "expect-playwright": "^0.8.0", - "glob": "^10.2.2", - "jest": "^29.6.4", - "jest-circus": "^29.6.4", - "jest-environment-node": "^29.6.4", - "jest-junit": "^16.0.0", - "jest-playwright-preset": "^4.0.0", - "jest-runner": "^29.6.4", - "jest-serializer-html": "^7.1.0", - "jest-watch-typeahead": "^2.0.0", - "node-fetch": "^2", - "playwright": "^1.14.0", - "read-pkg-up": "^7.0.1", - "tempy": "^1.0.1", - "ts-dedent": "^2.0.0" - }, - "engines": { - "node": "^16.10.0 || ^18.0.0 || >=20.0.0" - }, "auto": { "prereleaseBranches": [ "next", diff --git a/playwright/custom-environment.js b/playwright/custom-environment.js index 97a52883..fcf6632d 100644 --- a/playwright/custom-environment.js +++ b/playwright/custom-environment.js @@ -1,4 +1,4 @@ -const { setupPage } = require('../dist/setup-page'); +const { setupPage } = require('../dist'); const PlaywrightEnvironment = require('jest-playwright-preset/lib/PlaywrightEnvironment').default; diff --git a/playwright/test-runner-jest.config.js b/playwright/test-runner-jest.config.js index bd81baef..297a9fb1 100644 --- a/playwright/test-runner-jest.config.js +++ b/playwright/test-runner-jest.config.js @@ -1,4 +1,4 @@ -const { getJestConfig } = require('@storybook/test-runner'); +const { getJestConfig } = require('../dist'); // The default Jest configuration comes from @storybook/test-runner const testRunnerConfig = getJestConfig(); diff --git a/playwright/transform.js b/playwright/transform.js index 31a7f3bb..b2e6b2f6 100644 --- a/playwright/transform.js +++ b/playwright/transform.js @@ -1,5 +1,5 @@ const { transformSync: swcTransform } = require('@swc/core'); -const { transformPlaywright } = require('../dist/playwright/transformPlaywright'); +const { transformPlaywright } = require('../dist'); module.exports = { process(src, filename) { diff --git a/src/config/jest-playwright.ts b/src/config/jest-playwright.ts index e7a35a25..d19be5f5 100644 --- a/src/config/jest-playwright.ts +++ b/src/config/jest-playwright.ts @@ -2,7 +2,7 @@ import path from 'path'; import { getProjectRoot } from '@storybook/core-common'; import type { Config } from '@jest/types'; -const TEST_RUNNER_PATH = process.env.STORYBOOK_TEST_RUNNER_PATH ?? '@storybook/test-runner'; +const getTestRunnerPath = () => process.env.STORYBOOK_TEST_RUNNER_PATH ?? '@storybook/test-runner'; /** * IMPORTANT NOTE: @@ -17,6 +17,7 @@ const TEST_RUNNER_PATH = process.env.STORYBOOK_TEST_RUNNER_PATH ?? '@storybook/t * necessary moving parts are all required within the correct path. * */ const getJestPlaywrightConfig = (): Config.InitialOptions => { + const TEST_RUNNER_PATH = getTestRunnerPath(); const presetBasePath = path.dirname( require.resolve('jest-playwright-preset', { paths: [path.join(__dirname, '../node_modules')], @@ -71,6 +72,7 @@ export const getJestConfig = (): Config.InitialOptions => { const reporters = STORYBOOK_JUNIT ? ['default', jestJunitPath] : ['default']; const testMatch = STORYBOOK_STORIES_PATTERN?.split(';') ?? []; + const TEST_RUNNER_PATH = getTestRunnerPath(); const config: Config.InitialOptions = { rootDir: getProjectRoot(), diff --git a/src/index.ts b/src/index.ts index 48acf35d..5ff6e3a6 100644 --- a/src/index.ts +++ b/src/index.ts @@ -2,3 +2,4 @@ export * from './playwright/hooks'; export * from './config/jest-playwright'; export * from './setup-page'; export * from './util/getTestRunnerConfig'; +export * from './playwright/transformPlaywright'; diff --git a/src/setup-page.ts b/src/setup-page.ts index 3a137f0b..1edb92d8 100644 --- a/src/setup-page.ts +++ b/src/setup-page.ts @@ -1,5 +1,6 @@ import type { Page, BrowserContext } from 'playwright'; import readPackageUp, { NormalizedReadResult } from 'read-pkg-up'; +import { pkgUp } from 'pkg-up'; import { PrepareContext } from './playwright/hooks'; import { getTestRunnerConfig } from './util/getTestRunnerConfig'; import { readFile } from 'node:fs/promises'; @@ -61,7 +62,13 @@ export const setupPage = async (page: Page, browserContext: BrowserContext) => { await page.exposeBinding('logToPage', (_, message) => console.log(message)); const finalStorybookUrl = referenceURL ?? targetURL ?? ''; - const scriptLocation = require.resolve(path.join(__dirname, 'setup-page-script.mjs')); + const testRunnerPackageLocation = await pkgUp({ cwd: __dirname }); + if (!testRunnerPackageLocation) throw new Error('Could not find test-runner package location'); + const scriptLocation = path.join( + path.dirname(testRunnerPackageLocation), + 'dist', + 'setup-page-script.mjs' + ); // read the content of setup-page-script.mjs and replace the placeholders with the actual values const content = (await readFile(scriptLocation, 'utf-8')) diff --git a/tsup.config.ts b/tsup.config.ts index 0e0ae64d..f0474e64 100644 --- a/tsup.config.ts +++ b/tsup.config.ts @@ -3,19 +3,25 @@ import { defineConfig } from 'tsup'; export default defineConfig([ { clean: true, - entry: [ - './src/**/*.{js,jsx,ts,tsx}', - '!./src/**/*.d.{js,jsx,ts,tsx}', - '!./src/**/*test.{js,jsx,ts,tsx}', - ], + entry: ['./src/index.ts', './src/test-storybook.ts'], format: ['cjs', 'esm'], splitting: false, dts: true, minify: false, treeshake: false, - bundle: false, - esbuildOptions(options, context) { + bundle: true, + platform: 'node', + external: ['@storybook/test-runner'], + esbuildOptions(options) { options.platform = 'node'; }, }, + { + entry: ['./src/setup-page-script.ts'], + format: ['esm'], + dts: false, + bundle: false, + treeshake: false, + platform: 'browser', + }, ]); diff --git a/yarn.lock b/yarn.lock index 5f25fe7e..9c116fd5 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3666,6 +3666,7 @@ __metadata: jest-watch-typeahead: ^2.0.0 lint-staged: ^13.0.3 node-fetch: ^2 + pkg-up: ^5.0.0 playwright: ^1.14.0 prettier: ^2.8.1 react: ^17.0.1 @@ -7133,6 +7134,16 @@ __metadata: languageName: node linkType: hard +"find-up@npm:^6.2.0": + version: 6.3.0 + resolution: "find-up@npm:6.3.0" + dependencies: + locate-path: ^7.1.0 + path-exists: ^5.0.0 + checksum: 9a21b7f9244a420e54c6df95b4f6fc3941efd3c3e5476f8274eb452f6a85706e7a6a90de71353ee4f091fcb4593271a6f92810a324ec542650398f928783c280 + languageName: node + linkType: hard + "flow-parser@npm:0.*": version: 0.221.0 resolution: "flow-parser@npm:0.221.0" @@ -9340,6 +9351,15 @@ __metadata: languageName: node linkType: hard +"locate-path@npm:^7.1.0": + version: 7.2.0 + resolution: "locate-path@npm:7.2.0" + dependencies: + p-locate: ^6.0.0 + checksum: c1b653bdf29beaecb3d307dfb7c44d98a2a98a02ebe353c9ad055d1ac45d6ed4e1142563d222df9b9efebc2bcb7d4c792b507fad9e7150a04c29530b7db570f8 + languageName: node + linkType: hard + "lodash.camelcase@npm:^4.3.0": version: 4.3.0 resolution: "lodash.camelcase@npm:4.3.0" @@ -10223,6 +10243,15 @@ __metadata: languageName: node linkType: hard +"p-limit@npm:^4.0.0": + version: 4.0.0 + resolution: "p-limit@npm:4.0.0" + dependencies: + yocto-queue: ^1.0.0 + checksum: 01d9d70695187788f984226e16c903475ec6a947ee7b21948d6f597bed788e3112cc7ec2e171c1d37125057a5f45f3da21d8653e04a3a793589e12e9e80e756b + languageName: node + linkType: hard + "p-locate@npm:^2.0.0": version: 2.0.0 resolution: "p-locate@npm:2.0.0" @@ -10259,6 +10288,15 @@ __metadata: languageName: node linkType: hard +"p-locate@npm:^6.0.0": + version: 6.0.0 + resolution: "p-locate@npm:6.0.0" + dependencies: + p-limit: ^4.0.0 + checksum: 2bfe5234efa5e7a4e74b30a5479a193fdd9236f8f6b4d2f3f69e3d286d9a7d7ab0c118a2a50142efcf4e41625def635bd9332d6cbf9cc65d85eb0718c579ab38 + languageName: node + linkType: hard + "p-map@npm:^3.0.0": version: 3.0.0 resolution: "p-map@npm:3.0.0" @@ -10394,6 +10432,13 @@ __metadata: languageName: node linkType: hard +"path-exists@npm:^5.0.0": + version: 5.0.0 + resolution: "path-exists@npm:5.0.0" + checksum: 8ca842868cab09423994596eb2c5ec2a971c17d1a3cb36dbf060592c730c725cd524b9067d7d2a1e031fef9ba7bd2ac6dc5ec9fb92aa693265f7be3987045254 + languageName: node + linkType: hard + "path-is-absolute@npm:^1.0.0": version: 1.0.1 resolution: "path-is-absolute@npm:1.0.1" @@ -10572,6 +10617,15 @@ __metadata: languageName: node linkType: hard +"pkg-up@npm:^5.0.0": + version: 5.0.0 + resolution: "pkg-up@npm:5.0.0" + dependencies: + find-up: ^6.2.0 + checksum: dccefcfb96f5d7b976a27038e7c065384d3068b418bcb0626b65cf77e96d9e9afab622cf207b11d79ba37501b6f933b8612edb9f904a5f8daf120f3095f249ac + languageName: node + linkType: hard + "playwright-core@npm:1.39.0, playwright-core@npm:>=1.2.0": version: 1.39.0 resolution: "playwright-core@npm:1.39.0" @@ -13369,3 +13423,10 @@ __metadata: checksum: f77b3d8d00310def622123df93d4ee654fc6a0096182af8bd60679ddcdfb3474c56c6c7190817c84a2785648cdee9d721c0154eb45698c62176c322fb46fc700 languageName: node linkType: hard + +"yocto-queue@npm:^1.0.0": + version: 1.0.0 + resolution: "yocto-queue@npm:1.0.0" + checksum: 2cac84540f65c64ccc1683c267edce396b26b1e931aa429660aefac8fbe0188167b7aee815a3c22fa59a28a58d898d1a2b1825048f834d8d629f4c2a5d443801 + languageName: node + linkType: hard