首页 文章

Jest测试组件的内部方法

提问于
浏览 次
0

我正在使用反应原生0.40与jest 20.当试图测试组件的内部方法时我失败了因为我无法获取它的实例然后调用该方法 .

例如，我可以使用像这样的快照测试渲染的组件

it('renders correctly', () => {
    var store = mockStore(initialState);

    const tree = renderer.create(
        <Provider store={store}>
            <App/>
        </Provider>
    ).toJSON()

    expect(tree).toMatchSnapshot()
})

但是，如果我尝试测试App组件的内部方法，我找不到任何方法来访问它 . 因此以下代码将无法运行

it("checks version number correctly", () => {
    var store = mockStore(initialState);

    const tree = renderer.create(
        <Provider store={store}>
            <App/>
        </Provider>
    )

    expect(tree.needsUpdate("1.0.0")).toBe(true)
})

一些人使用的解决方案是“react-test-renderer / shallow”或“酶”浅层渲染组件并访问内部方法，但是当我导入它时可能找不到第一个（可能与RN版本有关？）和酶无法正确安装（可能再次，依赖性问题） . 所以我想知道的是，测试内部方法的最佳方法是什么 .

reactjs react-native testing jestjs

1 回答

  • 1

    您不必将组件实际包装在提供程序中 . 如果您只想测试组件，可以在不使用 connect()() 的情况下将其导出 . 例如：

    export class App extends React.Component {
   // your things
}

export default connect()(App);

    在测试文件中，您可以像这样导入您的应用：

    import ConnectedApp, { App } from "../App";

    然后，当您想要测试封装的 App 时，您可以像对待任何其他标准组件一样对待它：

    const props = {
  // mocked-out props your store would provide
};
const component = shallow(<App {...props} />);
component.instance().whateverMethodYouWant();

    就个人而言，我从不在模拟提供程序中包装组件，除非我需要 render 并且更深层次的组件是 connect ed .

    回复于

相关问题