我在Storybook版本6:中使用此插件
https://www.npmjs.com/package/@故事书/插件笑话
由于我想显示每个故事的笑话测试结果,但它不显示笑话结果,尽管有以下配置:
/* eslint-disable react/jsx-props-no-spreading */
import React from 'react';
import { DocumentUploadStatus } from '@/models/document';
import { Meta, Story } from '@storybook/react/types-6-0';
import { withTests } from '@storybook/addon-jest';
import results from '@/test/reports/jest-test-results.json';
import UploadState, { UploadStateProps } from './UploadState';
export default {
title: 'UploadState',
component: UploadState,
decorators: [withTests({ results, filesExt: '.spec.tsx' })],
} as Meta;
const Template: Story<UploadStateProps> = args => <UploadState {...args} />;
export const InProgress = Template.bind({});
InProgress.args = {
progress: 50,
filename: 'file.txt',
status: DocumentUploadStatus.IN_PROGRESS,
};
export const WithTests = (): string =>
'This story shows test results for <UploadState />';
WithTests.story = {
parameters: {
jest: 'UploadState',
},
};
和result
json:
{
"assertionResults": [{
"ancestorTitles": ["<UploadState />"],
"failureMessages": [],
"fullName": "<UploadState /> should render default state",
"location": null,
"status": "passed",
"title": "should render default state"
}, {
"ancestorTitles": ["<UploadState />"],
"failureMessages": []],
"endTime": 1605914342915,
"message": "",
"name": "/Users/usr/workspace/text-mining-web/src/components/Document/UploadList/UploadList.spec.tsx",
"startTime": 1605914342081,
"status": "passed",
"summary": ""
}
我遇到了和你类似的问题,我在故事书的github上发现了一个问题,解决了这个问题。
基本上,在您的main.js
文件上:
webpackFinal: (config) => {
// Workaround for @storybook/addon-jest on Webpack 5
config.resolve = {
...config.resolve,
alias: {
...config.resolve.alias,
path: require.resolve('path-browserify'),
},
};
return config;
}
你应该添加路径别名,这将通过浏览路径来解决