WEB-UI Recording is not replicating properly

Hi There,

I am learning in Katalon Studio and I am trying to build a project that helps me during new site-setups and it is not working.

If you look at the screenshot-1:


, this is the UI, I have to check boxes here and rename the fields inside the boxes but after I record everything and run it using Katalon Studio, Katalon does all the changes to just fields two fields “id” and “in_consolidate_to_id” (highlighted in yellow in the screenshot). Makes no sense, why Katalon Studio, does not want to make changes to other fields.

Here is the recorded script:

WebUI.setText(findTestObject('Object Repository/Page_Configurator/input_pramata_key_solution_form_primary_det_f92148'), 
    'Product Master Key')

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_pramata_key_solution_form_primary_det_f92148'))

WebUI.setText(findTestObject('Object Repository/Page_Configurator/input_pramata_key_solution_form_primary_det_f92148'), 
    'Product Name')

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_pramata_key_solution_form_primary_det_f92148'))

WebUI.setText(findTestObject('Object Repository/Page_Configurator/input_pramata_key_solution_form_primary_det_f92148'), 
    'Map to Product ID')

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_pramata_key_solution_form_primary_det_f92148'))

WebUI.setText(findTestObject('Object Repository/Page_Configurator/input_pramata_key_solution_form_primary_det_f92148'), 
    'Product Code')

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_pramata_key_solution_form_primary_det_h92148'))

WebUI.setText(findTestObject('Object Repository/Page_Configurator/input_pramata_key_solution_form_primary_det_h92148'), 
    'Requires Site')

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_Product Master Test_commit'))

WebUI.click(findTestObject('Object Repository/Page_Configurator/div_Product Master Test'))

WebUI.click(findTestObject('Object Repository/Page_Configurator/div_Save and Next'))

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_id_solution_form_primary_detailsis_hidden'))

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_id_solution_form_primary_detailsis_hidden'))

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_id_solution_form_primary_detailsis_hidden'))

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_id_solution_form_primary_detailsis_hidden'))

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_in_consolidate_to_id_solution_form_pr_9c76bb'))

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_in_consolidate_to_id_solution_form_pr_2ceef7'))

WebUI.selectOptionByValue(findTestObject('Object Repository/Page_Configurator/select_Please selectpramata_keyproduct_mast_9f8f62'), 
    'product_family', true)

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_id_solution_form_primary_detailsis_hidden'))

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_id_solution_form_primary_detailsis_hidden'))

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_id_solution_form_primary_detailsis_hidden'))

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_id_solution_form_primary_detailsis_hidden'))

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_id_solution_form_primary_detailsis_hidden'))

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_id_solution_form_primary_detailsis_hidden'))

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_id_solution_form_primary_detailsis_hidden'))

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_Product Master Test_commit'))

WebUI.closeBrowser()

PS: It works perfectly when I use the browser extension Katalon recorder though. But I do not know enough yet to import script from Katalon Recorder to Katalon Studio and resolve the Exceptions

You should read the HTML source of the target web page, and read the definitions of locators (XPath expression or CSS selecor) of Test Objects generated by the tool. You can review if a locator is valid against the HTML source. If the locator is failing, think why. When you realized the reason why, you should be able to fix the error manually by editting the locators.

Thank you @kazurayam .

I analyzed it, seems like all the clickable boxes have same ID

So probably Katalon Studio is thinking I am clicking and unclicking the same box.

Because the Code in Katalon Studio looks like this:

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_id_solution_form_primary_detailsis_hidden'))

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_id_solution_form_primary_detailsis_hidden'))

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_id_solution_form_primary_detailsis_hidden'))

Curiously though, the Katalon Recorder (Browser Extension) records the Clicks as following and it works:

selenium.click("id=solution_form_primary_details__is_hidden")
selenium.click("xpath=//div[@id='edit-container']/div/div[3]/form/table/tbody/tr[2]/td[3]/input")
selenium.click("xpath=//div[@id='edit-container']/div/div[3]/form/table/tbody/tr[3]/td[3]/input")

However as Katalon Recorder (Browser Extension) has limitations, so I want to import this to Katalon Studio. I do not know how to go from here

WebUI.click(findTestObject('Object Repository/Page_Configurator/input_id_solution_form_primary_detailsis_hidden'))

This line tells us that you have a Test Object named Page_Configurator/input_id_solution_form_primary_detailsis_hidden. You need to visit the definition GUI of this Test Object, find out its own locator (XPath expression, CSS selectotr). You should check if the locator is valid against the HTML source.

Not curious at all. Katalon Recorder and Katalon Studio are 2 different beasts. These would work differently in detail.

1 Like

I had been trying to do this but I am assuming the steps and reaching nowhere. Can you please guide me how to do it?

Thank you @kazurayam , I am lucky that you saw my post.

So there are many checkboxes that the Katalon Studio needs to fill:

In my code I am just capturing for box 1-3 and then 9 directly, so that I can figure out the issue first then carry on with coding for other boxes

