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

Question

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

案例1：这种情况下

<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是在网站上。 Everthing是可以的！

在我的测试中，我使用.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();