Question

我创建了一个高阶组件/组成组件，以确保在加载组件之前对用户进行身份验证。这是非常基础的，但是我在测试时遇到了一些麻烦。我要测试以下几点，这些要点与我已经在其他地方进行的测试类似：

有正确的道具如果经过身份验证，则渲染包装的Component；否则，则渲染错误消息

HOC：

const Authorization = (WrappedComponent, allowedRoles) => {
    return class WithAuthorization extends React.Component {
        static propTypes = {
            user: PropTypes.array
        };

        constructor(props) {
            super(props);
        }

        render() {
            const {user} = this.props;
            const intersec = intersection(user, allowedRoles);
            console.log("props: ", <WrappedComponent/>)
            if (intersec.length > 0) {
                return <WrappedComponent {...this.props} />;
            } else {
                return <UserMessage className="alert" messageText={NOT_AUTHORIZED} messageType={SERVICE_ERR} />;
            }
        }
    };
};

export default Authorization;

我尝试过这样测试：

describe('Tests user based authorization in BAT 2.0', () => {
    it('should render the component only when a "user" is a part of "allowedRoles"', () => {
        const Authorization = WithAuthorization(CreateTemplateFlow);
        const wrapper = mount(
            <Router>
                <Authorization user={true} />
            </Router>
        );
        const returnValue = <CreateTemplateFlow />;

        console.log('WOOOOW: ', wrapper);
        expect(wrapper).to.eql(returnValue);
    });
    ```


I'm using enzyme, mocha, and chai for my tests, but haven't found a way of rendering the HOC successfully during my tests.

Any ideas?

酶，摩卡咖啡和Chai测试身份验证高阶组件（HOC）

0 个答案: