# WebUI.verifyImagePresent keyword fails when image on HTML is resized **URL:** \ **Category:** Bug Report\ **Tags:** start-page, bugs-report, katalon-studio\ **Created:** [August 17, 2022, 2:52pm UTC](https://forum.katalon.com/t/webui-verifyimagepresent-keyword-fails-when-image-on-html-is-resized/68690 "2022-08-17T14:52:41Z")\ **Posts on this page:** 4\ **Page:** 1
**Author:** ![kazurayam](https://dub1.discourse-cdn.com/katalon/user_avatar/forum.katalon.com/kazurayam/32/333_2.png) [@kazurayam](https://forum.katalon.com/u/kazurayam)\ **Post date:** [August 17, 2022, 2:52pm UTC](https://forum.katalon.com/t/webui-verifyimagepresent-keyword-fails-when-image-on-html-is-resized/68690/1 "2022-08-17T14:52:41Z")
I have published a GitHub project > **[GitHub - kazurayam/WebUI\_verifyImagePresent\_keyword\_fails\_when\_image\_is\_resized\_on\_HTML](https://github.com/kazurayam/WebUI_verifyImagePresent_keyword_fails_when_image_is_resized_on_HTML)** > > Contribute to kazurayam/WebUI\_verifyImagePresent\_keyword\_fails\_when\_image\_is\_resized\_on\_HTML development by creating an account on GitHub. This project will demonstrate how `WebUI.verifyImagePresent(TestObject)` keyword fails when an image on HTML is resized by CSS property. This keyword will certainly disappoint users who naively expects the keyword work regardless how the image is scaled. ## Reproducing problem ### Target HTML Page This project contains a Google Logo image named `GoogleGLogo-1.png`, which looks like this: ![GoogleGLogo-1](https://europe1.discourse-cdn.com/katalon/original/3X/1/7/17fcfd443324539eeb9e326ebd037485e61f47d9.png) This project provides 2 HTML files. One is named `page_with_image_in_original_width.html` where the Logo is displayed in its original size. It looks like this: ![original](https://europe1.discourse-cdn.com/katalon/original/3X/8/3/83e74874f9d33efb023a4885823b69e8c8f709ff.jpeg) Another HTML is named `page_with_image_resized_quater.html` where the Logo is displayed smaller than its original size, which looks like this: ![quater](https://europe1.discourse-cdn.com/katalon/original/3X/3/2/32191c446c67e121aef4ce9592ebd95f0b5bc0c8.jpeg) Please note that both HTML refer to the same PNG image file but display it in different size. ### Test Case TC1 I have made 2 Test Case scripts. `TC1` opens the `page_with_image_in_original_width.html` and applies `WebUI.verifyImagePresent()` keyword. ```auto import java.nio.file.Path import java.nio.file.Paths import java.time.LocalDateTime import java.time.ZoneOffset import java.time.format.DateTimeFormatter import java.time.temporal.ChronoUnit import com.kms.katalon.core.configuration.RunConfiguration import com.kms.katalon.core.testobject.ConditionType import com.kms.katalon.core.testobject.TestObject import com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUI import static com.kms.katalon.core.testobject.ObjectRepository.findTestObject Path projectDir = Paths.get(RunConfiguration.getProjectDir()) /** * Case where HTML displays the image in its original size */ Path html1 = projectDir.resolve("page_with_image_in_original_width.html") WebUI.openBrowser(html1.toFile().toURI().toURL().toExternalForm()) WebUI.delay(3) WebUI.verifyImagePresent(findTestObject("GoogleLogo")) // this will pass // close the page WebUI.closeBrowser() ``` TC1 will pass. ### Test Case TC2 `TC2` is almost identical to TC1. The only difference is that TC2 opens the `page_with_image_resized_quater.html` page. **TC2 will always fail**. ```auto 2022-08-17 23:09:15.847 DEBUG testcase.TC2_resized - 5: verifyImagePresent(findTestObject("GoogleLogo")) 2022-08-17 23:09:18.729 ERROR c.k.k.core.keyword.internal.KeywordMain - ❌ Image: 'GoogleGLogo-1.png' is NOT present (Root cause: com.kms.katalon.core.exception.StepFailedException: Image: 'GoogleGLogo-1.png' is NOT present at com.kms.katalon.core.webui.keyword.internal.WebUIKeywordMain.stepFailed(WebUIKeywordMain.groovy:64) at com.kms.katalon.core.webui.keyword.builtin.VerifyImagePresentKeyword$_verifyImagePresent_closure1.doCall(VerifyImagePresentKeyword.groovy:92) at com.kms.katalon.core.webui.keyword.builtin.VerifyImagePresentKeyword$_verifyImagePresent_closure1.call(VerifyImagePresentKeyword.groovy) at com.kms.katalon.core.webui.keyword.internal.WebUIKeywordMain.runKeyword(WebUIKeywordMain.groovy:20) at com.kms.katalon.core.webui.keyword.builtin.VerifyImagePresentKeyword.verifyImagePresent(VerifyImagePresentKeyword.groovy:94) at com.kms.katalon.core.webui.keyword.builtin.VerifyImagePresentKeyword.execute(VerifyImagePresentKeyword.groovy:67) at com.kms.katalon.core.keyword.internal.KeywordExecutor.executeKeywordForPlatform(KeywordExecutor.groovy:74) at com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords.verifyImagePresent(WebUiBuiltInKeywords.groovy:2794) at com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords$verifyImagePresent$0.call(Unknown Source) at TC2_resized.run(TC2_resized:23) at com.kms.katalon.core.main.ScriptEngine.run(ScriptEngine.java:194) at com.kms.katalon.core.main.ScriptEngine.runScriptAsRawText(ScriptEngine.java:119) at com.kms.katalon.core.main.TestCaseExecutor.runScript(TestCaseExecutor.java:445) at com.kms.katalon.core.main.TestCaseExecutor.doExecute(TestCaseExecutor.java:436) at com.kms.katalon.core.main.TestCaseExecutor.processExecutionPhase(TestCaseExecutor.java:415) at com.kms.katalon.core.main.TestCaseExecutor.accessMainPhase(TestCaseExecutor.java:407) at com.kms.katalon.core.main.TestCaseExecutor.execute(TestCaseExecutor.java:284) at com.kms.katalon.core.main.TestCaseMain.runTestCase(TestCaseMain.java:142) at com.kms.katalon.core.main.TestCaseMain.runTestCase(TestCaseMain.java:133) at com.kms.katalon.core.main.TestCaseMain$runTestCase$0.call(Unknown Source) at TempTestCase1660745344576.run(TempTestCase1660745344576.groovy:25) ) 2022-08-17 23:09:19.162 ERROR c.k.k.core.keyword.internal.KeywordMain - ❌ Unable to verify image present (Root cause: com.kms.katalon.core.exception.StepFailedException: Unable to verify image present at com.kms.katalon.core.webui.keyword.internal.WebUIKeywordMain.stepFailed(WebUIKeywordMain.groovy:64) at com.kms.katalon.core.webui.keyword.internal.WebUIKeywordMain.runKeyword(WebUIKeywordMain.groovy:26) at com.kms.katalon.core.webui.keyword.builtin.VerifyImagePresentKeyword.verifyImagePresent(VerifyImagePresentKeyword.groovy:94) at com.kms.katalon.core.webui.keyword.builtin.VerifyImagePresentKeyword.execute(VerifyImagePresentKeyword.groovy:67) at com.kms.katalon.core.keyword.internal.KeywordExecutor.executeKeywordForPlatform(KeywordExecutor.groovy:74) at com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords.verifyImagePresent(WebUiBuiltInKeywords.groovy:2794) at com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords$verifyImagePresent$0.call(Unknown Source) at TC2_resized.run(TC2_resized:23) at com.kms.katalon.core.main.ScriptEngine.run(ScriptEngine.java:194) at com.kms.katalon.core.main.ScriptEngine.runScriptAsRawText(ScriptEngine.java:119) at com.kms.katalon.core.main.TestCaseExecutor.runScript(TestCaseExecutor.java:445) at com.kms.katalon.core.main.TestCaseExecutor.doExecute(TestCaseExecutor.java:436) at com.kms.katalon.core.main.TestCaseExecutor.processExecutionPhase(TestCaseExecutor.java:415) at com.kms.katalon.core.main.TestCaseExecutor.accessMainPhase(TestCaseExecutor.java:407) at com.kms.katalon.core.main.TestCaseExecutor.execute(TestCaseExecutor.java:284) at com.kms.katalon.core.main.TestCaseMain.runTestCase(TestCaseMain.java:142) at com.kms.katalon.core.main.TestCaseMain.runTestCase(TestCaseMain.java:133) at com.kms.katalon.core.main.TestCaseMain$runTestCase$0.call(Unknown Source) at TempTestCase1660745344576.run(TempTestCase1660745344576.groovy:25) Caused by: com.kms.katalon.core.exception.StepFailedException: Image: 'GoogleGLogo-1.png' is NOT present at com.kms.katalon.core.webui.keyword.internal.WebUIKeywordMain.stepFailed(WebUIKeywordMain.groovy:64) at com.kms.katalon.core.webui.keyword.builtin.VerifyImagePresentKeyword$_verifyImagePresent_closure1.doCall(VerifyImagePresentKeyword.groovy:92) at com.kms.katalon.core.webui.keyword.builtin.VerifyImagePresentKeyword$_verifyImagePresent_closure1.call(VerifyImagePresentKeyword.groovy) at com.kms.katalon.core.webui.keyword.internal.WebUIKeywordMain.runKeyword(WebUIKeywordMain.groovy:20) ... 17 more ) 2022-08-17 23:09:19.180 ERROR c.k.katalon.core.main.TestCaseExecutor - ❌ Test Cases/TC2_resized FAILED. Reason: com.kms.katalon.core.exception.StepFailedException: Unable to verify image present at com.kms.katalon.core.webui.keyword.internal.WebUIKeywordMain.stepFailed(WebUIKeywordMain.groovy:64) at com.kms.katalon.core.webui.keyword.internal.WebUIKeywordMain.runKeyword(WebUIKeywordMain.groovy:26) at com.kms.katalon.core.webui.keyword.builtin.VerifyImagePresentKeyword.verifyImagePresent(VerifyImagePresentKeyword.groovy:94) at com.kms.katalon.core.webui.keyword.builtin.VerifyImagePresentKeyword.execute(VerifyImagePresentKeyword.groovy:67) at com.kms.katalon.core.keyword.internal.KeywordExecutor.executeKeywordForPlatform(KeywordExecutor.groovy:74) at com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords.verifyImagePresent(WebUiBuiltInKeywords.groovy:2794) at com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords$verifyImagePresent$0.call(Unknown Source) at TC2_resized.run(TC2_resized:23) at com.kms.katalon.core.main.ScriptEngine.run(ScriptEngine.java:194) at com.kms.katalon.core.main.ScriptEngine.runScriptAsRawText(ScriptEngine.java:119) at com.kms.katalon.core.main.TestCaseExecutor.runScript(TestCaseExecutor.java:445) at com.kms.katalon.core.main.TestCaseExecutor.doExecute(TestCaseExecutor.java:436) at com.kms.katalon.core.main.TestCaseExecutor.processExecutionPhase(TestCaseExecutor.java:415) at com.kms.katalon.core.main.TestCaseExecutor.accessMainPhase(TestCaseExecutor.java:407) at com.kms.katalon.core.main.TestCaseExecutor.execute(TestCaseExecutor.java:284) at com.kms.katalon.core.main.TestCaseMain.runTestCase(TestCaseMain.java:142) at com.kms.katalon.core.main.TestCaseMain.runTestCase(TestCaseMain.java:133) at com.kms.katalon.core.main.TestCaseMain$runTestCase$0.call(Unknown Source) at TempTestCase1660745344576.run(TempTestCase1660745344576.groovy:25) Caused by: com.kms.katalon.core.exception.StepFailedException: Image: 'GoogleGLogo-1.png' is NOT present at com.kms.katalon.core.webui.keyword.internal.WebUIKeywordMain.stepFailed(WebUIKeywordMain.groovy:64) at com.kms.katalon.core.webui.keyword.builtin.VerifyImagePresentKeyword$_verifyImagePresent_closure1.doCall(VerifyImagePresentKeyword.groovy:92) at com.kms.katalon.core.webui.keyword.builtin.VerifyImagePresentKeyword$_verifyImagePresent_closure1.call(VerifyImagePresentKeyword.groovy) at com.kms.katalon.core.webui.keyword.internal.WebUIKeywordMain.runKeyword(WebUIKeywordMain.groovy:20) ... 17 more 2022-08-17 23:09:19.195 INFO c.k.katalon.core.main.TestCaseExecutor - END Test Cases/TC2_resized ``` ## Why WebUI.verifyImagePresent fails in TC2? You can read the Groovy source code of `WebUI.verifyImagePresent` keyword [here](https://github.com/katalon-studio/katalon-studio-testing-framework/blob/master/Include/scripts/groovy/com/kms/katalon/core/webui/keyword/builtin/VerifyImagePresentKeyword.groovy). If you read the code, you would find how this keyword works. 1. The keyword requires user to give reference to the original image file. 2. The keyword takes a full page screenshot of the target web page. 3. The keyword looks for the original image to appear somewhere in the screenshot. **No image scaling is taken into account.** Now you should review this design. This design naively assumes that _the original image is rendered “as is” without any resizing in the web page._ If the target HTML specifies image to be resized like ```auto logo ``` then the `WebUI.verifyImagePresent() keyword will always fail to find the image to be present in the page. ## Applicabiliy In almost all of web pages, an images is resized. For example, the avator image of [this page](http://forum.katalon.com/t/webui-verifyimagepresent-keyword-fails-when-image-on-html-is-resized/68690) is resized by the width and height attribute of `` tag: ![avator_is_resized](https://europe1.discourse-cdn.com/katalon/original/3X/d/a/dade7e956f2b89dcf0c5c1988df76c1194bde286.jpeg) The `WebUI.verifyImagePresent` keyword never passes for the avator image in this site. ## Conclusion The `WebUI.verifyImagePresent()` keyword naively assumes an image is not resized by HTML/CSS. But I think that this assumption is not practical. Therefore I would argue that katalon users should not use `WebUI.verifyImagePresent` keyword at all. I haven’t checked it but I guess `Mobile.verifyImagePresent` keyword is similar. You shouldn’t use it as well. ---
**Author:** ![Russ\_Thomas](https://dub1.discourse-cdn.com/katalon/user_avatar/forum.katalon.com/russ_thomas/32/11884_2.png) [@Russ\_Thomas](https://forum.katalon.com/u/Russ_Thomas)\ **Post date:** [August 18, 2022, 11:56am UTC](https://forum.katalon.com/t/webui-verifyimagepresent-keyword-fails-when-image-on-html-is-resized/68690/2 "2022-08-18T11:56:38Z")
`verifyImagePresent()` has even more problems: > [@Verify image present accuracy](http://forum.katalon.com/t/verify-image-present-accuracy/67129/2): > > Thanks, @edward.davies , I wasn’t aware of this problem. @duyluong @nam.nguyen @vu.tran If my understanding is correct, verifyImagePresent() is a (yet another) poorly named API. In all other cases, “verifying presence” is about checking for an element’s presence in the DOM – nothing at all to do with the content of the element. Yet… The documentation for WebUI.verifyImagePresent() requires the tester to provide a source image for comparison purposes, which has nothing at all to do with a… Moving this to bug-reports. ---
**Author:** ![kazurayam](https://dub1.discourse-cdn.com/katalon/user_avatar/forum.katalon.com/kazurayam/32/333_2.png) [@kazurayam](https://forum.katalon.com/u/kazurayam)\ **Post date:** [August 18, 2022, 12:21pm UTC](https://forum.katalon.com/t/webui-verifyimagepresent-keyword-fails-when-image-on-html-is-resized/68690/3 "2022-08-18T12:21:17Z")
@vu.tran I would suggest to Katalon Team that they should **deprecate** [`WebUI.verifyImagePresent()`](https://docs.katalon.com/docs/katalon-studio-enterprise/keywords/web-ui-keywords/webui-verify-image-present) and [`Mobile.verifyImagePresent()`](https://docs.katalon.com/docs/katalon-studio-enterprise/keywords/mobile-keywords/mobile-verify-image-present) keywords. Or just remove them out of the official documentation so that new comers are not trapped. Katalon Team does not have to mind backward compatibility much, as I believe that nobody has ever found the keywords useful / satisfactory; because, I believe, almost all of web pages resize the images. ---
**Author:** ![vu.tran](https://dub1.discourse-cdn.com/katalon/user_avatar/forum.katalon.com/vu.tran/32/20584_2.png) [@vu.tran](https://forum.katalon.com/u/vu.tran)\ **Post date:** [August 19, 2022, 7:49am UTC](https://forum.katalon.com/t/webui-verifyimagepresent-keyword-fails-when-image-on-html-is-resized/68690/4 "2022-08-19T07:49:33Z")
Thank you @kazurayam for sharing. I will let our product team know. I’ll inform you if we update this. Much appreciated!