Skip to content

Core: Add experimental_devServer preset #32862

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
yannbf merged 1 commit into from
Oct 28, 2025
Merged

Core: Add experimental_devServer preset #32862

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions code/core/src/core-server/dev-server.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,6 +50,9 @@ export async function storybookDevServer(options: Options) {

(await getMiddleware(options.configDir))(app);

// Apply experimental_devServer preset to allow addons/frameworks to extend the dev server with middlewares, etc.
await options.presets.apply('experimental_devServer', app);
Comment on lines +53 to +54
Copy link
Contributor

@coderabbitai coderabbitai bot Oct 28, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟠 Major

Type mismatch and missing return value capture.

Based on the PR objectives, experimental_devServer should be an async function that receives the app and returns it (e.g., async (app) => { app.use(...); return app; }). However, the type definition in core-common.ts line 483 defines it as experimental_devServer?: ServerApp, not as a function type. Additionally, the return value from the preset application is not captured, which means if a preset returns a modified app instance, it will be lost.

Apply this diff to capture the return value:

  // Apply experimental_devServer preset to allow addons/frameworks to extend the dev server with middlewares, etc.
- await options.presets.apply('experimental_devServer', app);
+ const modifiedApp = await options.presets.apply('experimental_devServer', app);
+ // Note: Currently presets are expected to mutate the app in place, but capturing the return value
+ // allows for future flexibility if presets need to return a new instance

Additionally, update the type definition in core-common.ts to reflect that this should be a function:

experimental_devServer?: (app: ServerApp) => ServerApp | Promise<ServerApp>;
🤖 Prompt for AI Agents 
In code/core/src/core-server/dev-server.ts around lines 53-54, the preset
application call awaits options.presets.apply('experimental_devServer', app) but
does not capture a returned (possibly modified) ServerApp; change the call to
capture and reassign the result (e.g., app = await options.presets.apply(...))
so any modified app is preserved. Also update the type in core-common.ts at line
~483 to declare experimental_devServer as a function type:
experimental_devServer?: (app: ServerApp) => ServerApp | Promise<ServerApp>, so
the preset is correctly typed as an async function that receives and returns the
app.


const { port, host, initialPath } = options;
invariant(port, 'expected options to have a port');
const proto = options.https ? 'https' : 'http';
Expand Down
4 changes: 3 additions & 1 deletion code/core/src/types/modules/core-common.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -225,7 +225,7 @@ export type Middleware<T extends IncomingMessage = IncomingMessage> = (
next: (err?: string | Error) => Promise<void> | void
) => Promise<void> | void;

interface ServerApp<T extends IncomingMessage = IncomingMessage> {
export interface ServerApp<T extends IncomingMessage = IncomingMessage> {
server: NetServer;

use(pattern: RegExp | string, ...handlers: Middleware<T>[]): this;
Expand Down Expand Up @@ -480,6 +480,8 @@ export interface StorybookConfigRaw {

experimental_indexers?: Indexer[];

experimental_devServer?: ServerApp;
Copy link
Contributor

@coderabbitai coderabbitai bot Oct 28, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🔴 Critical

Incorrect type definition for experimental_devServer.

The type is defined as ServerApp directly, but based on the PR objectives, this should be a function that receives the ServerApp and returns it (potentially modified). The example usage shows:

experimental_devServer: async (app) => {
  app.use('/my-custom-route', ...);
  return app;
}

Apply this diff to fix the type:

- experimental_devServer?: ServerApp;
+ experimental_devServer?: (app: ServerApp) => ServerApp | Promise<ServerApp>;
🤖 Prompt for AI Agents 
In code/core/src/types/modules/core-common.ts around line 483, the
experimental_devServer field is incorrectly typed as ServerApp; change its type
to a function signature that accepts a ServerApp and returns either a ServerApp
or a Promise<ServerApp> (e.g. (app: ServerApp) => ServerApp |
Promise<ServerApp>), and update any related imports/types if necessary so
callers like async (app) => { app.use(...); return app; } type-check correctly.


docs?: DocsOptions;

previewHead?: string;
Expand Down
Loading