diff --git a/README.md b/README.md index 5799dbc6..c628b0a3 100644 --- a/README.md +++ b/README.md @@ -100,18 +100,19 @@ yarn test-storybook Usage: test-storybook [options] ``` -| Options | Description | -| ------------------------------- | ------------------------------------------------------------------------------------------------------------------------- | -| `--help` | Output usage information
`test-storybook --help` | -| `-s`, `--stories-json` | Run in stories json mode (requires a compatible Storybook)
`test-storybook --stories-json` | -| `-c`, `--config-dir [dir-name]` | Directory where to load Storybook configurations from
`test-storybook -c .storybook` | -| `--watch` | Run in watch mode
`test-storybook --watch` | -| `--maxWorkers [amount]` | Specifies the maximum number of workers the worker-pool will spawn for running tests
`test-storybook --maxWorkers=2` | -| `--no-cache` | Disable the cache
`test-storybook --no-cache` | -| `--clearCache` | Deletes the Jest cache directory and then exits without running tests
`test-storybook --clearCache` | -| `--verbose` | Display individual test results with the test suite hierarchy
`test-storybook --verbose` | -| `-u`, `--updateSnapshot` | Use this flag to re-record every snapshot that fails during this test run
`test-storybook -u` | -| `--eject` | Creates a local configuration file to override defaults of the test-runner
`test-storybook --eject` | +| Options | Description | +| ------------------------------- | -------------------------------------------------------------------------------------------------------------------------------- | +| `--help` | Output usage information
`test-storybook --help` | +| `-s`, `--stories-json` | Run in stories json mode (requires a compatible Storybook)
`test-storybook --stories-json` | +| `-c`, `--config-dir [dir-name]` | Directory where to load Storybook configurations from
`test-storybook -c .storybook` | +| `--watch` | Run in watch mode
`test-storybook --watch` | +| `--browsers` | Define browsers to run tests in. One or multiple of: chromium, firefox, webkit
`test-storybook --browsers firefox chromium` | +| `--maxWorkers [amount]` | Specifies the maximum number of workers the worker-pool will spawn for running tests
`test-storybook --maxWorkers=2` | +| `--no-cache` | Disable the cache
`test-storybook --no-cache` | +| `--clearCache` | Deletes the Jest cache directory and then exits without running tests
`test-storybook --clearCache` | +| `--verbose` | Display individual test results with the test suite hierarchy
`test-storybook --verbose` | +| `-u`, `--updateSnapshot` | Use this flag to re-record every snapshot that fails during this test run
`test-storybook -u` | +| `--eject` | Creates a local configuration file to override defaults of the test-runner
`test-storybook --eject` | ## Configuration diff --git a/bin/test-storybook.js b/bin/test-storybook.js index 8337577b..512ee394 100755 --- a/bin/test-storybook.js +++ b/bin/test-storybook.js @@ -137,6 +137,11 @@ const main = async () => { const targetURL = sanitizeURL(process.env.TARGET_URL || `http://localhost:6006`); await checkStorybook(targetURL); + // Use TEST_BROWSERS if set, otherwise get from --browser option + if (!process.env.TEST_BROWSERS && runnerOptions.browsers) { + process.env.TEST_BROWSERS = runnerOptions.browsers.join(','); + } + if (runnerOptions.storiesJson) { storiesJsonTmpDir = await fetchStoriesJson(targetURL); process.env.TEST_ROOT = storiesJsonTmpDir; diff --git a/src/config/jest-playwright.ts b/src/config/jest-playwright.ts index 59b68117..02edac1f 100644 --- a/src/config/jest-playwright.ts +++ b/src/config/jest-playwright.ts @@ -1,5 +1,5 @@ export const getJestConfig = () => { - const { TEST_ROOT, TEST_MATCH, STORYBOOK_STORIES_PATTERN } = process.env; + const { TEST_ROOT, TEST_MATCH, STORYBOOK_STORIES_PATTERN, TEST_BROWSERS } = process.env; let config = { rootDir: process.cwd(), @@ -14,6 +14,13 @@ export const getJestConfig = () => { globalTeardown: '@storybook/test-runner/playwright/global-teardown.js', testEnvironment: '@storybook/test-runner/playwright/custom-environment.js', setupFilesAfterEnv: ['@storybook/test-runner/playwright/jest-setup.js'], + testEnvironmentOptions: { + 'jest-playwright': { + browsers: TEST_BROWSERS.split(',') + .map((p) => p.trim().toLowerCase()) + .filter(Boolean), + }, + }, }; if (TEST_MATCH) { diff --git a/src/util/getCliOptions.test.ts b/src/util/getCliOptions.test.ts index 231b14ea..3a906bff 100644 --- a/src/util/getCliOptions.test.ts +++ b/src/util/getCliOptions.test.ts @@ -1,12 +1,7 @@ -import { defaultRunnerOptions, getCliOptions } from './getCliOptions'; +import { getCliOptions } from './getCliOptions'; import * as cliHelper from './getParsedCliOptions'; describe('getCliOptions', () => { - it('returns default options if no extra option is passed', () => { - const opts = getCliOptions(); - expect(opts.runnerOptions).toMatchObject(defaultRunnerOptions); - }); - it('returns custom options if passed', () => { const customConfig = { configDir: 'custom', storiesJson: true }; jest diff --git a/src/util/getCliOptions.ts b/src/util/getCliOptions.ts index 514e4123..d8ad86ef 100644 --- a/src/util/getCliOptions.ts +++ b/src/util/getCliOptions.ts @@ -1,28 +1,30 @@ import { getParsedCliOptions } from './getParsedCliOptions'; +import type { BrowserType } from 'jest-playwright-preset'; type CliOptions = { runnerOptions: { - storiesJson: boolean; - configDir: string; + storiesJson?: boolean; + configDir?: string; eject?: boolean; + browsers?: BrowserType | BrowserType[]; }; jestOptions: string[]; }; type StorybookRunnerCommand = keyof CliOptions['runnerOptions']; -const STORYBOOK_RUNNER_COMMANDS: StorybookRunnerCommand[] = ['storiesJson', 'configDir', 'eject']; - -export const defaultRunnerOptions: CliOptions['runnerOptions'] = { - configDir: '.storybook', - storiesJson: false, -}; +const STORYBOOK_RUNNER_COMMANDS: StorybookRunnerCommand[] = [ + 'storiesJson', + 'configDir', + 'browsers', + 'eject', +]; export const getCliOptions = () => { const { options: allOptions, extraArgs } = getParsedCliOptions(); const defaultOptions: CliOptions = { - runnerOptions: { ...defaultRunnerOptions }, + runnerOptions: {}, jestOptions: process.argv.splice(0, 2), }; diff --git a/src/util/getParsedCliOptions.ts b/src/util/getParsedCliOptions.ts index 384b3ad5..69344ddd 100644 --- a/src/util/getParsedCliOptions.ts +++ b/src/util/getParsedCliOptions.ts @@ -2,9 +2,22 @@ export const getParsedCliOptions = () => { const { program } = require('commander'); program - .option('-s, --stories-json', 'Run in stories json mode (requires a compatible Storybook)') - .option('-c, --config-dir ', 'Directory where to load Storybook configurations from') - .option('--watch', 'Run in watch mode') + .option( + '-s, --stories-json', + 'Run in stories json mode (requires a compatible Storybook)', + false + ) + .option( + '-c, --config-dir ', + 'Directory where to load Storybook configurations from', + '.storybook' + ) + .option('--watch', 'Run in watch mode', false) + .option( + '--browsers ', + 'Define browsers to run tests in. Could be one or multiple of: chromium, firefox, webkit', + ['chromium'] + ) .option( '--maxWorkers ', 'Specifies the maximum number of workers the worker-pool will spawn for running tests'