测试 Icon 组件的 onClick 事件是否执行应该怎么写？

来源：7-1 图标解决方案简介

寂寞追不上我

2020-09-04

蟀七的老师，用testing library 怎么获取到svg并判断透传到svg上的事件触发了呢？
图片描述

图片描述
// use enzyme and jest
const fn = jest.fn()
const icon = mount( )
icon.find(‘svg’).simulate(‘click’)
expect(fn).toBeCalled()

写回答

1回答

张轩

2020-09-06

帅哥你好

我在本地试了下，如下代码可以运行的，不知道你的是哪里有问题？

it('test svg', () => {
    const fn = jest.fn()
    const wrapper = render(<IconBack name="cool" onClick={fn}/>)
    const element = wrapper.container.querySelector('svg') as SVGSVGElement
    fireEvent.click(element)
    expect(fn).toHaveBeenCalled()
})

寂寞追不上我

好的，谢谢老师，enzyme用多了，刚换成test Lib有点不适应。小弟个人感觉Lib好用点，测试代码更直接更纯粹。

2020-09-07

共1条回复

React18+TS高仿AntD从零到一打造组件库

设计，开发，测试，发布再到 CI/CD，从0到1造轮子

2122 学习 · 959 问题

查看课程

相似问题

before render为什么执行了两遍

回答 2

当自定义hook引入到app.js的时候，比如mousehook，当鼠标移动改变x,y的值的时候，app组件里面的console.log会一直执行