Different boolean results for same scenario - selenium java

Question

I'm trying to verify whether profile image is present after uploading an image. Image uploads successfully. I have try to verify image with two different ways.

profileImage= driver.findElement(By.xpath("//img[@class='rounded-circle']"));
Boolean imagePresent = (Boolean) ((JavascriptExecutor)driver).executeScript("return arguments[0].complete && typeof arguments[0].naturalWidth != \"undefined\" && arguments[0].naturalWidth > 0", profileImage);

This returns false even though there is an image uploaded.

Boolean imagePresent = profileImage.isDisplayed();

This returns True.

Please can someone explain why I get two results. which one is correct to use?

Answer 1

You're asking for two different things.

Your javascript is asking whether image loading is complete, the image has a naturalWidth property that is not "undefined" and the image has a naturalWidth > 0. If any one of these conditions fail, the javascript will evaluate to false. This also means if the property you are querying isn't present on the image object, the javascript will evaluate to false.

By comparison, the selenium call to isDisplayed() is asking if the image is displayed and nothing more.

If the image is actually present and showing on the screen, then since the call to imagePresent = profileImage.isDisplayed() is returning correct results, I wouldn't bother with the more complex call.