How to verify a specific image is on the page

CodeceptJS
1

I would like to just verify that an image is on the page but I don’t find a direct command for this. My example HTML is:

ChaskaCC-e1557080938581.jpg764×478 66.5 KB

I tried a couple approaches that all fail:
I.see({ css: “img.et-waypoint et_pb_animation_top et-animated”});
I.seeElement({ css: “img.et-waypoint et_pb_animation_top et-animated”});

I.seeElement({css: “https://yogaananda.life/wp-content/uploads/2019/02/ChaskaCC-e1557080938581.jpg”});

I.seeElement({ css: “[src=‘https://yogaananda.life/wp-content/uploads/2019/02/ChaskaCC-e1557080938581.jpg’]”});

Is there another way to verify an image is on the page?
Thanks

2

Hi, have you seen this visual testing guide of codedeceptjs? Resemble.js and CodeceptJS’s WebDriver helper may be useful for your scenario which is explained in the guide,

3

I did see that, and was afraid that was the only way to verify an image is present. It just seems like overkill because I am not testing what it looks like or even it’s dimensions - just that it is present. But if this is the commonly accepted method then I will use it.

Thanks ufko

4

I agree if you just want to assert that image is present then using visual testing is an overkill. I guess what you want is something like I.seeImage(). I don’t know if there is a way for that :frowning_face:

5

You could try grabbing an attribute of the element holding the picture and then with some regex trim so that you get only the image name and assert that it matches the image name you are expecting?