如何使用 React 測試庫和效果器（狀態管理器）測試 React 組件

Question

我正在使用效應器和反應測試庫（RTL）。 在 RTL 的文檔中有一篇關於customerRender的文章，我們將AllTheProviders作為渲染 function 的wrapper傳遞。

問題：如何對effector做同樣的事情（在那里找不到提供者）？ 以及如何模擬商店，因為可能不止一個（提供者的價值）？

最后，我只想使用render(<Component />)而不傳遞任何額外的數據，如文檔所示。

Answer 1

此時我找到了這個解決方案，不確定它是否適用於所有情況。

// test-utils.tsx
import React, { Suspense } from 'react';
import { I18nextProvider } from 'react-i18next';
import { MemoryRouter } from 'react-router-dom';
import { Provider as EffectorProvider } from 'effector-react/scope'; 
import { fork } form 'effector';

const AllTheProviders: FC = ({ children }) => {
  const scope = fork();

  return (
    <MemoryRouter>
      <I18nextProvider>
        <EffectorProvider value={scope}>
          <Suspense fallback="loading">{children}</Suspense>
        </EffectorProvider> 
      </I18nextProvider>
    </MemoryRouter>
  );
}
 
const customRender = (component: ReactElement, options?: Parameters<typeof render>[1]) => render(component, { wrapper: AllTheProviders, ...options })   


export { customRender as render }; 

看起來它正在工作，但仍然不清楚如何模擬events 。