Docgen: Errors on components whose names are keywords

[preciselywilliam]

The storybook project builds fine:

When I load the page I get a cryptic Javascript error:

My deps are as below (let me know if there are other relevant deps):

    "@storybook/addon-a11y": "^6.0.5",
    "@storybook/addon-actions": "^6.0.5",
    "@storybook/addon-knobs": "^6.0.5",
    "@storybook/addon-links": "^6.0.5",
    "@storybook/addons": "^6.0.5",
    "@storybook/react": "^6.0.5",
    "@storybook/source-loader": "^6.0.5",
    "react": "16.13.1",

Not really sure where to start debugging, any ideas on what could be wrong?

[shilman]

do you have a repro i can look at? i recently updated that part of the code and it's possible that you're hitting some kind of corner case bug

[preciselywilliam]

do you have a repro i can look at? i recently updated that part of the code and it's possible that you're hitting some kind of corner case bug

I went through and disabled story by story until I found the one causing the crash. It was below, where Toaster is a function which has to be called as Toaster.create();

export default {
	title: 'Toaster',
	component: Toaster,
};

My mistake, thanks for having a look at the issue. I'll leave the issue open if you want to take further action. @shilman

[TheKnarf]

I had a similar problem in a project after upgrading Storybook, turned out I head a react component called delete in a file called delete.tsx and at some point Storybook tried to generate some code that looked something like delete.module = ... which caused the SyntaxError. Renaming the component and the file solved it (never checked which one was the problem).

[shilman]

@TheKnarf

[stale[bot]]

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

[svvitale]

@TheKnarf nailed this one. A file named delete.tsx causes this failure mode.

[pladaria]

Same issue here. In my case instead of having a file delete.tsx I had a switch.tsx which caused the same problem: (SyntaxError: Unexpected token '.')

[boakenfull]

Yep, exactly the same issue here - I have switch.tsx which causes the same problem. Changing the file name to somethingElse.tsx everything compiles fine

[loelsonk]

Same issue, (SyntaxError: Unexpected token '.') and switch.tsx :D

[kilinkis]

switch.tsx too!

[stale[bot]]

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

[svvitale]

Still a bug

[Doenja]

Same issue. For me it was a folder called switch with an index.tsx. Renaming the folder solved the issue.

[shilman]

If you want this fixed, please upvote by adding a 👍 to the issue description. We use this to help prioritize!

[shilman]

Please upvote the fix in https://github.com/styleguidist/react-docgen-typescript/pull/313

[Deboracgs]

Same issue. For me it was a folder called switch with an index.tsx. Renaming the folder solved the issue.

same here

[PetterRuud]

Manually set the display name solved this for me

switch.tsx ... Switch.displayName = 'Switch'; ...

[jorgenbuilder]

Manually set the display name solved this for me

switch.tsx ... Switch.displayName = 'Switch'; ...

Confirming this solution worked in my case. Nice fix @PetterRuud!

[ndelangen]

I think this got fixed in 7.0 beta.

[reify-benjamin-solum]

As of 7.6.4 I'm still seeing this issue in Storybook. Above fixes work.

[andreyna1808]

Yeps, versions 7.6.12

If you had a problem with the switch component in the storybook, try changing it to "toogle", or similar names. The problem itself is the name guys