Skip to content

Commit

Permalink
Merge branch 'refs/heads/kasper/error-handling' into kasper/improve-e…
Browse files Browse the repository at this point in the history
…rror-message

# Conflicts:
#	code/core/src/preview-errors.ts
  • Loading branch information
kasperpeulen committed Jul 7, 2024
2 parents 504e7c7 + 13338a2 commit 5c19998
Show file tree
Hide file tree
Showing 4 changed files with 75 additions and 103 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -518,7 +518,7 @@ describe('PreviewWeb', () => {
expect(vi.mocked(preview.view.showErrorDisplay).mock.calls[0][0]).toMatchInlineSnapshot(`
[SB_PREVIEW_API_0004 (MissingRenderToCanvasError): Expected your framework's preset to export a \`renderToCanvas\` field.
Perhaps it needs to be upgraded for Storybook 6.4?
Perhaps it needs to be upgraded for Storybook 7.0?
More info: https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#mainjs-framework-field
]
Expand Down
12 changes: 4 additions & 8 deletions code/core/src/preview-errors.ts
Original file line number Diff line number Diff line change
Expand Up @@ -63,8 +63,7 @@ export class ImplicitActionsDuringRendering extends StorybookError {
...
args: {
${data.name}: fn()
}
`,
}`,
});
}
}
Expand All @@ -90,7 +89,7 @@ export class MissingRenderToCanvasError extends StorybookError {
message: dedent`
Expected your framework's preset to export a \`renderToCanvas\` field.
Perhaps it needs to be upgraded for Storybook 6.4?`,
Perhaps it needs to be upgraded for Storybook 7.0?`,
documentation:
'https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#mainjs-framework-field',
});
Expand Down Expand Up @@ -234,8 +233,7 @@ export class MountMustBeDestructuredError extends StorybookError {
More info: https://storybook.js.org/docs/writing-tests/interaction-testing#run-code-before-each-test
Received the following play function:
${data.playFunction}
`,
${data.playFunction}`,
});
}
}
Expand Down Expand Up @@ -271,9 +269,7 @@ export class TestingLibraryMustBeConfiguredError extends StorybookError {
// or for React
render(<Story/>);
},
});
`,
});`,
});
}
}
Expand Down
162 changes: 69 additions & 93 deletions code/core/src/server-errors.ts
Original file line number Diff line number Diff line change
Expand Up @@ -58,8 +58,7 @@ export class NxProjectDetectedError extends StorybookError {
documentation: 'https://nx.dev/packages/storybook',
message: dedent`
We have detected Nx in your project. Nx has its own Storybook initializer, so please use it instead.
Run "nx g @nx/storybook:configuration" to add Storybook to your project.
`,
Run "nx g @nx/storybook:configuration" to add Storybook to your project.`,
});
}
}
Expand All @@ -73,9 +72,8 @@ export class MissingFrameworkFieldError extends StorybookError {
'https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#new-framework-api',
message: dedent`
Could not find a 'framework' field in Storybook config.
Please run 'npx storybook automigrate' to automatically fix your config.
`,
Please run 'npx storybook automigrate' to automatically fix your config.`,
});
}
}
Expand All @@ -89,7 +87,7 @@ export class InvalidFrameworkNameError extends StorybookError {
'https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#new-framework-api',
message: dedent`
Invalid value of '${data.frameworkName}' in the 'framework' field of Storybook config.
Please run 'npx storybook automigrate' to automatically fix your config.
`,
});
Expand All @@ -104,9 +102,8 @@ export class CouldNotEvaluateFrameworkError extends StorybookError {
documentation: '',
message: dedent`
Could not evaluate the '${data.frameworkName}' package from the 'framework' field of Storybook config.
Are you sure it's a valid package and is installed?
`,
Are you sure it's a valid package and is installed?`,
});
}
}
Expand All @@ -125,8 +122,7 @@ export class ConflictingStaticDirConfigError extends StorybookError {
* Storybook's option in the config file: 'staticDirs'
* Storybook's (deprecated) CLI flag: '--staticDir' or '-s'
Please remove the CLI flag from your storybook script and use only the 'staticDirs' option instead.
`,
Please remove the CLI flag from your storybook script and use only the 'staticDirs' option instead.`,
});
}
}
Expand All @@ -142,8 +138,7 @@ export class InvalidStoriesEntryError extends StorybookError {
Storybook could not index your stories.
Your main configuration somehow does not contain a 'stories' field, or it resolved to an empty array.
Please check your main configuration file and make sure it exports a 'stories' field that is not an empty array.
`,
Please check your main configuration file and make sure it exports a 'stories' field that is not an empty array.`,
});
}
}
Expand All @@ -159,8 +154,7 @@ export class WebpackMissingStatsError extends StorybookError {
],
message: dedent`
No Webpack stats found. Did you turn off stats reporting in your Webpack config?
Storybook needs Webpack stats (including errors) in order to build correctly.
`,
Storybook needs Webpack stats (including errors) in order to build correctly.`,
});
}
}
Expand Down Expand Up @@ -226,8 +220,7 @@ export class MissingAngularJsonError extends StorybookError {
documentation: 'https://storybook.js.org/docs/angular/faq#error-no-angularjson-file-found',
message: dedent`
An angular.json file was not found in the current working directory: ${data.path}
Storybook needs it to work properly, so please rerun the command at the root of your project, where the angular.json file is located.
`,
Storybook needs it to work properly, so please rerun the command at the root of your project, where the angular.json file is located.`,
});
}
}
Expand All @@ -242,11 +235,10 @@ export class AngularLegacyBuildOptionsError extends StorybookError {
'https://github.com/storybookjs/storybook/tree/next/code/frameworks/angular#how-do-i-migrate-to-an-angular-storybook-builder',
],
message: dedent`
Your Storybook startup script uses a solution that is not supported anymore.
You must use Angular builder to have an explicit configuration on the project used in angular.json.
Please run 'npx storybook automigrate' to automatically fix your config.
`,
Your Storybook startup script uses a solution that is not supported anymore.
You must use Angular builder to have an explicit configuration on the project used in angular.json.
Please run 'npx storybook automigrate' to automatically fix your config.`,
});
}
}
Expand All @@ -263,14 +255,13 @@ export class CriticalPresetLoadError extends StorybookError {
code: 2,
documentation: '',
message: dedent`
Storybook failed to load the following preset: ${data.presetName}.
Please check whether your setup is correct, the Storybook dependencies (and their peer dependencies) are installed correctly and there are no package version clashes.
If you believe this is a bug, please open an issue on Github.
${data.error.stack || data.error.message}
`,
Storybook failed to load the following preset: ${data.presetName}.
Please check whether your setup is correct, the Storybook dependencies (and their peer dependencies) are installed correctly and there are no package version clashes.
If you believe this is a bug, please open an issue on Github.
${data.error.stack || data.error.message}`,
});
}
}
Expand All @@ -282,16 +273,15 @@ export class MissingBuilderError extends StorybookError {
code: 3,
documentation: 'https://github.com/storybookjs/storybook/issues/24071',
message: dedent`
Storybook could not find a builder configuration for your project.
Builders normally come from a framework package e.g. '@storybook/react-vite', or from builder packages e.g. '@storybook/builder-vite'.
- Does your main config file contain a 'framework' field configured correctly?
- Is the Storybook framework package installed correctly?
- If you don't use a framework, does your main config contain a 'core.builder' configured correctly?
- Are you in a monorepo and perhaps the framework package is hoisted incorrectly?
If you believe this is a bug, please describe your issue in detail on Github.
`,
Storybook could not find a builder configuration for your project.
Builders normally come from a framework package e.g. '@storybook/react-vite', or from builder packages e.g. '@storybook/builder-vite'.
- Does your main config file contain a 'framework' field configured correctly?
- Is the Storybook framework package installed correctly?
- If you don't use a framework, does your main config contain a 'core.builder' configured correctly?
- Are you in a monorepo and perhaps the framework package is hoisted incorrectly?
If you believe this is a bug, please describe your issue in detail on Github.`,
});
}
}
Expand All @@ -304,8 +294,7 @@ export class GoogleFontsDownloadError extends StorybookError {
documentation:
'https://github.com/storybookjs/storybook/blob/next/code/frameworks/nextjs/README.md#nextjs-font-optimization',
message: dedent`
Failed to fetch \`${data.fontFamily}\` from Google Fonts with URL: \`${data.url}\`
`,
Failed to fetch \`${data.fontFamily}\` from Google Fonts with URL: \`${data.url}\``,
});
}
}
Expand All @@ -318,10 +307,9 @@ export class GoogleFontsLoadingError extends StorybookError {
documentation:
'https://github.com/storybookjs/storybook/blob/next/code/frameworks/nextjs/README.md#nextjs-font-optimization',
message: dedent`
An error occurred when trying to load Google Fonts with URL \`${data.url}\`.
${data.error instanceof Error ? data.error.message : ''}
`,
An error occurred when trying to load Google Fonts with URL \`${data.url}\`.
${data.error instanceof Error ? data.error.message : ''}`,
});
}
}
Expand All @@ -333,17 +321,16 @@ export class NoMatchingExportError extends StorybookError {
code: 4,
documentation: '',
message: dedent`
There was an exports mismatch error when trying to build Storybook.
Please check whether the versions of your Storybook packages match whenever possible, as this might be the cause.
Problematic example:
{ "@storybook/react": "7.5.3", "@storybook/react-vite": "7.4.5", "storybook": "7.3.0" }
Correct example:
{ "@storybook/react": "7.5.3", "@storybook/react-vite": "7.5.3", "storybook": "7.5.3" }
Please run \`npx storybook doctor\` for guidance on how to fix this issue.
`,
There was an exports mismatch error when trying to build Storybook.
Please check whether the versions of your Storybook packages match whenever possible, as this might be the cause.
Problematic example:
{ "@storybook/react": "7.5.3", "@storybook/react-vite": "7.4.5", "storybook": "7.3.0" }
Correct example:
{ "@storybook/react": "7.5.3", "@storybook/react-vite": "7.5.3", "storybook": "7.5.3" }
Please run \`npx storybook doctor\` for guidance on how to fix this issue.`,
});
}
}
Expand Down Expand Up @@ -400,16 +387,12 @@ export class MainFileMissingError extends StorybookError {
No configuration files have been found in your configDir: ${chalk.yellow(data.location)}.
Storybook needs a "main.js" file, please add it.
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 file is located at).`,
});
}
}

export class MainFileEvaluationError extends StorybookError {
// TODO: check if this error is still showing proper stack
readonly stack = '';

constructor(public data: { location: string; error: Error }) {
const errorText = chalk.white(
(data.error.stack || data.error.message).replaceAll(process.cwd(), '')
Expand All @@ -419,10 +402,10 @@ export class MainFileEvaluationError extends StorybookError {
category: Category.CORE_SERVER,
code: 7,
message: dedent`
Storybook couldn't evaluate your ${chalk.yellow(data.location)} file.
${errorText}
`,
Storybook couldn't evaluate your ${chalk.yellow(data.location)} file.
Original error:
${errorText}`,
});
}
}
Expand All @@ -436,12 +419,11 @@ export class GenerateNewProjectOnInitError extends StorybookError {
code: 3,
documentation: '',
message: dedent`
There was an error while using ${data.packageManager} to create a new ${
data.projectType
} project.
${data.error instanceof Error ? data.error.message : ''}
`,
There was an error while using ${data.packageManager} to create a new ${
data.projectType
} project.
${data.error instanceof Error ? data.error.message : ''}`,
});
}
}
Expand All @@ -453,16 +435,15 @@ export class UpgradeStorybookToLowerVersionError extends StorybookError {
code: 3,
message: dedent`
You are trying to upgrade Storybook to a lower version than the version currently installed. This is not supported.
Storybook version ${data.beforeVersion} was detected in your project, but you are trying to "upgrade" to version ${data.currentVersion}.
This usually happens when running the upgrade command without a version specifier, e.g. "npx storybook upgrade".
This will cause npm to run the globally cached storybook binary, which might be an older version.
Instead you should always run the Storybook CLI with a version specifier to force npm to download the latest version:
"npx storybook@latest upgrade"
`,
"npx storybook@latest upgrade"`,
});
}
}
Expand All @@ -478,15 +459,14 @@ export class UpgradeStorybookToSameVersionError extends StorybookError {
This usually happens when running the upgrade command without a version specifier, e.g. "npx storybook upgrade".
This will cause npm to run the globally cached storybook binary, which might be the same version that you already have.
This also happens if you're running the Storybook CLI that is locally installed in your project.
If you intended to upgrade to the latest version, you should always run the Storybook CLI with a version specifier to force npm to download the latest version:
"npx storybook@latest upgrade"
If you intended to re-run automigrations, you should run the "automigrate" command directly instead:
"npx storybook automigrate"
`,
"npx storybook automigrate"`,
});
}
}
Expand All @@ -498,10 +478,9 @@ export class UpgradeStorybookUnknownCurrentVersionError extends StorybookError {
code: 5,
message: dedent`
We couldn't determine the current version of Storybook in your project.
Are you running the Storybook CLI in a project without Storybook?
It might help if you specify your Storybook config directory with the --config-dir flag.
`,
It might help if you specify your Storybook config directory with the --config-dir flag.`,
});
}
}
Expand All @@ -513,9 +492,8 @@ export class UpgradeStorybookInWrongWorkingDirectory extends StorybookError {
code: 6,
message: dedent`
You are running the upgrade command in a CWD that does not contain Storybook dependencies.
Did you mean to run it in a different directory? Make sure the directory you run this command in contains a package.json with your Storybook dependencies.
`,
Did you mean to run it in a different directory? Make sure the directory you run this command in contains a package.json with your Storybook dependencies.`,
});
}
}
Expand All @@ -527,9 +505,8 @@ export class NoStatsForViteDevError extends StorybookError {
code: 1,
message: dedent`
Unable to write preview stats as the Vite builder does not support stats in dev mode.
Please remove the \`--stats-json\` flag when running in dev mode.
`,
Please remove the \`--stats-json\` flag when running in dev mode.`,
});
}
}
Expand All @@ -543,8 +520,7 @@ export class FindPackageVersionsError extends StorybookError {
code: 1,
message: dedent`
Unable to find versions of "${data.packageName}" using ${data.packageManager}
${data.error && `Reason: ${data.error}`}
`,
${data.error && `Reason: ${data.error}`}`,
});
}
}
2 changes: 1 addition & 1 deletion code/core/src/storybook-error.ts
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ export abstract class StorybookError extends Error {
* - If a string, uses the provided URL for documentation (external or FAQ links).
* - If `false` (default), no documentation link is added.
*/
public documentation: boolean | string | string[];
public readonly documentation: boolean | string | string[];

/**
* Flag used to easily determine if the error originates from Storybook.
Expand Down

0 comments on commit 5c19998

Please sign in to comment.