diff --git a/code/lib/core-events/src/errors/preview-errors.test.ts b/code/lib/core-events/src/errors/preview-errors.test.ts index 398646c4a624..fec373b143ee 100644 --- a/code/lib/core-events/src/errors/preview-errors.test.ts +++ b/code/lib/core-events/src/errors/preview-errors.test.ts @@ -8,11 +8,22 @@ describe('UnknownFlowArgTypesError', () => { raw: "SomeType['someProperty']", }; - const message = `"There was a failure when generating ArgTypes in Typescript for {"name":"signature","raw":"SomeType['someProperty']"} - This type is either not supported or it is a bug in Storybook. - If you think this is a bug, please open an issue in Github."`; - const typeError = new UnknownArgTypesError({ type, language: 'Typescript' }); - expect(typeError.message).toMatchInlineSnapshot(message); + expect(typeError.message).toMatchInlineSnapshot(` + "There was a failure when generating detailed ArgTypes in Typescript for: + + { + "name": "signature", + "raw": "SomeType['someProperty']" + } + + Storybook will fall back to use a generic type description instead. + + This type is either not supported or it is a bug in the docgen generation in Storybook. + If you think this is a bug, please detail it as much as possible in the Github issue. + + More info: https://github.com/storybookjs/storybook/issues/26606 + " + `); }); }); diff --git a/code/lib/core-events/src/errors/preview-errors.ts b/code/lib/core-events/src/errors/preview-errors.ts index b28cc8d59442..1f30378a3bca 100644 --- a/code/lib/core-events/src/errors/preview-errors.ts +++ b/code/lib/core-events/src/errors/preview-errors.ts @@ -259,15 +259,22 @@ export class UnknownArgTypesError extends StorybookError { readonly code = 1; + readonly documentation = 'https://github.com/storybookjs/storybook/issues/26606'; + constructor(public data: { type: object; language: string }) { super(); } template() { - return `There was a failure when generating ArgTypes in ${ + return dedent`There was a failure when generating detailed ArgTypes in ${ this.data.language - } for ${JSON.stringify(this.data.type)} - This type is either not supported or it is a bug in Storybook. - If you think this is a bug, please open an issue in Github.`; + } for: + + ${JSON.stringify(this.data.type, null, 2)} + + Storybook will fall back to use a generic type description instead. + + This type is either not supported or it is a bug in the docgen generation in Storybook. + If you think this is a bug, please detail it as much as possible in the Github issue.`; } } diff --git a/code/lib/docs-tools/src/argTypes/convert/index.ts b/code/lib/docs-tools/src/argTypes/convert/index.ts index 60db96fe65d6..812fcf517896 100644 --- a/code/lib/docs-tools/src/argTypes/convert/index.ts +++ b/code/lib/docs-tools/src/argTypes/convert/index.ts @@ -7,9 +7,14 @@ import { convert as propTypesConvert } from './proptypes'; export const convert = (docgenInfo: DocgenInfo) => { const { type, tsType, flowType } = docgenInfo; - if (type != null) return propTypesConvert(type); - if (tsType != null) return tsConvert(tsType as TSType); - if (flowType != null) return flowConvert(flowType as FlowType); + try { + if (type != null) return propTypesConvert(type); + if (tsType != null) return tsConvert(tsType as TSType); + if (flowType != null) return flowConvert(flowType as FlowType); + } catch (err) { + // if we can't convert the type, we'll just return null to fallback to a simple summary, and provide the error to the user + console.error(err); + } return null; };