如何用开玩笑改善反应成分的测试？

Question

我需要帮助才能了解如何改进测试？

我将branches测试覆盖率达到100％，但无法进行statements测试，functions测试和lines测试，以便如何涵盖这些测试？

这是我的代码覆盖率（由jest提供）：

这是我的测试：

/**
* Testing our ItemList component
*/
import { shallow } from 'enzyme';
import React from 'react';
import { BootstrapProvider } from 'bootstrap-styled';
import ItemList from '../index';

const renderComponent = (props = {}) => shallow(
  <BootstrapProvider>
    <ItemList {...props} />
  </BootstrapProvider>
);

describe('<ItemList />', () => {
  it('should render an <ItemList /> tag', () => {
    const renderedComponent = renderComponent();
    expect(renderedComponent.find('ItemList').length).toBe(1);
  });
});

欢迎任何建议。

Answer 1

首先，您可以看到this.props已突出显示，并且您已在组件中设置了带有className的props className。

您可以测试默认className的存在，并尝试设置一个：

it('should render an <ItemList /> with a className', () => {
    const renderedComponent = renderComponent({
        className:'className-test'
    });
expect(renderedComponent.find('ItemList').hasClass('className-test')).toEqual(true);
});

it('should render an <ItemList /> with a className 'item' by default ', () => {
     const renderedComponent = renderComponent(); 
expect(renderedComponent.find('ItemList').hasClass('item')).toEqual(true);
});

至于渲染，我建议你按照评论中给出的建议。