Überprüfen, ob img src den richtigen Pfad in TestCafe hat

Question

Ich führe einen Test mit TestCafe und muss überprüfen, ob ein IMG den richtigen Pfad hat. Es gibt zwei img Elemente:

Fall 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> 

Ergebnis dieses Falles: es war, bevor ein Fehler auf.

Fall 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> 

Ergebnis dieses Falles: bullet_gr.png ist auf der Website. Alles ist in Ordnung! In meinem Test verwende ich .expect(Selector('img[src="images/icons/bullet_gr.png"]')) um zu überprüfen, ob der bullet_gr.png auf meiner Website sichtbar ist. Leider unterscheiden sich die IDs bei jedem Besuch (sie werden gerendert, wenn sich der Benutzer anmeldet und sind bei jedem Besuch einzigartig). Also kann ich .expect(Selector('#dynamicID4')) nicht verwenden.

Sobald ich die .expect(Selector('img[src="images/icons/bullet_gr.png"]')) Zeile in meinem Test verwende, wird sofort beendet, sobald der Benutzer mit dem Test angemeldet ist, und ich bekomme die Ausgabe, dass der Test erfolgreich war.

Was wäre die Lösung zu überprüfen, ob der bullet_gr.png auf der Website verlinkt ist?

Answer 1

Um zu überprüfen, ob das Element auf der Seite ist, verwenden Sie die exists Eigenschaft:

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

oder

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

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