diff --git a/.github/workflows/publish.yml b/.github/workflows/publish.yml index cc88ce6182fd..8aa7928748bc 100644 --- a/.github/workflows/publish.yml +++ b/.github/workflows/publish.yml @@ -154,18 +154,6 @@ jobs: git merge ${{ github.ref_name }} git push origin ${{ steps.target.outputs.target }} - - name: Ensure `next` is a minor version ahead of `main` - if: steps.target.outputs.target == 'main' - run: | - git checkout next - git pull - - yarn release:ensure-next-ahead --main-version "${{ steps.version.outputs.current-version }}" - - git add .. - git diff --staged --quiet || git commit -m "Bump next to be one minor ahead of main [skip ci]" - git push origin next - - name: Sync CHANGELOG.md from `main` to `next` if: steps.target.outputs.target == 'main' working-directory: . diff --git a/code/addons/docs/docs/docspage.md b/code/addons/docs/docs/docspage.md index 5e89251c2ede..ea50050f6b94 100644 --- a/code/addons/docs/docs/docspage.md +++ b/code/addons/docs/docs/docspage.md @@ -165,8 +165,8 @@ You can override this default behavior in `.storybook/preview.js` (or in any of ```js export const parameters = { docs: { - source: { - state: 'open', + canvas: { + sourceState: 'shown', }, }, }; diff --git a/docs/api/portable-stories-playwright.md b/docs/api/portable-stories-playwright.md index ae7d012b8445..38dc1502f0a4 100644 --- a/docs/api/portable-stories-playwright.md +++ b/docs/api/portable-stories-playwright.md @@ -1,5 +1,5 @@ --- -title: 'Portable stories in Playwright' +title: 'Portable stories in Playwright CT' --- export const SUPPORTED_RENDERERS = ['react', 'vue']; @@ -34,6 +34,8 @@ Normally, Storybook composes a story and its [annotations](#annotations) automat +Your project must be using React 18+ to use the portable stories API with Playwright CT. + **Using `Next.js`?** The portable stories API is not yet supported in Next.js with Playwright CT. diff --git a/docs/versions/next.json b/docs/versions/next.json index 3062aa7a1fea..697ac1cd38e6 100644 --- a/docs/versions/next.json +++ b/docs/versions/next.json @@ -1 +1 @@ -{"version":"8.2.0-alpha.0","info":{"plain":""}} +{"version":"8.2.0-alpha.1","info":{"plain":"- CLI: Add optional `--dev` and `--no-dev` options to `storybook init` CLI - [#26918](https://github.com/storybookjs/storybook/pull/26918), thanks @fastfrwrd!\n- CLI: Include `@storybook/addon-svelte-csf` when initializing new projects - [#27070](https://github.com/storybookjs/storybook/pull/27070), thanks @benmccann!\n- Dependency: Upgrade `webpack-virtual-modules` to 0.6.0 - [#27102](https://github.com/storybookjs/storybook/pull/27102), thanks @fyodorovandrei!\n- Dependency: bump `markdown-to-jsx` to v7.4.5 - [#26694](https://github.com/storybookjs/storybook/pull/26694), thanks @xyy94813!\n- Docgen: Only add react-docgen info when a component is defined in the file - [#26967](https://github.com/storybookjs/storybook/pull/26967), thanks @glenjamin!\n- Docs: Fix MDX Stories block tag-filtering behavior - [#27144](https://github.com/storybookjs/storybook/pull/27144), thanks @shilman!\n- Docs: Fix Subtitle block when no `of` prop passed - [#27147](https://github.com/storybookjs/storybook/pull/27147), thanks @JReinhold!\n- Next.js: Add typing for NextImage to main framework options type - [#27105](https://github.com/storybookjs/storybook/pull/27105), thanks @valentinpalkovic!\n- Next.js: Avoid conflicts with the raw loader - [#27093](https://github.com/storybookjs/storybook/pull/27093), thanks @seanparmelee!\n- Types: Fix typing for main.framework/builder fields - [#27088](https://github.com/storybookjs/storybook/pull/27088), thanks @valentinpalkovic!"}} diff --git a/docs/writing-stories/mocking-modules.md b/docs/writing-stories/mocking-modules.md index 0f165546a381..d80c3bfe1241 100644 --- a/docs/writing-stories/mocking-modules.md +++ b/docs/writing-stories/mocking-modules.md @@ -95,6 +95,16 @@ import { getUserFromSession } from '#lib/session'; // ... rest of the file ``` + + +Subpath imports will only be correctly resolved and typed when the [`moduleResolution` property](https://www.typescriptlang.org/tsconfig/#moduleResolution) is set to `'Bundler'`, `'NodeNext'`, or `'Node16'` in your TypeScript configuration. + +If you are currently using `'node'`, that is intended for projects using a Node.js version older than v10. Projects written with modern code likely do not need to use `'node'`. + +Storybook recommends the [TSConfig Cheat Sheet](https://www.totaltypescript.com/tsconfig-cheat-sheet) for guidance on setting up your TypeScript configuration. + + + ## Builder aliases If your project is unable to use [subpath imports](#subpath-imports), you can configure your Storybook builder to alias the module to the mock file. This will instruct the builder to replace the module with the mock file when bundling your Storybook stories. diff --git a/scripts/package.json b/scripts/package.json index 33f76813a950..5c1d6ec3f774 100644 --- a/scripts/package.json +++ b/scripts/package.json @@ -19,7 +19,6 @@ "local-registry": "node --loader esbuild-register/loader -r esbuild-register ./run-registry.ts", "publish": "node --loader esbuild-register/loader -r esbuild-register ./sandbox/publish.ts", "release:cancel-preparation-runs": "node --loader esbuild-register/loader -r esbuild-register ./release/cancel-preparation-runs.ts", - "release:ensure-next-ahead": "node --loader esbuild-register/loader -r esbuild-register ./release/ensure-next-ahead.ts", "release:generate-pr-description": "node --loader esbuild-register/loader -r esbuild-register ./release/generate-pr-description.ts", "release:get-changelog-from-file": "node --loader esbuild-register/loader -r esbuild-register ./release/get-changelog-from-file.ts", "release:get-current-version": "node --loader esbuild-register/loader -r esbuild-register ./release/get-current-version.ts", diff --git a/scripts/release/__tests__/ensure-next-ahead.test.ts b/scripts/release/__tests__/ensure-next-ahead.test.ts deleted file mode 100644 index 0b21ebee8447..000000000000 --- a/scripts/release/__tests__/ensure-next-ahead.test.ts +++ /dev/null @@ -1,87 +0,0 @@ -/* eslint-disable no-underscore-dangle */ -import path from 'path'; -import { vi, describe, it, expect, beforeEach } from 'vitest'; -import * as fsExtraOriginal from 'fs-extra'; -import { run as ensureNextAhead } from '../ensure-next-ahead'; -import * as gitClient_ from '../utils/git-client'; -import * as bumpVersion_ from '../version'; - -vi.mock('../utils/git-client'); -vi.mock('../version'); -vi.mock('fs-extra', async () => import('../../../code/__mocks__/fs-extra')); - -const fsExtra = vi.mocked( - fsExtraOriginal as any -); - -const bumpVersion = vi.mocked(bumpVersion_, true); -const gitClient = vi.mocked(gitClient_, true); - -vi.spyOn(console, 'log').mockImplementation(() => {}); -vi.spyOn(console, 'warn').mockImplementation(() => {}); -vi.spyOn(console, 'error').mockImplementation(() => {}); - -const CODE_PACKAGE_JSON_PATH = path.join(__dirname, '..', '..', '..', 'code', 'package.json'); - -describe('Ensure next ahead', () => { - beforeEach(() => { - vi.clearAllMocks(); - gitClient.git.status.mockResolvedValue({ current: 'next' } as any); - fsExtra.__setMockFiles({ - [CODE_PACKAGE_JSON_PATH]: JSON.stringify({ version: '2.0.0' }), - }); - }); - - it('should throw when main-version is missing', async () => { - await expect(ensureNextAhead({})).rejects.toThrowErrorMatchingInlineSnapshot(` - [ZodError: [ - { - "code": "invalid_type", - "expected": "string", - "received": "undefined", - "path": [ - "mainVersion" - ], - "message": "Required" - } -]] - `); - }); - - it('should throw when main-version is not a semver string', async () => { - await expect(ensureNextAhead({ mainVersion: '200' })).rejects - .toThrowErrorMatchingInlineSnapshot(` - [ZodError: [ - { - "code": "custom", - "message": "main-version must be a valid semver version string like '7.4.2'.", - "path": [] - } -]] - `); - }); - - it('should not bump version when next is already ahead of main', async () => { - await expect(ensureNextAhead({ mainVersion: '1.0.0' })).resolves.toBeUndefined(); - expect(bumpVersion.run).not.toHaveBeenCalled(); - }); - - it('should bump version to 3.1.0-alpha.0 when main is 3.0.0 and next is 2.0.0', async () => { - await expect(ensureNextAhead({ mainVersion: '3.0.0' })).resolves.toBeUndefined(); - expect(bumpVersion.run).toHaveBeenCalledWith({ exact: '3.1.0-alpha.0' }); - }); - - it('should bump version to 2.1.0-alpha.0 when main and next are both 2.0.0', async () => { - await expect(ensureNextAhead({ mainVersion: '2.0.0' })).resolves.toBeUndefined(); - expect(bumpVersion.run).toHaveBeenCalledWith({ exact: '2.1.0-alpha.0' }); - }); - - it('should bump version to 2.1.0-alpha.0 when main is 2.0.0 and next is 2.0.0-rc.10', async () => { - fsExtra.__setMockFiles({ - [CODE_PACKAGE_JSON_PATH]: JSON.stringify({ version: '2.0.0-rc.10' }), - }); - - await expect(ensureNextAhead({ mainVersion: '2.0.0' })).resolves.toBeUndefined(); - expect(bumpVersion.run).toHaveBeenCalledWith({ exact: '2.1.0-alpha.0' }); - }); -}); diff --git a/scripts/release/ensure-next-ahead.ts b/scripts/release/ensure-next-ahead.ts deleted file mode 100644 index 308004f031cf..000000000000 --- a/scripts/release/ensure-next-ahead.ts +++ /dev/null @@ -1,102 +0,0 @@ -/** - * This script ensures that next is always one minor ahead of main. - * This is needed when releasing a stable from next. - * Next will be at eg. 7.4.0-alpha.4, and main will be at 7.3.0. - * Then we release 7.4.0 by merging next to latest-release to main. - * We then ensure here that next is bumped to 7.5.0-alpha.0 - without releasing it. - * If this is a patch release bumping main to 7.3.1, next will not be touched because it's already ahead. - */ - -/* eslint-disable no-console */ -import chalk from 'chalk'; -import path from 'path'; -import program from 'commander'; -import semver from 'semver'; -import { z } from 'zod'; -import { readJson } from 'fs-extra'; -import { esMain } from '../utils/esmain'; -import { run as bumpVersion } from './version'; -import { git } from './utils/git-client'; - -program - .name('ensure-next-ahead') - .description('ensure the "next" branch is always a minor version ahead of "main"') - .requiredOption('-M, --main-version ', 'The version currently on the "main" branch'); - -const optionsSchema = z - .object({ - mainVersion: z.string(), - }) - .refine((schema) => semver.valid(schema.mainVersion), { - message: "main-version must be a valid semver version string like '7.4.2'.", - }); - -type Options = { - mainVersion: string; -}; - -const CODE_DIR_PATH = path.join(__dirname, '..', '..', 'code'); -const CODE_PACKAGE_JSON_PATH = path.join(CODE_DIR_PATH, 'package.json'); - -const validateOptions = (options: { [key: string]: any }): options is Options => { - optionsSchema.parse(options); - return true; -}; - -const getCurrentVersion = async () => { - const { version } = await readJson(CODE_PACKAGE_JSON_PATH); - console.log(`📐 Current version of Storybook is ${chalk.green(version)}`); - return version; -}; - -export const run = async (options: unknown) => { - if (!validateOptions(options)) { - return; - } - const { mainVersion } = options; - - const { current: currentGitBranch } = await git.status(); - - if (currentGitBranch !== 'next') { - console.warn( - `🚧 The current branch is not "next" but "${currentGitBranch}", this only really makes sense to run on the "next" branch.` - ); - } - - // Get the current version from code/package.json - const currentNextVersion = await getCurrentVersion(); - if (semver.gt(currentNextVersion, mainVersion)) { - console.log( - `✅ The version on next (${chalk.green( - currentNextVersion - )}) is already ahead of the version on main (${chalk.green(mainVersion)}), no action needed.` - ); - return; - } - - const nextNextVersion = `${semver.inc(mainVersion, 'minor')}-alpha.0`; - - console.log( - `🤜 The version on next (${chalk.green( - currentNextVersion - )}) is behind the version on main (${chalk.green(mainVersion)}), bumping to ${chalk.blue( - nextNextVersion - )}...` - ); - - await bumpVersion({ exact: nextNextVersion }); - - console.log( - `✅ bumped all versions to ${chalk.green( - nextNextVersion - )}, remember to commit and push to next.` - ); -}; - -if (esMain(import.meta.url)) { - const parsed = program.parse(); - run(parsed.opts()).catch((err) => { - console.error(err); - process.exit(1); - }); -}