Question

我正在@storybook/react项目中使用create-react-app 6。

我对我所有的商店/对象都有成千上万的测试和模拟，等等。

这些模拟使用jest.fn()。

我想在我的故事书中重复使用这些模拟，但是它说jest is not defined很有道理。

我想知道运行故事书时是否有一种简便的方法可以使玩笑在全球范围内可用。

当前，我在使用的每个模拟文件中添加import jest from 'jest-mock'，但我想知道是否有更好的解决方案。

示例：

test.stories.tsx

import React from 'react';

export default {
  title: 'Test'
};

export Test = () => <button onClick={jest.fn()}>Test</button>;

将编译但无法运行-> jest is not defined错误

import React from 'react';
import jest from 'jest-mock';

export default {
  title: 'Test'
};

export Test = () => <button onClick={jest.fn()}>Test</button>;

工作正常，但我希望避免在任何地方导入jest-mock。

Answer 1

通过将以下行添加到项目的preview.js文件夹中的.storybook文件中，可以确保在所有故事中都可以使用该模拟程序：

import jest from 'jest-mock';
window.jest = jest;

来自Storybook docs：

将Preview.js用于全局代码（例如CSS导入或JavaScript）模拟））。

Answer 2

您需要在jest config中全局设置它。 https://jestjs.io/docs/en/configuration#globals-object

在故事书中向全球提供笑话

2 个答案: