酶 - 如何测试孩子接受背景

时间:2018-04-25 17:30:54

标签: reactjs enzyme

我有一个上下文提供程序,我想测试它通过上下文为其子项提供一些值(让我们说foo)。我怎么能用酶做这个?这甚至可能吗?

<MyContextProvider>
    <Child />  // how do I test that foo is available in the Child component's context?
</MyContextProvider>

更新:我想测试一下,因为我将一个道具传递给我的上下文提供程序,然后将其作为上下文对象的一部分提供。

const store = configureStore()({ locale: 'es' });
const wrapper = mount(
    <ConnectedIntlProvider store={store}>
        <Child />
    </ConnectedIntlProvider>
);

我想测试ConnectedIntlProvider从商店获取locale,然后将其作为intl对象的一部分通过上下文传递给其子代。

更新2: 我设法在不使用酶的情况下编写测试。虽然看起来有点奇怪,但我想知道使用Enzyme是否有更简单的方法来获得相同的结果。

it('uses locale from store', () => {
    class Child extends React.Component {
        render() {
            return <div />;
        }
    }

    Child.contextTypes = {
        intl: intlShape,
    };

    const store = configureStore()({ locale: 'es' });
    const div = document.createElement('div');
    let child;
    ReactDOM.render(
        <ConnectedIntlProvider store={store}>
            <Child
                ref={(c) => {
                    child = c;
                }}
            />
        </ConnectedIntlProvider>,
        div
    );
    const locale = child && child.context && child.context.intl && child.context.intl.locale;
    ReactDOM.unmountComponentAtNode(div);
    expect(locale).toEqual('es');
});

0 个答案:

没有答案