描述错误
在之前的版本(v6.5)中,Svelte组件参数上的JSDoc @type
注解被正确地翻译为自动构建component stories的argTypes。特别是,定义了多个选项的类型被翻译为单选按钮。
例如,给定以下组件参数:
/**
* @type {'small' | 'medium' | 'large'} How large should the button be?
*/
export let size = 'medium';
Storybook v6.5会在故事文件中生成一个带有3个选项的单选按钮控件,无需手动argTypes
定义。在使用v7时,单选按钮仍然被识别为合适的控件,但会出现错误,不会向单选按钮控件提供选项。
在调查过程中,我发现该第三方包仍然可以正确解析Svelte组件并识别JSDoc注解,将size
参数解释为union
类型,与之前相同(这个第三方包已经超过一年没有更新了)。此外,svelte渲染器中的extractArgTypes
函数似乎将控件类型识别为具有适当选项集的单选按钮。然而,在extractArgTypes
的某个地方,选项丢失了。前端输出一条控制台日志消息,显示“无选项的单选按钮:size”。
重现步骤
https://github.com/michaelstachowiak/storybook-v7-svelte-issue
To reproduce, you can just create the reproduction for svelte and comment out the manual `argTypes` definition for button sizes, which I've done in the public repository above. In v6.5 it would have correctly generated a radio button, in v7 it encounters the error outlined above.
系统环境
Environment Info:
System:
OS: macOS 13.0.1
CPU: (10) arm64 Apple M1 Max
Binaries:
Node: 16.17.0 - /usr/local/bin/node
Yarn: 3.3.1 - /usr/local/bin/yarn
npm: 8.15.0 - /usr/local/bin/npm
Browsers:
Chrome: 108.0.5359.124
Firefox: 106.0.5
Safari: 16.1
npmPackages:
@storybook/addon-essentials: ^7.0.0-beta.19 => 7.0.0-beta.19
@storybook/addon-interactions: ^7.0.0-beta.19 => 7.0.0-beta.19
@storybook/addon-links: ^7.0.0-beta.19 => 7.0.0-beta.19
@storybook/blocks: ^7.0.0-beta.19 => 7.0.0-beta.19
@storybook/svelte: ^7.0.0-beta.19 => 7.0.0-beta.19
@storybook/svelte-webpack5: ^7.0.0-beta.19 => 7.0.0-beta.19
@storybook/testing-library: ^0.0.13 => 0.0.13
其他上下文信息
从extractArgTypes
输出中可以看到单个参数的输出。根据此输出,我不明白为什么单选按钮不渲染任何选项,它们似乎已经被正确提取。
{
"control": {
"type": "radio",
"options": [
"small",
"medium",
"large"
]
},
"name": "color",
"description": "How large should the button be?",
"type": {
"required": false,
"name": "'small' | 'medium' | 'large'"
},
"table": {
"type": {
"summary": "'small' | 'medium' | 'large'"
},
"defaultValue": {
"summary": "medium"
},
"category": "properties"
}
}
2条答案
按热度按时间bis0qfac1#
很遗憾,问题仍然存在。
任何额外的见解或建议将不胜感激。
感谢您的持续支持。🙏
bf1o4zei2#
你好,这个问题有什么更新吗?