storybookjs/storybook
View on GitHub[Bug]: if a control option includes 'reverse' , `function reverse() { [native code] }` is displayed
Open
#30,142 opened on Dec 26, 2024
argtypesbughelp wanted
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
- Create a component that accepts a string output
- In the component's story, specify the argType as
{control: "inline-radio", options: ["normal", "reverse"]} - 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