Merge branch 'next' into docs_react_ts_updates

.circleci/config.yml

@@ -410,7 +410,7 @@ jobs:
       parallelism:
         type: integer
     executor:
-      class: large
+      class: medium
       name: sb_playwright
     parallelism: << parameters.parallelism >>
     steps:
@@ -433,7 +433,7 @@ jobs:
       parallelism:
         type: integer
     executor:
-      class: large
+      class: medium
       name: sb_playwright
     parallelism: << parameters.parallelism >>
     steps:

CHANGELOG.md

@@ -1,3 +1,7 @@
+## 7.6.12
+
+- CLI: Fix `upgrade` detecting the wrong version of existing Storybooks - [#25752](https://github.com/storybookjs/storybook/pull/25752), thanks [@JReinhold](https://github.com/JReinhold)!
+
 ## 7.6.11
 
 - CLI: Update init for react native v7 - [#25780](https://github.com/storybookjs/storybook/pull/25780), thanks [@dannyhw](https://github.com/dannyhw)!

code/builders/builder-webpack5/src/types.ts

@@ -3,11 +3,12 @@ import type {
   Options,
   BuilderResult as BuilderResultBase,
   StorybookConfig,
+  TypescriptOptions as WebpackTypescriptOptions,
 } from '@storybook/core-webpack';
 
 import type ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
 
-type TypeScriptOptionsBase = Required<StorybookConfig>['typescript'];
+type TypeScriptOptionsBase = Partial<WebpackTypescriptOptions>;
 
 /**
  * Options for TypeScript usage within Storybook.
@@ -19,7 +20,7 @@ export interface TypescriptOptions extends TypeScriptOptionsBase {
   checkOptions?: ConstructorParameters<typeof ForkTsCheckerWebpackPlugin>[0];
 }
 
-export interface StorybookConfigWebpack extends Pick<StorybookConfig, 'webpack' | 'webpackFinal'> {
+export interface StorybookConfigWebpack extends Omit<StorybookConfig, 'webpack' | 'webpackFinal'> {
   /**
    * Modify or return a custom Webpack config after the Storybook's default configuration
    * has run (mostly used by addons).

code/frameworks/angular/src/builders/build-storybook/index.ts

@@ -49,6 +49,7 @@ export type StorybookBuilderOptions = JsonObject & {
     | 'configDir'
     | 'loglevel'
     | 'quiet'
+    | 'test'
     | 'webpackStatsJson'
     | 'disableTelemetry'
     | 'debugWebpack'
@@ -87,6 +88,7 @@ const commandBuilder: BuilderHandlerFn<StorybookBuilderOptions> = (
         configDir,
         docs,
         loglevel,
+        test,
         outputDir,
         quiet,
         enableProdMode = true,
@@ -104,6 +106,7 @@ const commandBuilder: BuilderHandlerFn<StorybookBuilderOptions> = (
         ...(docs ? { docs } : {}),
         loglevel,
         outputDir,
+        test,
         quiet,
         enableProdMode,
         disableTelemetry,

code/frameworks/angular/src/preset.ts

@@ -22,7 +22,7 @@ export const previewAnnotations: PresetProperty<'previewAnnotations'> = (entries
   return annotations;
 };
 
-export const core: PresetProperty<'core', StorybookConfig> = async (config, options) => {
+export const core: PresetProperty<'core'> = async (config, options) => {
   const framework = await options.presets.apply('framework');
 
   return {
@@ -34,7 +34,7 @@ export const core: PresetProperty<'core', StorybookConfig> = async (config, opti
   };
 };
 
-export const typescript: PresetProperty<'typescript', StorybookConfig> = async (config) => {
+export const typescript: PresetProperty<'typescript'> = async (config) => {
   return {
     ...config,
     skipCompiler: true,

code/frameworks/ember/src/preset.ts

@@ -43,7 +43,7 @@ export const webpackFinal: StorybookConfig['webpackFinal'] = async (baseConfig,
   };
 };
 
-export const core: PresetProperty<'core', StorybookConfig> = async (config, options) => {
+export const core: PresetProperty<'core'> = async (config, options) => {
   const framework = await options.presets.apply('framework');
 
   return {

code/frameworks/html-vite/src/preset.ts

@@ -1,12 +1,11 @@
 import type { PresetProperty } from '@storybook/types';
 import { dirname, join } from 'path';
-import type { StorybookConfig } from './types';
 
 function getAbsolutePath<I extends string>(value: I): I {
   return dirname(require.resolve(join(value, 'package.json'))) as any;
 }
 
-export const core: PresetProperty<'core', StorybookConfig> = {
+export const core: PresetProperty<'core'> = {
   builder: getAbsolutePath('@storybook/builder-vite'),
   renderer: getAbsolutePath('@storybook/html'),
 };

code/frameworks/nextjs/src/preset.ts

@@ -28,33 +28,6 @@ export const addons: PresetProperty<'addons'> = [
   dirname(require.resolve(join('@storybook/preset-react-webpack', 'package.json'))),
 ];
 
-const defaultFrameworkOptions: FrameworkOptions = {};
-
-export const frameworkOptions: PresetProperty<'framework'> = async (_, options) => {
-  const config = await options.presets.apply('framework');
-
-  if (typeof config === 'string') {
-    return {
-      name: config,
-      options: defaultFrameworkOptions,
-    };
-  }
-  if (typeof config === 'undefined') {
-    return {
-      name: require.resolve('@storybook/nextjs') as '@storybook/nextjs',
-      options: defaultFrameworkOptions,
-    };
-  }
-
-  return {
-    name: config.name,
-    options: {
-      ...defaultFrameworkOptions,
-      ...config.options,
-    },
-  };
-};
-
 export const core: PresetProperty<'core'> = async (config, options) => {
   const framework = await options.presets.apply('framework');
 
@@ -137,7 +110,6 @@ export const babel: PresetProperty<'babel'> = async (baseConfig: TransformOption
 };
 
 export const webpackFinal: StorybookConfig['webpackFinal'] = async (baseConfig, options) => {
-  // eslint-disable-next-line @typescript-eslint/no-shadow
   const frameworkOptions = await options.presets.apply<{ options: FrameworkOptions }>(
     'frameworkOptions'
   );

code/frameworks/preact-vite/src/preset.ts

@@ -5,7 +5,7 @@ import type { StorybookConfig } from './types';
 const getAbsolutePath = <I extends string>(input: I): I =>
   dirname(require.resolve(join(input, 'package.json'))) as any;
 
-export const core: PresetProperty<'core', StorybookConfig> = {
+export const core: PresetProperty<'core'> = {
   builder: getAbsolutePath('@storybook/builder-vite'),
   renderer: getAbsolutePath('@storybook/preact'),
 };

code/frameworks/react-vite/src/preset.ts

@@ -5,7 +5,7 @@ import type { StorybookConfig } from './types';
 const getAbsolutePath = <I extends string>(input: I): I =>
   dirname(require.resolve(join(input, 'package.json'))) as any;
 
-export const core: PresetProperty<'core', StorybookConfig> = {
+export const core: PresetProperty<'core'> = {
   builder: getAbsolutePath('@storybook/builder-vite'),
   renderer: getAbsolutePath('@storybook/react'),
 };

code/frameworks/react-webpack5/src/preset.ts

@@ -1,6 +1,6 @@
 import { dirname, join } from 'path';
-import type { PresetProperty, Options } from '@storybook/types';
-import type { FrameworkOptions, StorybookConfig } from './types';
+import type { PresetProperty } from '@storybook/types';
+import type { StorybookConfig } from './types';
 
 const getAbsolutePath = <I extends string>(input: I): I =>
   dirname(require.resolve(join(input, 'package.json'))) as any;
@@ -9,38 +9,6 @@ export const addons: PresetProperty<'addons'> = [
   getAbsolutePath('@storybook/preset-react-webpack'),
 ];
 
-const defaultFrameworkOptions: FrameworkOptions = {
-  legacyRootApi: true,
-};
-
-export const frameworkOptions = async (
-  _: never,
-  options: Options
-): Promise<StorybookConfig['framework']> => {
-  const config = await options.presets.apply<StorybookConfig['framework']>('framework');
-
-  if (typeof config === 'string') {
-    return {
-      name: config,
-      options: defaultFrameworkOptions,
-    };
-  }
-  if (typeof config === 'undefined') {
-    return {
-      name: getAbsolutePath('@storybook/react-webpack5'),
-      options: defaultFrameworkOptions,
-    };
-  }
-
-  return {
-    name: config.name,
-    options: {
-      ...defaultFrameworkOptions,
-      ...config.options,
-    },
-  };
-};
-
 export const core: PresetProperty<'core'> = async (config, options) => {
   const framework = await options.presets.apply('framework');
 

code/frameworks/svelte-vite/src/preset.ts

@@ -7,7 +7,7 @@ import { svelteDocgen } from './plugins/svelte-docgen';
 const getAbsolutePath = <I extends string>(input: I): I =>
   dirname(require.resolve(join(input, 'package.json'))) as any;
 
-export const core: PresetProperty<'core', StorybookConfig> = {
+export const core: PresetProperty<'core'> = {
   builder: getAbsolutePath('@storybook/builder-vite'),
   renderer: getAbsolutePath('@storybook/svelte'),
 };

code/frameworks/vue3-webpack5/src/preset.ts

@@ -1,13 +1,10 @@
 import { dirname, join } from 'path';
 import type { PresetProperty } from '@storybook/types';
-import type { StorybookConfig } from './types';
 
 const getAbsolutePath = <I extends string>(input: I): I =>
   dirname(require.resolve(join(input, 'package.json'))) as any;
 
-export const addons: PresetProperty<'addons', StorybookConfig> = [
-  getAbsolutePath('@storybook/preset-vue3-webpack'),
-];
+export const addons: PresetProperty<'addons'> = [getAbsolutePath('@storybook/preset-vue3-webpack')];
 
 export const core: PresetProperty<'core'> = async (config, options) => {
   const framework = await options.presets.apply('framework');

code/frameworks/web-components-vite/src/preset.ts

@@ -1,11 +1,10 @@
 import type { PresetProperty } from '@storybook/types';
 import { dirname, join } from 'path';
-import type { StorybookConfig } from './types';
 
 const getAbsolutePath = <I extends string>(input: I): I =>
   dirname(require.resolve(join(input, 'package.json'))) as any;
 
-export const core: PresetProperty<'core', StorybookConfig> = {
+export const core: PresetProperty<'core'> = {
   builder: getAbsolutePath('@storybook/builder-vite'),
   renderer: getAbsolutePath('@storybook/web-components'),
 };

code/lib/core-server/src/presets/common-override-preset.ts

@@ -51,9 +51,11 @@ const createTestBuildFeatures = (value: boolean): Required<TestBuildFlags> => ({
 export const build: PresetProperty<'build'> = async (value, options) => {
   return {
     ...value,
-    test: {
-      ...createTestBuildFeatures(!!options.test),
-      ...value?.test,
-    },
+    test: options.test
+      ? {
+          ...createTestBuildFeatures(!!options.test),
+          ...value?.test,
+        }
+      : createTestBuildFeatures(false),
   };
 };

code/lib/core-webpack/src/types.ts

@@ -1,4 +1,4 @@
-import type { Options, StorybookConfigRaw as StorybookConfigBase } from '@storybook/types';
+import type { Options, StorybookConfig as StorybookConfigBase } from '@storybook/types';
 
 export type { Options, Preset, BuilderResult, TypescriptOptions } from '@storybook/types';
 

code/lib/test/package.json

@@ -48,7 +48,7 @@
     "@storybook/instrumenter": "workspace:*",
     "@storybook/preview-api": "workspace:*",
     "@testing-library/dom": "^9.3.1",
-    "@testing-library/jest-dom": "^6.1.3",
+    "@testing-library/jest-dom": "^6.4.0",
     "@testing-library/user-event": "14.3.0",
     "@vitest/expect": "1.1.3",
     "@vitest/spy": "^1.1.3",

code/lib/test/src/expect.ts

@@ -16,9 +16,10 @@ import {
 } from '@vitest/expect';
 import * as matchers from '@testing-library/jest-dom/matchers';
 import type { PromisifyObject } from './utils';
+import type { TestingLibraryMatchers } from '@testing-library/jest-dom/types/matchers';
 
 type Matchers<T> = PromisifyObject<JestAssertion<T>> &
-  matchers.TestingLibraryMatchers<ReturnType<ExpectStatic['stringContaining']>, Promise<void>>;
+  TestingLibraryMatchers<ReturnType<ExpectStatic['stringContaining']>, Promise<void>>;
 
 // We only expose the jest compatible API for now
 export interface Assertion<T> extends Matchers<T> {

code/lib/test/src/index.test.ts

@@ -0,0 +1,8 @@
+import { it } from 'vitest';
+import { expect, fn } from '@storybook/test';
+
+it('storybook expect and fn can be used in vitest test', () => {
+  const spy = fn();
+  spy(1);
+  expect(spy).toHaveBeenCalledWith(1);
+});