Question

A＆＃34;哑巴＆＃34; React视图可以通过在使用enzyme / jsdom呈现它之前传递道具来进行测试。然后可以使用快照测试来验证行为（如jest）。

由“哑视图”组成的智能组件。与mapStateToProps / mapDispatchToProps相关联的内容可以通过以下方式进行测试：

单元测试mapXxxToProps以检查逻辑是否正确
测试dumb视图

和optionnaly：

通过将智能组件包装在提供程序

然而，只要一个愚蠢的视图开始嵌套其他智能容器，这似乎就会破裂;简单地使用道具不可能渲染哑视图，因为链中的某些子组件可能需要存储。

有办法吗？

我错过了什么吗？

Answer 1

使用酶，您可以使用shallow render来测试哑组件是否呈现预期的智能组件，而不是实际完全呈现它们。

组件（Bar是智能组件）：

const Foo = () => {
    return (
        <div>
            <Bar />
        </div>
    )
}

测试：

import { shallow } from 'enzyme';

...

it('should render <Foo /> component', () => {
    const wrapper = shallow(<Foo />)
    expect(wrapper.contains(<Bar />)).to.be.true
})

如何测试渲染智能组件的redux哑组件？

1 个答案: