使用玩笑和酶类测试样式化组件

Question

说我有一个div很少的组件，所以我不能做expect(wrapper.contains(<div></div>)).toBeTruthy()

然后，我必须获取类，例如expect(wrapper.find('myTargetedClass')).toBeTruthy(1)，但这仅适用于css-module，而不适用于 styled-component ，该类是散列的。

Answer 1

您不需要找到确切的className，因为className是hashed。但是您可以检查组件是否具有className。

import { mount } from 'enzyme';
import { enzymeFind } from 'styled-components/test-utils';
const wrapper = mount(<StyledButton />); // StyledButton is your styled-components's component
const renderedComponent = enzymeFind(wrapper, StyledButton);
expect(renderedComponent.prop('className')).toBeDefined();

以上内容将使您知道样式化组件产生的组件是否具有道具className。