npx create-react-app react-test
cd react-test
yarn start
yarn add -D Jest
npx jest --init
yarn add --dev react-test-renderer
import React, { useState } from 'react'
const STATUS = {
hovered: 'hovered',
normal: 'normal'
}
const Link = ({page, children})=>{
const [status, setStatus] = useState(STATUS.normal)
const onMouseEnter = ()=>{
setStatus(STATUS.hovered)
}
const onMouseLeave = ()=>{
setStatus(STATUS.normal)
}
return (
<a
className={status}
href={page || '#'}
onMouseEnter={onMouseEnter}
onMouseLeave={onMouseLeave}
>
{children}
</a>
)
}
export default Link
import React from 'react'
import renderer from 'react-test-renderer'
import Link from '../components/Counter'
test('Link changes the class when hovered', ()=>{
const component = renderer.create(
<Link page='http://www.baidu.com'>百度</Link>
)
let tree = component.toJSON()
expect(tree).toMatchSnapshot()
tree.props.onMouseLeave()
tree = component.toJSON()
expect(tree).toMatchSnapshot()
})
欢迎光临 51Testing软件测试论坛 (http://bbs.51testing.com/) | Powered by Discuz! X3.2 |