How to use #39;toHaveClass#39; to match a substring in Jest?(如何使用#39;toHaveClass#39;匹配Jest中的子字符串?)
问题描述
有一个元素,我要给它一个类success
。但是Reaction-MUI在DOM上附加了一个文本,比如说,类似于mui-AbcXYZ-success
。所以当我这样做的时候
expect( getByTestId('thirdCheck')).toHaveClass("success")
我无法通过此测试,因为它需要完整的名称mui-AbcXYZ-success
。只有当我提供准确的名称(使用连字符文本和Mui添加的随机数字)时,我才能通过此操作
如何测试?
我尝试执行以下操作,但没有结果:
expect( getByTestId('thirdCheck')).toHaveClass(/success/)
我还尝试应用.className
或.classList
,但这没有给我元素上的类列表。
推荐答案
在经历了几个小时的挫折之后,我就是这样做的,如果有人有更好的解决方案,请随时发帖。我会接受的。
let classes = getByTestId('thirdCheck').getAttribute('class'); //returns something like "Mui-root mui-AbcXYZ-success"
classes=classes.split(' ')[1].split('-'); //first split is to split on the basis of spaces and the second one to do on the bases of hyphen
expect(classes.includes('success'));
对于一件琐碎的事情来说,看起来有点冗长。但这就是为什么。
这篇关于如何使用';toHaveClass';匹配Jest中的子字符串?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:如何使用';toHaveClass';匹配Jest中的子
基础教程推荐
- 直接将值设置为滑块 2022-01-01
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- Chart.js 在线性图表上拖动点 2022-01-01
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01
- 自定义 XMLHttpRequest.prototype.open 2022-01-01