我有一个上下文提供程序,我想测试它通过上下文为其子项提供一些值(让我们说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');
});