diff --git a/package.json b/package.json index f10b4ac0..76fab6b6 100644 --- a/package.json +++ b/package.json @@ -53,7 +53,6 @@ "@babel/preset-env": "^7.19.4", "@babel/preset-react": "^7.18.6", "@babel/preset-typescript": "^7.18.6", - "@jest/types": "^29.6.3", "@storybook/addon-coverage": "^0.0.9", "@storybook/addon-essentials": "^7.3.0", "@storybook/addon-interactions": "^7.3.0", @@ -96,6 +95,7 @@ "@babel/generator": "^7.22.5", "@babel/template": "^7.22.5", "@babel/types": "^7.22.5", + "@jest/types": "^29.6.3", "@storybook/core-common": "^7.0.0-beta.0 || ^7.0.0-rc.0 || ^7.0.0", "@storybook/csf": "^0.1.1", "@storybook/csf-tools": "^7.0.0-beta.0 || ^7.0.0-rc.0 || ^7.0.0", diff --git a/src/config/jest-playwright.ts b/src/config/jest-playwright.ts index bcb0d766..ef82629c 100644 --- a/src/config/jest-playwright.ts +++ b/src/config/jest-playwright.ts @@ -1,7 +1,8 @@ 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 TEST_RUNNER_PATH = process.env.STORYBOOK_TEST_RUNNER_PATH ?? '@storybook/test-runner'; /** * IMPORTANT NOTE: @@ -15,7 +16,7 @@ const TEST_RUNNER_PATH = process.env.STORYBOOK_TEST_RUNNER_PATH || '@storybook/t * This function does the same thing as `preset: 'jest-playwright-preset` but makes sure that the * necessary moving parts are all required within the correct path. * */ -const getJestPlaywrightConfig = () => { +const getJestPlaywrightConfig = (): Config.InitialOptions => { const presetBasePath = path.dirname( require.resolve('jest-playwright-preset', { paths: [path.join(__dirname, '../node_modules')], @@ -28,18 +29,18 @@ const getJestPlaywrightConfig = () => { ); return { runner: path.join(presetBasePath, 'runner.js'), - globalSetup: require.resolve(TEST_RUNNER_PATH + '/playwright/global-setup.js'), - globalTeardown: require.resolve(TEST_RUNNER_PATH + '/playwright/global-teardown.js'), - testEnvironment: require.resolve(TEST_RUNNER_PATH + '/playwright/custom-environment.js'), + globalSetup: require.resolve(`${TEST_RUNNER_PATH}/playwright/global-setup.js`), + globalTeardown: require.resolve(`${TEST_RUNNER_PATH}/playwright/global-teardown.js`), + testEnvironment: require.resolve(`${TEST_RUNNER_PATH}/playwright/custom-environment.js`), setupFilesAfterEnv: [ - require.resolve(TEST_RUNNER_PATH + '/playwright/jest-setup.js'), + require.resolve(`${TEST_RUNNER_PATH}/playwright/jest-setup.js`), expectPlaywrightPath, path.join(presetBasePath, 'lib', 'extends.js'), ], }; }; -export const getJestConfig = () => { +export const getJestConfig = (): Config.InitialOptions => { const { TEST_ROOT, TEST_MATCH, @@ -69,16 +70,16 @@ export const getJestConfig = () => { const reporters = STORYBOOK_JUNIT ? ['default', jestJunitPath] : ['default']; - const testMatch = (STORYBOOK_STORIES_PATTERN && STORYBOOK_STORIES_PATTERN.split(';')) || []; + const testMatch = STORYBOOK_STORIES_PATTERN?.split(';') ?? []; - let config = { + const config: Config.InitialOptions = { rootDir: getProjectRoot(), roots: TEST_ROOT ? [TEST_ROOT] : undefined, reporters, testMatch, transform: { '^.+\\.(story|stories)\\.[jt]sx?$': require.resolve( - TEST_RUNNER_PATH + '/playwright/transform' + `${TEST_RUNNER_PATH}/playwright/transform` ), '^.+\\.[jt]sx?$': swcJestPath, }, diff --git a/src/csf/transformCsf.ts b/src/csf/transformCsf.ts index bbb37a86..a1b49eb5 100644 --- a/src/csf/transformCsf.ts +++ b/src/csf/transformCsf.ts @@ -58,7 +58,7 @@ const makePlayTest = ( title: string, metaOrStoryPlay: t.Node, testPrefix?: TestPrefixer -): t.Statement[] => { +): t.ExpressionStatement[] => { return [ t.expressionStatement( t.callExpression(t.identifier('it'), [ @@ -73,7 +73,7 @@ const makeDescribe = ( key: string, tests: t.Statement[], beforeEachBlock?: t.ExpressionStatement -): t.Statement | null => { +): t.ExpressionStatement => { const blockStatements = beforeEachBlock ? [beforeEachBlock, ...tests] : tests; return t.expressionStatement( t.callExpression(t.identifier('describe'), [ @@ -108,13 +108,13 @@ export const transformCsf = ( const storyExports = Object.keys(csf._stories); const title = csf.meta?.title; - const storyPlays = storyExports.reduce((acc, key) => { + const storyPlays = storyExports.reduce>((acc, key) => { const annotations = csf._storyAnnotations[key]; if (annotations?.play) { acc[key] = annotations.play; } return acc; - }, {} as Record); + }, {}); const playTests = storyExports .map((key: string) => { let tests: t.Statement[] = []; diff --git a/src/playwright/transformPlaywrightJson.ts b/src/playwright/transformPlaywrightJson.ts index 45486ce6..543c1d1d 100644 --- a/src/playwright/transformPlaywrightJson.ts +++ b/src/playwright/transformPlaywrightJson.ts @@ -63,12 +63,12 @@ function v3TitleMapToV4TitleMap(titleIdToStories: Record) { } function groupByTitleId(entries: T[]) { - return entries.reduce((acc, entry) => { + return entries.reduce>((acc, entry) => { const titleId = toId(entry.title); acc[titleId] = acc[titleId] || []; acc[titleId].push(entry); return acc; - }, {} as { [key: string]: T[] }); + }, {}); } /** @@ -88,18 +88,21 @@ export const transformPlaywrightJson = (index: V3StoriesIndex | V4Index | Unsupp throw new Error(`Unsupported version ${index.v}`); } - const titleIdToTest = Object.entries(titleIdToEntries).reduce((acc, [titleId, entries]) => { - const stories = entries.filter((s) => s.type !== 'docs'); - if (stories.length) { - const storyTests = stories.map((story) => makeDescribe(story.name, [makeTest(story)])); - const program = t.program([makeDescribe(stories[0].title, storyTests)]) as babel.types.Node; + const titleIdToTest = Object.entries(titleIdToEntries).reduce>( + (acc, [titleId, entries]) => { + const stories = entries.filter((s) => s.type !== 'docs'); + if (stories.length) { + const storyTests = stories.map((story) => makeDescribe(story.name, [makeTest(story)])); + const program = t.program([makeDescribe(stories[0].title, storyTests)]) as babel.types.Node; - const { code } = generate(program, {}); + const { code } = generate(program, {}); - acc[titleId] = code; - } - return acc; - }, {} as { [key: string]: string }); + acc[titleId] = code; + } + return acc; + }, + {} + ); return titleIdToTest; }; diff --git a/src/typings.d.ts b/src/typings.d.ts index 4bf84d6a..33211726 100644 --- a/src/typings.d.ts +++ b/src/typings.d.ts @@ -1,7 +1,11 @@ import { TestHook } from './playwright/hooks'; - +import { type setupPage } from './setup-page'; +import type { StoryContext, StoryIdentifiers } from '@storybook/csf'; declare global { var __sbPreRender: TestHook; var __sbPostRender: TestHook; var __getContext: (storyId: string) => any; + var __getContext: (storyId: string) => StoryContext | StoryIdentifiers; + var __sbSetupPage: typeof setupPage; + var __sbCollectCoverage: boolean; }