Skip to content

Commit

Permalink
Merge pull request #29292 from storybookjs/version-non-patch-from-8.4…
Browse files Browse the repository at this point in the history
….0-alpha.4

Release: Prerelease 8.4.0-alpha.5
  • Loading branch information
shilman authored Oct 8, 2024
2 parents 127c43a + 6e32f1c commit 0251c05
Show file tree
Hide file tree
Showing 100 changed files with 626 additions and 342 deletions.
5 changes: 5 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,8 @@
## 8.3.5

- CLI: Update the React Native init to include v8 dependencies - [#29273](https://github.com/storybookjs/storybook/pull/29273), thanks @dannyhw!
- Vitest plugin: Fix renamed export stories - [#29250](https://github.com/storybookjs/storybook/pull/29250), thanks @shilman!

## 8.3.4

- Addon Test: Support story name as test description - [#29147](https://github.com/storybookjs/storybook/pull/29147), thanks @InfiniteXyy!
Expand Down
5 changes: 5 additions & 0 deletions CHANGELOG.prerelease.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,8 @@
## 8.4.0-alpha.5

- Core: Migrate from `express` to `polka` - [#29230](https://github.com/storybookjs/storybook/pull/29230), thanks @43081j!
- Core: Remove dependence on `file-system-cache` - [#29256](https://github.com/storybookjs/storybook/pull/29256), thanks @ndelangen!

## 8.4.0-alpha.4

- Blocks: Prebundle `es-toolkit` - [#29259](https://github.com/storybookjs/storybook/pull/29259), thanks @JReinhold!
Expand Down
2 changes: 2 additions & 0 deletions code/__mocks__/fs.ts
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ export const realpathSync = vi.fn();
export const readdir = vi.fn();
export const readdirSync = vi.fn();
export const readlinkSync = vi.fn();
export const mkdirSync = vi.fn();

export default {
__setMockFiles,
Expand All @@ -29,4 +30,5 @@ export default {
readdir,
readdirSync,
readlinkSync,
mkdirSync,
};
4 changes: 2 additions & 2 deletions code/builders/builder-vite/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -47,15 +47,15 @@
"@types/find-cache-dir": "^3.2.1",
"browser-assert": "^1.2.1",
"es-module-lexer": "^1.5.0",
"express": "^4.19.2",
"find-cache-dir": "^3.0.0",
"magic-string": "^0.30.0",
"ts-dedent": "^2.0.0"
},
"devDependencies": {
"@types/express": "^4.17.21",
"@types/node": "^22.0.0",
"glob": "^10.0.0",
"polka": "^1.0.0-next.28",
"sirv": "^2.0.4",
"slash": "^5.0.0",
"typescript": "^5.3.2",
"vite": "^4.0.4"
Expand Down
33 changes: 19 additions & 14 deletions code/builders/builder-vite/src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,9 @@ import { cp, readFile } from 'node:fs/promises';
import { join, parse } from 'node:path';

import { NoStatsForViteDevError } from 'storybook/internal/server-errors';
import type { Options } from 'storybook/internal/types';
import type { Middleware, Options } from 'storybook/internal/types';

import type { RequestHandler } from 'express';
import express from 'express';
import sirv from 'sirv';
import { corePath } from 'storybook/core-path';
import type { ViteDevServer } from 'vite';

Expand All @@ -20,16 +19,18 @@ export { hasVitePlugins } from './utils/has-vite-plugins';

export * from './types';

function iframeMiddleware(options: Options, server: ViteDevServer): RequestHandler {
function iframeMiddleware(options: Options, server: ViteDevServer): Middleware {
return async (req, res, next) => {
if (!req.url.match(/^\/iframe\.html($|\?)/)) {
if (!req.url || !req.url.match(/^\/iframe\.html($|\?)/)) {
next();
return;
}
// the base isn't used for anything, but it's required by the URL constructor
const url = new URL(req.url, 'http://localhost:6006');

// We need to handle `html-proxy` params for style tag HMR https://github.com/storybookjs/builder-vite/issues/266#issuecomment-1055677865
// e.g. /iframe.html?html-proxy&index=0.css
if (req.query['html-proxy'] !== undefined) {
if (url.searchParams.has('html-proxy')) {
next();
return;
}
Expand All @@ -40,7 +41,9 @@ function iframeMiddleware(options: Options, server: ViteDevServer): RequestHandl
const generated = await transformIframeHtml(indexHtml, options);
const transformed = await server.transformIndexHtml('/iframe.html', generated);
res.setHeader('Content-Type', 'text/html');
res.status(200).send(transformed);
res.statusCode = 200;
res.write(transformed);
res.end();
};
}

Expand All @@ -59,10 +62,14 @@ export const start: ViteBuilder['start'] = async ({
server = await createViteServer(options as Options, devServer);

const previewResolvedDir = join(corePath, 'dist/preview');
const previewDirOrigin = previewResolvedDir;

router.use(`/sb-preview`, express.static(previewDirOrigin, { immutable: true, maxAge: '5m' }));

router.use(
'/sb-preview',
sirv(previewResolvedDir, {
maxAge: 300000,
dev: true,
immutable: true,
})
);
router.use(iframeMiddleware(options as Options, server));
router.use(server.middlewares);

Expand All @@ -81,10 +88,8 @@ export const build: ViteBuilder['build'] = async ({ options }) => {
const viteCompilation = viteBuild(options as Options);

const previewResolvedDir = join(corePath, 'dist/preview');
const previewDirOrigin = previewResolvedDir;
const previewDirTarget = join(options.outputDir || '', `sb-preview`);

const previewFiles = cp(previewDirOrigin, previewDirTarget, {
const previewFiles = cp(previewResolvedDir, previewDirTarget, {
filter: (src) => {
const { ext } = parse(src);
if (ext) {
Expand Down
1 change: 1 addition & 0 deletions code/builders/builder-vite/src/list-stories.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import { isAbsolute, join } from 'node:path';
import { commonGlobOptions, normalizeStories } from 'storybook/internal/common';
import type { Options } from 'storybook/internal/types';

// eslint-disable-next-line depend/ban-dependencies
import { glob } from 'glob';
import slash from 'slash';

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ export function codeGeneratorPlugin(options: Options): Plugin {
},
config(config, { command }) {
// If we are building the static distribution, add iframe.html as an entry.
// In development mode, it's not an entry - instead, we use an express middleware
// In development mode, it's not an entry - instead, we use a middleware
// to serve iframe.html. The reason is that Vite's dev server (at the time of writing)
// does not support virtual files as entry points.
if (command === 'build') {
Expand Down
2 changes: 1 addition & 1 deletion code/builders/builder-webpack5/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,6 @@
"constants-browserify": "^1.0.0",
"css-loader": "^6.7.1",
"es-module-lexer": "^1.5.0",
"express": "^4.19.2",
"fork-ts-checker-webpack-plugin": "^8.0.0",
"html-webpack-plugin": "^5.5.0",
"magic-string": "^0.30.5",
Expand All @@ -95,6 +94,7 @@
"@types/terser-webpack-plugin": "^5.2.0",
"@types/webpack-hot-middleware": "^2.25.6",
"pretty-hrtime": "^1.0.3",
"sirv": "^2.0.4",
"slash": "^5.0.0",
"typescript": "^5.3.2"
},
Expand Down
22 changes: 12 additions & 10 deletions code/builders/builder-webpack5/src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,8 @@ import type { Builder, Options } from 'storybook/internal/types';

import { checkWebpackVersion } from '@storybook/core-webpack';

import express from 'express';
import prettyTime from 'pretty-hrtime';
import sirv from 'sirv';
import { corePath } from 'storybook/core-path';
import type { Configuration, Stats, StatsOptions } from 'webpack';
import webpack, { ProgressPlugin } from 'webpack';
Expand Down Expand Up @@ -137,7 +137,7 @@ const starter: StarterFunction = async function* starterGeneratorFn({
}

yield;
const modulesCount = (await options.cache?.get('modulesCount').catch(() => {})) || 1000;
const modulesCount = await options.cache?.get('modulesCount', 1000);
let totalModules: number;
let value = 0;

Expand All @@ -147,7 +147,7 @@ const starter: StarterFunction = async function* starterGeneratorFn({
const progress = { value, message: message.charAt(0).toUpperCase() + message.slice(1) };
if (message === 'building') {
// arg3 undefined in webpack5
const counts = (arg3 && arg3.match(/(\d+)\/(\d+)/)) || [];
const counts = (arg3 && arg3.match(/entries (\d+)\/(\d+)/)) || [];
const complete = parseInt(counts[1], 10);
const total = parseInt(counts[2], 10);
if (!Number.isNaN(complete) && !Number.isNaN(total)) {
Expand Down Expand Up @@ -180,10 +180,14 @@ const starter: StarterFunction = async function* starterGeneratorFn({
compilation = webpackDevMiddleware(compiler, middlewareOptions);

const previewResolvedDir = join(corePath, 'dist/preview');
const previewDirOrigin = previewResolvedDir;

router.use(`/sb-preview`, express.static(previewDirOrigin, { immutable: true, maxAge: '5m' }));

router.use(
'/sb-preview',
sirv(previewResolvedDir, {
maxAge: 300000,
dev: true,
immutable: true,
})
);
router.use(compilation);
router.use(webpackHotMiddleware(compiler, { log: false }));

Expand Down Expand Up @@ -289,10 +293,8 @@ const builder: BuilderFunction = async function* builderGeneratorFn({ startTime,
});

const previewResolvedDir = join(corePath, 'dist/preview');
const previewDirOrigin = previewResolvedDir;
const previewDirTarget = join(options.outputDir || '', `sb-preview`);

const previewFiles = cp(previewDirOrigin, previewDirTarget, {
const previewFiles = cp(previewResolvedDir, previewDirTarget, {
filter: (src) => {
const { ext } = parse(src);
if (ext) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@ export default async (
docsOptions,
entries,
nonNormalizedStories,
modulesCount = 1000,
modulesCount,
build,
tagsOptions,
] = await Promise.all([
Expand All @@ -86,7 +86,7 @@ export default async (
presets.apply('docs'),
presets.apply<string[]>('entries', []),
presets.apply('stories', []),
options.cache?.get('modulesCount').catch(() => {}),
options.cache?.get('modulesCount', 1000),
options.presets.apply('build'),
presets.apply('tags', {}),
]);
Expand Down
9 changes: 3 additions & 6 deletions code/core/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -278,12 +278,10 @@
},
"dependencies": {
"@storybook/csf": "^0.1.11",
"@types/express": "^4.17.21",
"better-opn": "^3.0.2",
"browser-assert": "^1.2.1",
"esbuild": "^0.18.0 || ^0.19.0 || ^0.20.0 || ^0.21.0 || ^0.22.0 || ^0.23.0 || ^0.24.0",
"esbuild-register": "^3.5.0",
"express": "^4.19.2",
"jsdoc-type-pratt-parser": "^4.0.0",
"process": "^0.11.10",
"recast": "^0.23.5",
Expand All @@ -307,6 +305,7 @@
"@emotion/use-insertion-effect-with-fallbacks": "^1.0.1",
"@fal-works/esbuild-plugin-global-externals": "^2.1.2",
"@ndelangen/get-tarball": "^3.0.7",
"@polka/compression": "^1.0.0-next.28",
"@popperjs/core": "^2.6.0",
"@radix-ui/react-dialog": "^1.0.5",
"@radix-ui/react-scroll-area": "1.2.0-rc.7",
Expand All @@ -316,7 +315,6 @@
"@storybook/icons": "^1.2.10",
"@tanstack/react-virtual": "^3.3.0",
"@testing-library/react": "^14.0.0",
"@types/compression": "^1.7.0",
"@types/cross-spawn": "^6.0.2",
"@types/detect-port": "^1.3.0",
"@types/diff": "^5.0.9",
Expand Down Expand Up @@ -346,7 +344,6 @@
"cli-table3": "^0.6.1",
"commander": "^12.1.0",
"comment-parser": "^1.4.1",
"compression": "^1.7.4",
"copy-to-clipboard": "^3.3.1",
"cross-spawn": "^7.0.3",
"css": "^3.0.0",
Expand All @@ -362,10 +359,8 @@
"esbuild": "^0.18.0 || ^0.19.0 || ^0.20.0 || ^0.21.0 || ^0.22.0 || ^0.23.0",
"esbuild-plugin-alias": "^0.2.1",
"execa": "^8.0.1",
"express": "^4.19.2",
"fd-package-json": "^1.2.0",
"fetch-retry": "^6.0.0",
"file-system-cache": "^2.4.4",
"find-cache-dir": "^5.0.0",
"find-up": "^7.0.0",
"flush-promises": "^1.0.2",
Expand All @@ -387,6 +382,7 @@
"picomatch": "^2.3.0",
"picoquery": "^1.4.0",
"polished": "^4.2.2",
"polka": "^1.0.0-next.28",
"prettier": "^3.2.5",
"pretty-hrtime": "^1.0.3",
"prompts": "^2.4.0",
Expand All @@ -402,6 +398,7 @@
"react-transition-group": "^4.4.5",
"require-from-string": "^2.0.2",
"resolve-from": "^5.0.0",
"sirv": "^2.0.4",
"slash": "^5.0.0",
"source-map": "^0.7.4",
"store2": "^2.14.2",
Expand Down
36 changes: 27 additions & 9 deletions code/core/src/builder-manager/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import { logger } from '@storybook/core/node-logger';
import { globalExternals } from '@fal-works/esbuild-plugin-global-externals';
import { pnpPlugin } from '@yarnpkg/esbuild-plugin-pnp';
import aliasPlugin from 'esbuild-plugin-alias';
import express from 'express';
import sirv from 'sirv';

import type {
BuilderBuildResult,
Expand All @@ -26,6 +26,7 @@ import { wrapManagerEntries } from './utils/managerEntries';
import { safeResolve } from './utils/safeResolve';
import { getTemplatePath, renderHTML } from './utils/template';

const isRootPath = /^\/($|\?)/;
let compilation: Compilation;
let asyncIterator: ReturnType<StarterFunction> | ReturnType<BuilderFunction>;

Expand Down Expand Up @@ -165,8 +166,22 @@ const starter: StarterFunction = async function* starterGeneratorFn({
'manager'
);

router.use(`/sb-addons`, express.static(addonsDir, { immutable: true, maxAge: '5m' }));
router.use(`/sb-manager`, express.static(coreDirOrigin, { immutable: true, maxAge: '5m' }));
router.use(
'/sb-addons',
sirv(addonsDir, {
maxAge: 300000,
dev: true,
immutable: true,
})
);
router.use(
'/sb-manager',
sirv(coreDirOrigin, {
maxAge: 300000,
dev: true,
immutable: true,
})
);

const { cssFiles, jsFiles } = await readOrderedFiles(addonsDir, compilation?.outputFiles);

Expand All @@ -193,15 +208,19 @@ const starter: StarterFunction = async function* starterGeneratorFn({

yield;

router.use(`/`, ({ path }, res, next) => {
if (path === '/') {
res.status(200).send(html);
router.use('/', ({ url }, res, next) => {
if (url && isRootPath.test(url)) {
res.statusCode = 200;
res.write(html);
res.end();
} else {
next();
}
});
router.use(`/index.html`, ({ path }, res) => {
res.status(200).send(html);
router.use(`/index.html`, (req, res) => {
res.statusCode = 200;
res.write(html);
res.end();
});

return {
Expand Down Expand Up @@ -250,7 +269,6 @@ const builder: BuilderFunction = async function* builderGeneratorFn({ startTime,
// TODO: this doesn't watch, we should change this to use the esbuild watch API: https://esbuild.github.io/api/#watch
compilation = await instance({
...config,

minify: true,
});

Expand Down
1 change: 1 addition & 0 deletions code/core/src/cli/detect.test.ts
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ vi.mock('fs', () => ({
readdirSync: vi.fn(),
readlinkSync: vi.fn(),
default: vi.fn(),
mkdirSync: vi.fn(),
}));

vi.mock('@storybook/core/node-logger');
Expand Down
Loading

0 comments on commit 0251c05

Please sign in to comment.