storybookjs/storybook

[Bug]: if a control option includes 'reverse' , `function reverse() { [native code] }` is displayed

Fechada

#30.142 aberto em 26 de dez. de 2024

 (6 comentários) (1 reação) (0 responsável)TypeScript (10.058 forks)batch import
argtypesbughelp wanted

Métricas do repositório

Stars
 (89.909 estrelas)
Métricas de merge de PR
 (Mesclagem média 7d 22h) (184 fundiu PRs em 30d)

Description

Describe the bug

If a story control type contains the word 'reverse' among its options, the control value in the UI for this option will display the text function reverse() { [native code] } instead of "reverse".

I've provided the StackBlitz reproduction link below, however it is from an anonymous fork, so it might get wiped after a while. In that case, the story setup is quite straightforward:

<script module>
  import { defineMeta } from '@storybook/addon-svelte-csf';
  import SomeComponentComponent from './SomeComponent.svelte';

  const { Story } = defineMeta({
    title: 'Example/SomeComponent',
    component: SomeComponentComponent,
    tags: ['autodocs'],
    argTypes: {
      option: {
        control: "inline-radio",
        options: ['normal', 'reverse',],
      },
    },
    
  });
</script>

<Story name="SomeComponent" args={{ option:'normal' }} />

Reproduction link

https://stackblitz.com/edit/github-yndwrtai?file=src%2Fstories%2FSomeComponent.stories.svelte

Reproduction steps

  1. Create a component that accepts a string output
  2. In the component's story, specify the argType as {control: "inline-radio", options: ["normal", "reverse"]}
  3. Run Storybook and navigate to the component story. For the specified control, you will see the following options displayed:
• normal 
• function reverse() { [native code] }

System

torybook Environment Info:

  System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 18.20.3 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 10.2.3 - /usr/local/bin/npm <----- active
    pnpm: 8.15.6 - /usr/local/bin/pnpm
  npmPackages:
    @storybook/addon-essentials: ^8.5.0-beta.6 => 8.5.0-beta.6 
    @storybook/addon-interactions: ^8.5.0-beta.6 => 8.5.0-beta.6 
    @storybook/addon-svelte-csf: ^5.0.0-next.21 => 5.0.0-next.21 
    @storybook/blocks: ^8.5.0-beta.6 => 8.5.0-beta.6 
    @storybook/svelte: ^8.5.0-beta.6 => 8.5.0-beta.6 
    @storybook/svelte-vite: ^8.5.0-beta.6 => 8.5.0-beta.6 
    @storybook/test: ^8.5.0-beta.6 => 8.5.0-beta.6 
    storybook: ^8.5.0-beta.6 => 8.5.0-beta.6

Additional context

No response

Guia do colaborador