Documentation: Adjust incorrect and outdated links in the codebase

code/addons/a11y/src/types.ts

@@ -24,7 +24,7 @@ export interface A11yGlobals {
      * Prevent the addon from executing automated accessibility checks upon visiting a story. You
      * can still trigger the checks from the addon panel.
      *
-     * @see https://storybook.js.org/docs/writing-tests/accessibility-testing#turn-off-automated-a11y-tests
+     * @see https://storybook.js.org/docs/writing-tests/accessibility-testing#disable-automated-checks
      */
     manual?: boolean;
   };

code/addons/docs/src/types.ts

@@ -115,8 +115,6 @@ type SourceBlockParameters = {
   /**
    * The formatting used on source code. Both true and 'dedent' have the same effect of removing any
    * extraneous indentation. Supports all valid prettier parser names.
-   *
-   * @see https://storybook.js.org/docs/api/doc-blocks/doc-block-source#format
    */
   format?: boolean | 'dedent' | string;
   // TODO: We could try to extract types from 'SupportedLanguages' in SyntaxHighlihter, but for now we inline them

code/addons/vitest/src/postinstall.ts

@@ -164,7 +164,7 @@ export default async function postInstall(options: PostinstallOptions) {
     Found an existing Vitest setup file:
     ${vitestSetupFile}
     Please refer to the documentation to complete the setup manually:
-    https://storybook.js.org/docs/next/${DOCUMENTATION_LINK}#manual-setup
+    https://storybook.js.org/docs/next/${DOCUMENTATION_LINK}#manual-setup-advanced
   `;
     logger.line();
     logger.error(`${errorMessage}\n`);
@@ -256,7 +256,7 @@ export default async function postInstall(options: PostinstallOptions) {
           your existing workspace file automatically, you must do it yourself.
 
           Please refer to the documentation to complete the setup manually:
-          https://storybook.js.org/docs/next/${DOCUMENTATION_LINK}#manual-setup
+          https://storybook.js.org/docs/next/${DOCUMENTATION_LINK}#manual-setup-advanced
         `
       );
       errors.push(
@@ -304,7 +304,7 @@ export default async function postInstall(options: PostinstallOptions) {
         We were unable to update your existing ${vitestConfigFile ? 'Vitest' : 'Vite'} config file.
 
         Please refer to the documentation to complete the setup manually:
-        https://storybook.js.org/docs/writing-tests/integrations/vitest-addon#manual-setup
+        https://storybook.js.org/docs/writing-tests/integrations/vitest-addon#manual-setup-advanced
       `);
       errors.push(new AddonVitestPostinstallConfigUpdateError({ filePath: rootConfig }));
     }
@@ -365,7 +365,7 @@ export default async function postInstall(options: PostinstallOptions) {
       logger.error(dedent`
         Could not automatically set up ${addonA11yName} for @storybook/addon-vitest.
         Please refer to the documentation to complete the setup manually:
-        https://storybook.js.org/docs/writing-tests/accessibility-testing#test-addon-integration
+        https://storybook.js.org/docs/writing-tests/accessibility-testing#integration-with-vitest-addon
       `);
       errors.push(new AddonVitestPostinstallFailedAddonA11yError({ error: e }));
     }
@@ -390,7 +390,7 @@ export default async function postInstall(options: PostinstallOptions) {
       dedent`
         Done, but with errors!
         @storybook/addon-vitest was installed successfully, but there were some errors during the setup process. Please refer to the documentation to complete the setup manually and check the errors above:
-        https://storybook.js.org/docs/next/${DOCUMENTATION_LINK}#manual-setup
+        https://storybook.js.org/docs/next/${DOCUMENTATION_LINK}#manual-setup-advanced
       `
     );
     throw new AddonVitestPostinstallError({ errors });

code/addons/vitest/src/preset.ts

@@ -69,9 +69,9 @@ export const experimental_serverChannel = async (channel: Channel, options: Opti
   if (!resolvedPreviewBuilder?.includes('vite')) {
     if (framework.includes('nextjs')) {
       log(dedent`
-        You're using ${framework}, which is a Webpack-based builder. In order to use Storybook Test, with your project, you need to use '@storybook/nextjs-vite', a high performance Vite-based equivalent.
+        You're using ${framework}, which is a Webpack-based builder. In order to use Storybook's Vitest addon, with your project, you need to use '@storybook/nextjs-vite', a high performance Vite-based equivalent.
 
-        Information on how to upgrade here: ${picocolors.yellow('https://storybook.js.org/docs/get-started/frameworks/nextjs?ref=upgrade#with-vite')}\n
+        Refer to the following documentation for more information: ${picocolors.yellow('https://storybook.js.org/docs/get-started/frameworks/nextjs-vite?ref=upgrade#choose-between-vite-and-webpack')}\n
       `);
     }
     return channel;

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

@@ -34,7 +34,7 @@ export interface StorybookConfigWebpack
     /**
      * Enable the experimental `.test` function in CSF Next
      *
-     * @see https://storybook.js.org/docs/10/api/main-config/main-config-features#experimentalTestSyntax
+     * @see https://storybook.js.org/docs/api/main-config/main-config-features#experimentaltestsyntax
      */
     experimentalTestSyntax?: boolean;
   };

code/core/src/actions/types.ts

@@ -19,7 +19,13 @@ export interface ActionsParameters {
      */
     argTypesRegex?: string;
 
-    /** Remove the addon panel and disable the addon's behavior */
+    /**
+     * Removes the addon panel and turns off the feature's behavior. If you wish to turn off this
+     * feature for the entire Storybook, you can set the option in your `main.js|ts` configuration
+     * file.
+     *
+     * @see https://storybook.js.org/docs/essentials/actions#disable
+     */
     disable?: boolean;
 
     /**
@@ -30,8 +36,6 @@ export interface ActionsParameters {
      * **To enable this feature, you must use the `withActions` decorator.**
      *
      * @example `handles: ['mouseover', 'click .btn']`
-     *
-     * @see https://storybook.js.org/docs/essentials/actions#action-event-handlers
      */
     handles?: string[];
   };

code/core/src/backgrounds/types.ts

@@ -28,7 +28,12 @@ export interface BackgroundsParameters {
     /** Default background color */
     default?: string;
 
-    /** Remove the addon panel and disable the addon's behavior */
+    /**
+     * Removes the tool and disables the feature's behavior. If you wish to turn off this feature
+     * for the entire Storybook, you can set the option in your `main.js|ts` configuration file.
+     *
+     * @see https://storybook.js.org/docs/essentials/backgrounds#disable
+     */
     disable?: boolean;
 
     /** Configuration for the background grid */

code/core/src/cli/eslintPlugin.ts

@@ -259,7 +259,7 @@ export const suggestESLintPlugin = async (): Promise<boolean> => {
   const shouldInstall = await prompt.confirm({
     message: dedent`
         We have detected that you're using ESLint. Storybook provides a plugin that gives the best experience with Storybook and helps follow best practices: ${picocolors.yellow(
-          'https://storybook.js.org/docs/9/configure/integration/eslint-plugin'
+          'https://storybook.js.org/docs/configure/integration/eslint-plugin'
         )}
 
         Would you like to install it?

code/core/src/controls/types.ts

@@ -5,7 +5,13 @@ export interface ControlsParameters {
    * @see https://storybook.js.org/docs/essentials/controls#parameters-1
    */
   controls?: {
-    /** Remove the addon panel and disable the addon's behavior */
+    /**
+     * Removes the addon panel and turns off the feature's behavior. If you wish to turn off this
+     * feature for the entire Storybook, you can set the option in your `main.js|ts` configuration
+     * file.
+     *
+     * @see https://storybook.js.org/docs/essentials/controls#disable
+     */
     disable?: boolean;
 
     /** Disable the ability to create or edit stories from the Controls panel */

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

@@ -109,7 +109,7 @@ export const babel = async (_: unknown, options: Options) => {
     ...babelDefault,
     // This override makes sure that we will never transpile babel further down then the browsers that storybook supports.
     // This is needed to support the mount property of the context described here:
-    // https://storybook.js.org/docs/writing-tests/interaction-testing#run-code-before-each-test
+    // https://storybook.js.org/docs/writing-tests/interaction-testing#run-code-before-each-story-in-a-file
     overrides: [
       ...(babelDefault?.overrides ?? []),
       {

code/core/src/core-server/utils/StoryIndexGenerator.ts

@@ -617,7 +617,7 @@ export class StoryIndexGenerator {
       if (err && (err as { source: any }).source?.match(/mdast-util-mdx-jsx/g)) {
         logger.warn(
           `💡 This seems to be an MDX2 syntax error. Please refer to the MDX section in the following resource for assistance on how to fix this: ${picocolors.yellow(
-            'https://storybook.js.org/docs/7/migration-guide?ref=error'
+            'https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#mdx2-upgrade'
           )}`
         );
       }

code/core/src/core-server/utils/warnWhenUsingArgTypesRegex.ts

@@ -44,7 +44,7 @@ export async function warnWhenUsingArgTypesRegex(
             )} and assigning explicit action with the ${picocolors.cyan(
               'fn'
             )} function from ${picocolors.cyan('storybook/test')} instead:
-            https://storybook.js.org/docs/essentials/actions#via-storybooktest-fn-spy-function
+            https://storybook.js.org/docs/essentials/actions#via-storybooktest-fn-spies
             
             The build used by the addon for snapshot testing doesn't take the regex into account, which can cause hard to debug problems when a snapshot depends on the presence of action props.
           `;

code/core/src/highlight/types.ts

@@ -11,7 +11,12 @@ export interface HighlightParameters {
    * @see https://storybook.js.org/docs/essentials/highlight#parameters
    */
   highlight?: {
-    /** Remove the addon panel and disable the addon's behavior */
+    /**
+     * Removes the tool and disables the feature's behavior. If you wish to turn off this feature
+     * for the entire Storybook, you can set the option in your `main.js|ts` configuration file.
+     *
+     * @see https://storybook.js.org/docs/essentials/highlight#disable
+     */
     disable?: boolean;
   };
 }

code/core/src/manager/components/mobile/about/MobileAbout.tsx

@@ -61,7 +61,7 @@ export const MobileAbout: FC = () => {
               <ShareAltIcon width={12} />
             </LinkLine>
             <LinkLine
-              href="https://storybook.js.org/docs/react/get-started/install/?ref=ui"
+              href="https://storybook.js.org/docs/get-started/install?ref=ui"
               target="_blank"
               rel="noopener noreferrer"
             >

code/core/src/measure/types.ts

@@ -5,7 +5,12 @@ export interface MeasureParameters {
    * @see https://storybook.js.org/docs/essentials/measure-and-outline#parameters
    */
   measure?: {
-    /** Remove the addon panel and disable the addon's behavior */
+    /**
+     * Removes the tool and disables the feature's behavior. If you wish to turn off this feature
+     * for the entire Storybook, you can set the option in your `main.js|ts` configuration file.
+     *
+     * @see https://storybook.js.org/docs/essentials/measure-and-outline#disable
+     */
     disable?: boolean;
   };
 }

code/core/src/outline/types.ts

@@ -5,7 +5,12 @@ export interface OutlineParameters {
    * @see https://storybook.js.org/docs/essentials/measure-and-outline#parameters
    */
   outline?: {
-    /** Remove the addon panel and disable the addon's behavior */
+    /**
+     * Removes the tool and disables the feature's behavior. If you wish to turn off this feature
+     * for the entire Storybook, you can set the option in your `main.js|ts` configuration file.
+     *
+     * @see https://storybook.js.org/docs/essentials/measure-and-outline#disable
+     */
     disable?: boolean;
   };
 }

code/core/src/preview-api/modules/preview-web/parseArgsParam.ts

@@ -114,7 +114,7 @@ export const parseArgsParam = (argsString: string): Args => {
     once.warn(dedent`
       Omitted potentially unsafe URL args.
 
-      More info: https://storybook.js.org/docs/writing-stories/args#setting-args-through-the-url?ref=error
+      More info: https://storybook.js.org/docs/writing-stories/args?ref=error#setting-args-through-the-url
     `);
     return acc;
   }, {} as Args);

code/core/src/preview-errors.ts

@@ -318,7 +318,8 @@ export class NextJsSharpError extends StorybookError {
       name: 'NextJsSharpError',
       category: Category.FRAMEWORK_NEXTJS,
       code: 1,
-      documentation: 'https://storybook.js.org/docs/get-started/nextjs#faq',
+      documentation:
+        'https://storybook.js.org/docs/get-started/frameworks/nextjs#error-you-are-importing-avif-images-but-you-dont-have-sharp-installed-you-have-to-install-sharp-in-order-to-use-image-optimization-features-in-nextjs',
       message: dedent`
       You are importing avif images, but you don't have sharp installed.
 

code/core/src/server-errors.ts

@@ -309,7 +309,7 @@ export class GoogleFontsDownloadError extends StorybookError {
       category: Category.FRAMEWORK_NEXTJS,
       code: 1,
       documentation:
-        'https://github.com/storybookjs/storybook/blob/next/code/frameworks/nextjs/README.md#nextjs-font-optimization',
+        'https://storybook.js.org/docs/get-started/frameworks/nextjs#nextjs-font-optimization',
       message: dedent`
         Failed to fetch \`${data.fontFamily}\` from Google Fonts with URL: \`${data.url}\``,
     });
@@ -323,7 +323,7 @@ export class GoogleFontsLoadingError extends StorybookError {
       category: Category.FRAMEWORK_NEXTJS,
       code: 2,
       documentation:
-        'https://github.com/storybookjs/storybook/blob/next/code/frameworks/nextjs/README.md#nextjs-font-optimization',
+        'https://storybook.js.org/docs/get-started/frameworks/nextjs#nextjs-font-optimization',
       message: dedent`
         An error occurred when trying to load Google Fonts with URL \`${data.url}\`.
 
@@ -374,12 +374,12 @@ export class MainFileMissingError extends StorybookError {
     const map = {
       storybook: {
         helperMessage:
-          'You can pass a --config-dir flag to tell Storybook, where your main.js file is located at.',
+          'You can pass a --config-dir flag to tell Storybook, where your main.js|ts file is located at.',
         documentation: 'https://storybook.js.org/docs/configure?ref=error',
       },
       vitest: {
         helperMessage:
-          'You can pass a configDir plugin option to tell where your main.js file is located at.',
+          'You can pass a configDir plugin option to tell where your main.js|ts file is located at.',
         // TODO: add proper docs once available
         documentation: 'https://storybook.js.org/docs/configure?ref=error',
       },
@@ -392,7 +392,7 @@ export class MainFileMissingError extends StorybookError {
       documentation,
       message: dedent`
         No configuration files have been found in your configDir: ${picocolors.yellow(data.location)}.
-        Storybook needs a "main.js" file, please add it.
+        Storybook needs a "main.js|ts" file, please add it.
 
         ${helperMessage}`,
     });
@@ -489,7 +489,7 @@ export class AddonVitestPostinstallExistingSetupFileError extends StorybookError
       category: Category.CLI_INIT,
       isHandledError: true,
       code: 7,
-      documentation: `https://storybook.js.org/docs/writing-tests/integrations/vitest-addon#manual-setup`,
+      documentation: `https://storybook.js.org/docs/writing-tests/integrations/vitest-addon#manual-setup-advanced`,
       message: dedent`
         Found an existing Vitest setup file: ${data.filePath}
         Please refer to the documentation to complete the setup manually.
@@ -505,7 +505,7 @@ export class AddonVitestPostinstallWorkspaceUpdateError extends StorybookError {
       category: Category.CLI_INIT,
       isHandledError: true,
       code: 8,
-      documentation: `https://storybook.js.org/docs/writing-tests/integrations/vitest-addon#manual-setup`,
+      documentation: `https://storybook.js.org/docs/writing-tests/integrations/vitest-addon#manual-setup-advanced`,
       message: dedent`
         Could not update existing Vitest workspace file: ${data.filePath}
         Please refer to the documentation to complete the setup manually.
@@ -521,7 +521,7 @@ export class AddonVitestPostinstallConfigUpdateError extends StorybookError {
       category: Category.CLI_INIT,
       isHandledError: true,
       code: 9,
-      documentation: `https://storybook.js.org/docs/writing-tests/integrations/vitest-addon#manual-setup`,
+      documentation: `https://storybook.js.org/docs/writing-tests/integrations/vitest-addon#manual-setup-advanced`,
       message: dedent`
         Unable to update existing Vitest config file: ${data.filePath}
         Please refer to the documentation to complete the setup manually.

code/core/src/viewport/types.ts

@@ -35,10 +35,10 @@ export interface ViewportParameters {
    */
   viewport?: {
     /**
-     * Remove the addon panel and disable the addon's behavior . If you wish to turn off this addon
-     * for the entire Storybook, you should do so when registering addon-essentials
+     * Removes the tool and disables the feature's behavior. If you wish to turn off this feature
+     * for the entire Storybook, you can set the option in your `main.js|ts` configuration file.
      *
-     * @see https://storybook.js.org/docs/essentials/index#disabling-addons
+     * @see https://storybook.js.org/docs/essentials/viewport#disable
      */
     disable?: boolean;
 

code/frameworks/angular/src/client/public-types.ts

@@ -20,7 +20,7 @@ export type { AngularRenderer };
 /**
  * Metadata to configure the stories for a component.
  *
- * @see [Default export](https://storybook.js.org/docs/formats/component-story-format/#default-export)
+ * @see [Default export](https://storybook.js.org/docs/api/csf#default-export)
  */
 export type Meta<TArgs = Args> = ComponentAnnotations<
   AngularRenderer,
@@ -30,7 +30,7 @@ export type Meta<TArgs = Args> = ComponentAnnotations<
 /**
  * Story function that represents a CSFv2 component example.
  *
- * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
+ * @see [Named Story exports](https://storybook.js.org/docs/api/csf#named-story-exports)
  */
 export type StoryFn<TArgs = Args> = AnnotatedStoryFn<
   AngularRenderer,
@@ -40,7 +40,7 @@ export type StoryFn<TArgs = Args> = AnnotatedStoryFn<
 /**
  * Story object that represents a CSFv3 component example.
  *
- * @see [Named Story exports](https://storybook.js.org/docs/formats/component-story-format/#named-story-exports)
+ * @see [Named Story exports](https://storybook.js.org/docs/api/csf#named-story-exports)
  */
 export type StoryObj<TArgs = Args> = StoryAnnotations<
   AngularRenderer,

code/frameworks/angular/template/stories/others/ngx-translate/README.mdx

@@ -9,7 +9,7 @@ import { Meta } from '@storybook/addon-docs/blocks';
 There are several ways to configure ngx-translate in storybook which will depend on your context.
 
 Here is a simple example with a storybook decorator that you can place in the `preview.ts` or locally on the stories.
-[See the doc on decorators](https://storybook.js.org/docs/angular/writing-stories/decorators)
+[See the doc on decorators](https://storybook.js.org/docs/writing-stories/decorators?renderer=angular)
 
 ```ts
 import { HttpClient, HttpClientModule } from '@angular/common/http';

code/frameworks/html-vite/template/cli/ts/Header.stories.ts

@@ -14,7 +14,6 @@ const meta = {
     // More on how to position stories at: https://storybook.js.org/docs/configure/story-layout
     layout: 'fullscreen',
   },
-  // More on argTypes: https://storybook.js.org/docs/api/argtypes
   args: {
     onLogin: fn(),
     onLogout: fn(),

code/frameworks/nextjs-vite/README.md

@@ -1,6 +1,6 @@
 # Storybook for Next.js with Vite Builder
 
-See [documentation](https://storybook.js.org/docs/get-started/frameworks/nextjs?renderer=react&ref=readme) for installation instructions, usage examples, APIs, and more.
+See [documentation](https://storybook.js.org/docs/get-started/frameworks/nextjs-vite?renderer=react&ref=readme) for installation instructions, usage examples, APIs, and more.
 
 ## Acknowledgements
 

code/frameworks/nextjs-vite/src/types.ts

@@ -43,7 +43,7 @@ export interface NextJsParameters {
   /**
    * Next.js framework configuration
    *
-   * @see https://storybook.js.org/docs/get-started/frameworks/nextjs
+   * @see https://storybook.js.org/docs/get-started/frameworks/nextjs-vite
    */
   nextjs?: {
     /**

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

@@ -45,7 +45,7 @@ type StorybookConfigFramework = {
     /**
      * Enable the experimental `.test` function in CSF Next
      *
-     * @see https://storybook.js.org/docs/10/api/main-config/main-config-features#experimentalTestSyntax
+     * @see https://storybook.js.org/docs/api/main-config/main-config-features#experimentaltestsyntax
      */
     experimentalTestSyntax?: boolean;
   };