有一个元素,我要给它一个类 success
。但是 React-Mui 在 DoM 上附加了一个文本,比如 mui-AbcXYZ-success
。所以当我这样做的时候
expect( getByTestId('thirdCheck')).toHaveClass("成功")
我没有通过此测试,因为它需要完整名称 mui-AbcXYZ-success
。只有当我提供确切的名称(wirh 带连字符的文本和 mui 添加的随机数)时,我才会通过它
我如何测试它?
我尝试执行以下操作但没有结果:
期望(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'));
对于一个琐碎的事情来说,看起来有点冗长。但事实就是如此。
更新:
@Fyodor 在评论中有一个很好的观点。 我们可以简单地这样做:
expect(getByTestId('thirdCheck').getAttribute('class')).toMatch(/success/gi)
关于javascript - 如何使用 'toHaveClass' 来匹配 Jest 中的子字符串?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/67684398/