在 React Native 中，如何使用浅渲染测试我的组件？

Question

React, I use Shallow Rendering techniques for unit testing my React components. Can I do something similar in React Native？

我 followed the instructions to set up Jest，但找不到任何关于测试我的组件的文档。我想像使用 React 一样使用 React Native 进行完整的 TDD。

Answer 1

我想 enzyme 就是您要找的。

它为您提供了一个 shallow 功能，可以让您进行浅层比较（如您所愿）。

Enzyme 可以与所有流行的测试运行程序（如 Mocha、Jest、Karma 等）一起使用。可以找到完整列表 on the library's github page.

示例：

import {shallow} from 'enzyme';

describe('<MyComponent />', () => {
  it('should render three <Foo /> components', () => {
    const wrapper = shallow(<MyComponent />);
    expect(wrapper.find(Foo)).to.have.length(3);
  });
});

如需进一步阅读，您可以大致了解酶的 Shallow Rendering API or docs。

Answer 2

您可以在不使用 enzyme 的情况下执行此操作，只需使用 react-test-renderer 中的 Shallow Renderer。

import ShallowRenderer from 'react-test-renderer/shallow';

it('renders', () => {
  const renderer = new ShallowRenderer();
  const wrapper = renderer.render(<MyComponent />);

  expect(wrapper).toMatchSnapshot();
});

在 React Native 中，如何使用浅渲染测试我的组件？

In React Native how can I test my components with Shallow Rendering?

reactjs

react-native