storybookjs / storybook

Storybook is the industry standard workshop for building, documenting, and testing UI components in isolation
https://storybook.js.org
MIT License
84.22k stars 9.26k forks source link

[Bug]: `Cannot convert object to primitive value` when passing Modules in args #20505

Open JReinhold opened 1 year ago

JReinhold commented 1 year ago

Describe the bug

When passing a Module to an arg in a CSF story like this:

import { Description } from './Description';
import * as DefaultButtonStories from '../examples/Button.stories'; // 👈

const meta = {
  component: Description,
};
export default meta;

export const OfMetaAsComponentComment = {
  args: {
    of: DefaultButtonStories,  // 👈
  }
};

The story crashes with Cannot convert object to primitive value:

Cannot convert object to primitive value
TypeError: Cannot convert object to primitive value
    at http://localhost:6006/sb-preview/runtime.mjs:8814:34
    at Array.reduce (<anonymous>)
    at undecoratedStoryFn (http://localhost:6006/sb-preview/runtime.mjs:8812:53)
    at http://localhost:6006/sb-preview/runtime.mjs:6111:21
    at http://localhost:6006/sb-preview/runtime.mjs:8704:12
    at jsxDecorator (http://localhost:6006/node_modules/.cache/.vite-storybook/deps/@storybook_react_preview.js?v=ce6491e8:1862:17)
    at http://localhost:6006/sb-preview/runtime.mjs:6111:21
    at http://localhost:6006/sb-preview/runtime.mjs:8679:23
    at http://localhost:6006/sb-preview/runtime.mjs:8704:12
    at wrapper (http://localhost:6006/node_modules/.cache/.vite-storybook/deps/@storybook_addon-links_preview.js?v=ce6491e8:106:12)

An error that is thrown from here: https://github.com/storybookjs/storybook/blob/7584d9630a55825e5b747291bb506f38ed45d402/code/renderers/react/src/docs/jsxDecorator.tsx#L111-L112

To Reproduce

  1. git checkout block-description-improvements
  2. cd code
  3. yarn storybook:ui
  4. Comment out the workaround at https://github.com/storybookjs/storybook/blob/7584d9630a55825e5b747291bb506f38ed45d402/code/ui/blocks/src/blocks/Description.stories.tsx#L17
  5. Navigate to http://localhost:6006/?path=/story/storybook-blocks-blocks-description--of-meta-as-meta-comment

The source for the stories can be seen here: https://github.com/storybookjs/storybook/blob/7584d9630a55825e5b747291bb506f38ed45d402/code/ui/blocks/src/blocks/Description.stories.tsx

Additional context

This is not a problem if the arg is defined in the meta, only in the story.

AnandChandrakar commented 8 months ago

Hi @JReinhold , the links you have provided are not working. The specified branch is deleted. Can you please update the issue description and link to the source files you mentioned.

JReinhold commented 8 months ago

Thanks @AnandChandrakar . Updated