如何使用React测试库和效应器(状态管理器)测试React组件

Question

我使用的是效应器和React测试库(RTL)。在RTL文档中有一篇关于customerRender的文章，其中我们将AllTheProviders作为渲染函数的wrapper传递。

问题:如何与effector做同样的事情(在那里找不到提供者)?如何模拟存储(s)，因为可能有多个(值为提供者)?

最后，我只想使用render(<Component />)而不传递任何额外的数据，如doc所示。

Answer 1

似乎您必须添加一个应该提供模拟值并将其传递给效应器提供程序的作用域。如果您尝试以下操作，应该可以很好地工作:

import { Provider } from 'effector-react/ssr';
import { fork, hydrate, root } from 'effector-root';
import { render } from '@testing-library/react';
import { $store } from './store' 

const Wrapper = ({ children }: Record<any, any>) => (
<Provider value={scope}>{children}</Provider>
);
it('Test', async () => {
const scope = fork(root)
hydrate(scope, {
values: [
[
$store,
'value',
],
],
});
const { getByTestId } = render(<TestableComponent />, {
wrapper: Wrapper,
});
})