Storybook Vitest

storybook_vitest_addon

安装

yarn add storybook_vitest_addon

兼容性

"storybook": "^8.1.5",
"@storybook/react": "8.1.5",
"@storybook/react-vite": "^8.1.5",
"vitest": "^1.1.0"

描述

此插件旨在在一个新的 Storybook 面板中显示 Vitest 单元测试结果。使用 React 开发和测试。只需将其添加到 Storybook 配置中的插件列表中，然后您就可以在任何故事中使用它。

该插件提供最少的视觉效果以实现最大清晰度。它需要 2 个参数：testResults - json 格式的测试结果文件，以及 testFile - 组件测试文件的文件名（提供 TypeScript 定义）。

使用示例

// Button.stories.tsx

import vitestResults from "./unit-test-results.json";
/.../
export default {
  title: "Example/Button",
  component: Button,
  parameters: {
    vitest: {
      testFile: "Button.test.tsx",
      testResults: vitestResults,
    },
  },
};
/.../

另请参见 https://storybook.org.cn/addons/storybook_vitest_addon