我正在尝试将jest
快照测试引入我的应用。
LoginForm 组件
render() {
return (
...
<DynamicSnack
dialogOpen={this.props.dialogOpen}
snackOpen={this.props.snackOpen}
snackTimer={this.props.snackTimer}
snackMessage={this.props.snackMessage}
/>
)
}
DynamicSnack 组件
import Snackbar from 'material-ui/Snackbar';
render() {
let { snackOpen, snackTimer, snackMessage } = this.props
return (
<Snackbar
open={snackOpen}
message={snackMessage}
autoHideDuration={snackTimer}
onRequestClose={this.closeSnack}
/>
)
}
LoginForm.spec.js
import React from 'react'
import renderer from 'react-test-renderer'
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import LoginForm from '../../app/components/loginComponents/loginForm'
describe('LoginForm', () => {
it('should render snapshot', () => {
const component = renderer.create(
<MuiThemeProvider>
<LoginForm />
</MuiThemeProvider>
)
const tree = component.toJSON()
expect(tree).toMatchSnapshot()
})
})
警告:
警告:道具类型失败:道具
message
在Snackbar
标记为必需,但其值为undefined
。
警告:道具类型失败:道具open
在Snackbar
标记为必需,但其值为undefined
。
我尝试直接导入DynamicSnack组件甚至Snackbar并手动添加属性open={false} message={'w00f'}
,但没有任何变化。
我是单位测试的新手,并尝试从学习jest
开始。
我如何摆脱这些警告?
答案 0 :(得分:3)
解决方案非常简单,在测试LoginForm
时,您没有传递Snackbar
所需的道具。将它们作为
const component = renderer.create(
<MuiThemeProvider>
<LoginForm snackOpen={true}
snackMessage={'Wrong info'}/>
</MuiThemeProvider>
)