如何在 React-Native 项目中使用 Jest 测试样式组件？

Question

在我的项目中，我有一个样式为 styled-components.I 的组件，想使用 jest 对其进行测试：

describe('<Button/> tests', () => {
    it('should render button', () => {
        const testingComponent =  renderer.create(<Button/>);
    })
});

此代码失败：

 ● Test suite failed to run

    TypeError: _styledComponents.default.View is not a function

      1 | import styled from 'styled-components';
      2 |
    > 3 | const Container = styled.View`
        |                          ^
      4 |   flex: 1;
      5 |   align-self: center;
      6 | `;

SO jest 无法识别 styled.View，我也不知道为什么。我做错了什么以及如何测试我使用 styled-components 设置样式的组件？

Answer 1

为了避免此类错误，需要以这种方式指定样式组件：

const Container = styled(View)

这个语法对我有帮助

如何在 React-Native 项目中使用 Jest 测试样式组件？

How to test styled-components with Jest in React-Native project?

jestjs

react-native

styled-components