检查 img src 在 TestCafe 中是否有正确的路径

Question

我使用 TestCafe 进行测试，需要检查 img 是否具有正确的路径。有两个img元素：

案例一：

<div class="x-grid3-cell-inner x-grid3-col-2" unselectable="on" id="dynamicID1">
     <img src="images/icons/bullet_wh.png">
     <img src="images/icons/bullet_re.png" id="dynamicID2">
</div>

本案结果：之前有错误。

案例 2：

<div class="x-grid3-cell-inner x-grid3-col-2" unselectable="on" id="dynamicID3">
     <img src="images/icons/bullet_gr.png">
     <img src="images/icons/bullet_wh.png" id="dynamicID4">
</div>

此案例的结果：bullet_gr.png 在网站上。一切正常！

在我的测试中，我使用.expect(Selector('img[src="images/icons/bullet_gr.png"]')) 来检查bullet_gr.png 在我的网站上是否可见。不幸的是，每次访问的 ID 都不同（它们在用户登录时呈现，并且每次访问都是唯一的）。所以我不能使用.expect(Selector('#dynamicID4'))。

一旦我在测试中使用.expect(Selector('img[src="images/icons/bullet_gr.png"]')) 行，一旦用户登录测试并得到测试成功的输出，它就会立即完成。

检查 bullet_gr.png 是否在网站上链接的解决方案是什么？

Answer 1

要检查元素是否在页面上，请使用exists 属性：

await t.expect(Selector('img[src="images/icons/bullet_gr.png"]')).ok()

或

const img = Selector('img').withAttribute('src', 'images/icons/bullet_gr.png');

await t.expect(img.exists).ok();