I checked and I think I got the issue. For first 3 box clicks only one object is getting created and for box no 9 a different one. There are just two Objects getting created for all the Clicks:

When I check the “properties” line 9, 10, 11 (First 3 boxes) I am seeing the following:

and for Box number 9 this:

However, when I check the XPATH for first 3 boxes, I find that the it is same for all of them and the “Tr” value is probably missing, which is there for Box 9:

The below is same for all 3 boxes:

I think probably I need to create 3 separate Objects for first 3 boxes (Line 9,10,11 in code in Manual view screenshot)

most probably with appropriate “Tr” values and then join it to line 9, 10, 11. How do I proceed with this?

I am getting this error when I am editing XPATH directly and saving it:

image

I am not surprised to hear that you are struggling with the Test Objects generated by WEB-UI Recoding tool.

The tool does help you getting started with test automation, but the tool sometimes generates Test Objects that do not work. This does not necessarily mean the tool is buggy. The Test Objects were generated correctly just as you accidentally operated. I suppose, you operated (click somewhere on the display at certain timing) in a way that let the tool generate the Test Objects which you unfortunately find unsatisfactory.

Users are supposed to be tolerant. Users should be prepared to improve the tool’s products manually.

I don’t know. I would say, as for Test Objects are concerned, it is only you who can help yourself.

Please note that I have no access to your target web application, I do not have your project in my hand, therefore I can not see the enough detail. Without the system in action in hand, it is impossible for other people to find an appropriate locator (XPath expression or CSS Selector).

Why not you continue struggling on this for a few more days? Experienced Katalon users have experienced such difficulties. Possibly you should have breaks and good sleeps sometime.

Yeah, it is a bit of a struggle, but I won’t lie, I had lot of fun, collaborating with you and trying to find the root cause :smile: and now that I know what is wrong, it is going to play in the back of my mind 24/7. Probably I will dig deeper using Google and Youtube but my work is going to suffer lol. Is there a way I can easily import Katalon Recorder’s (Browser Extension) script in Katalon Studio? Because that is working perfectly. You should rest too, I probably bugged you a lot today. Thank you so much from the bottom of my heart for the mentoring.

I don’t know Katalon Recorder at all.

@ThanhTo

Any input from you?

Hi @kazurayam ,

All thanks to you, I was able to fix it :smiley:

  • Removed the tag error
  • Created multiple objects by copying and pasting
  • Edited the objects and added the Tr values for each boxes
  • Linked the new objects to their respective “items” in Manual view
  • Went to Script and renamed the object names

Maybe I just needed some sleep as you said and it worked like a charm!

But I think this is a bug, because before doing this fix I tried to recapture the clicks using other browsers as well and somehow it is putting all new clicks under the same object without any Tr values. At the moment, my project doesn’t have too many boxes but I cannot imagine myself clicking and then creating 1000s of objects and then linking them manually. There must be some smart way of doing this.

i wouldnt use the Recording tool at all. This way i am free from it’s problems.

I wish I can do that too

It is just terrible to create 1000s of Test Objects in the “Object Repository” using the Recorder tool. That will certainly bring you into the hell of maintenance.

The following post tells you what will happen if you use the Recorder tool to create a mass of Test Objects in the Object Repository folder; les miserables

Sometime in future you may be appointed to develop a test suite that looks at 1000s HTML elements. If so, I would suggest to you; you shouldn’t use the Recorder tool. You need to be more skilled.

Certainly there are some smarter ways.

  1. Don’t use the Recorder tool. Don’t create Test Objects in the “Objectect Repository” folder. You can create instances of TestObjects in test case scripts inline. Inline scripts are far easier to maintein.:
TestObject tObj1 = makeTestObject("//input[@id='make_appintment']")
TestObject tObj2 = makeTestObject(...whatever xpath expression you like)
TestObject tObj3 = makeTestObject(...whatever xpath expression you like)
...
TestObject makeTestObject(String xpath) {
	TestObject tObj = new TestObject(xpath)
	tObj.addProperty("xpath", ConditionType.EQUALS, xpath)
	return tObj
}
  1. Apply the design pattern “Page Object Model”. Page Object Model is the best strategy to minimize the maintenance efforts of tests required to keep them in sync with the ever-chainging web pages as target.

I would show you my example that I applied the Page Object Model:

I found that Katalon Studio does not fit the “Page Object Model” well. If I really want to use “Page Object Model”, I would not use Katalon Studio. It is easier to develop a “Page Object Model” based test project in IDEs (IntelliJ IDEA, Eclipse,…) + Selenium WebDriver + Gradle.

Wow! You have actually helped me 10 years in advance, I can see myself making this mistake in future with 15K+ objects. :laughing: I was making individual objects for each clicks thinking it will be easier this way to debug in future and was worried about how to take backups of all the objects.

Thank you @kazurayam , I am going to try this now this weekend and hopefully all my Tests pass :pray: