如何将setProps与通过ThemeProvider安装的组件一起使用

时间:2018-12-20 00:34:35

标签: reactjs jestjs enzyme

我正在使用酶的安装方法来测试我的组件。

export const mountWithTheme = (children, options) => (
  mount(<ThemeProvider theme={theme}>{children}</ThemeProvider>, options)
);

对于一些测试用例,我需要道具,但是setProps似乎对我来说不起作用。我不能使用浅表,因为我正在做一些依赖于DOM的活动,因此我需要渲染我的组件。

这是我的测试用例,下面是错误代码。

import React from 'react';
import { SearchResult } from './SearchResultTable';
import { mountWithTheme } from '../../helper';


describe('<SearchResultTable />', () => {
  let component;
  beforeEach(() => {
    component = mountWithTheme(
      <SearchResult />,
    );
    Element.prototype.getBoundingClientRect = jest.fn(() => ({
      width: 120,
      height: 120,
      top: 0,
      left: 0,
      bottom: 0,
      right: 0,
    }));
  });

  it('should render grid if product data is available', () => {
    const searchResult = {
      name: 'test',
    };
    component.find(SearchResult).setProps({
      searchResult,
    });

    const instance = component.find(SearchResult).instance();
    expect(instance.renderRow(0)).toEqual(searchResult);
  });
});

enter image description here

我尝试直接在没有报告任何错误且没有设置道具的组件上调用setProps方法。这是屏幕截图。

enter image description here

0 个答案:

没有答案