我正在尝试使用React Router v4和Jest Enzyme进行简单的测试。
describe('<App />', () => {
it('renders a static text', () => {
const wrapper = shallow(
<MemoryRouter initialEntries={['/']} initialIndex={0}>
<App/>
</MemoryRouter>
console.log(wrapper.html());
);
});
});
当我尝试console.log(wrapper.html())时,会得到以下结果:
Invariant Violation: [React Intl] Could not find required `intl` object. <IntlProvider> needs to exist in the component ancestry.
我正在使用 react-boiler-plate 项目。我只想测试当我给它'/'路径时,主页能否呈现一些文本。
任何帮助都会受到感激!谢谢!
编辑:
这是测试:
it('test', () => {
const wrapper = shallow(
<MemoryRouter initialEntries={['/']} initialIndex={0}>
<Route path="/" render={() => <App/>}/>
</MemoryRouter>,
);
console.log(wrapper.find(App).html());
});
这是App类:
export default function App() {
return (
<AppWrapper>
<Helmet
titleTemplate="%s - React.js Boilerplate"
defaultTitle="React.js Boilerplate"
>
<meta name="description" content="A React.js Boilerplate application"/>
</Helmet>
<Header/>
<Switch>
<Route exact path="/" component={HomePage}/>
<Route path="/features" component={FeaturePage}/>
<Route
path="/catalog"
render={() => <div>hi</div>}
/>
<Route path="" component={NotFoundPage}/>
</Switch>
<Footer/>
</AppWrapper>
);
}
运行测试时出现的错误信息:
**Error: Method “html” is only meant to be run on a single node. 0 found instead.**
我希望这个页面可以匹配,我能够使用console.log输出结果:
<Route exact path="/" component={HomePage}/>
mount
而不是shallow
作为渲染方法?我认为shallow
应该只用于非常简单的测试,而包含路由的测试并不简单。 - Andrew Miroshnichenkointl
对象”的错误消息。 <IntlProvider>需要存在于组件祖先中。不太确定问题是什么,希望有人可以克隆该项目并尝试运行此测试,如果他们有多余的时间... - johnwick0831