SET TEXT returns empty value, but the step is marked as PASSED

Product Forums Katalon Studio
,
1

Hey, everybody. I am new to XPath and have read many guides to solve my problem. But I really don’t understand why Katalon Studio can’t insert text into the body of my iFrame.

The iFrame works fine and I have already done these tests, but with Self Healing. It doesn’t work without it, and the selector it recommends shows itself working, but it doesn’t do the set text task.

Here is a snippet of the page code, and what the inserted text looks like.

<body contenteditable="true" class="cke_editable cke_editable_themed cke_contents_ltr" spellcheck="false"><p>hey</p><p>how are you</p></body>

I use XPath //body as advised by Self-healing and in Self-healing’s case it works. But when I use this path directly, without Self-healing, I get just an empty text box, and the console says that the text is inserted and the step is passed. But there is no text and all other steps continue after that.

I also tried //body[@class=‘cke_editable cke_editable_themed cke_contents_ltr’] and css=body, but I still get an empty field instead of text and the step is marked passed.

When I tried checking the selector via Spy Web, I noticed that it wants to replace the text instead of “class” but not instead of

. And yes, the

here is created automatically when text with paragraphs is inserted. But when I try to even specify

in the XPath after , I also get the

value replaced, but not the insertion of the text itself into the field.

Without text, the code fragment looks like this:

<body contenteditable="true" class="cke_editable cke_editable_themed cke_contents_ltr" spellcheck="false"><p><br></p></body>

With text it should look like this:

<body contenteditable="true" class="cke_editable cke_editable_themed cke_editable_themed cke_contents_ltr" spellcheck="false"><p>How are you today?</p></body>

WebUI.setText(findTestObject(‘Page_Dream Singles/Element_1693377254031’), ‘How are you today?’)

After a week of agony, please help me insert text into this field! :slight_smile:

image
image939×230 6.54 KB

image
image1075×196 10 KB

3 Likes
2

Handling iFrame issue with Katalon Studio | Katalon Docs

What happens when you try?

iframe_whatever = com.Tools.newTestObject('//iframe[@class="cke_wysiwyg_fram cke_reset"]')
WebUI.switchToFrame(iframe_whatever, 10)

Element_1693377254031 = com.Tools.newTestObject('//body[@class="cke_editable cke_editable_themed cke_editable_themed cke_contents_ltr"]')
WebUI.setText(Element_1693377254031, "How are you today?")

/**
* Helper function that creates a new TestObject with xpath
*
* @param pathway to the element
* @return this test object led to by the pathway
*/
def TestObject newTestObject(String xpath) {
	TestObject to = new TestObject(xpath)
	to.addProperty('xpath', ConditionType.EQUALS, xpath)
	return to
}
2 Likes
3

Maybe I am doing something wrong?

image
image1378×223 11.8 KB

image
image1056×309 16.8 KB

2 Likes
4
  1. After you navigate to your URL, you should wait until the page is loaded, like:
WebUI.navigateToUrl(...)
WebUI.waitForPageLoad(10)
  1. You also need the appropriate “import” statements, like below (or you can use the 3 key combo, CTRL + SHIFT + O [oh]). The 3 key combo will add any missing import statements and remove any that are not needed.
import com.kms.katalon.core.testobject.ConditionType
import com.kms.katalon.core.testobject.TestObject
  1. If you have the “newTestObject” method right in your Test Case, you do not need the pathway to the method. Instead, you can use:
iframe_whatever = newTestObject('//iframe[@class="cke_wysiwyg_frame cke_reset"]')
WebUI.switchToFrame(iframe_whatever, 10)

Element_1693377254031 = newTestObject('//body[@class="cke_editable cke_editable_themed cke_editable_themed cke_contents_ltr"]')
WebUI.setText(Element_1693377254031, "How are you today?")
2 Likes
5

In my test example it looks pretty simple, no scripting ) I just need to insert text into this visual editor field somehow ))

Using your method I still get this error in the console.

By the way, I just tried your XPath examples through SpyWeb, it didn’t find such a frame. I used CSS ‘.cke_wysiwyg_frame’ before and it seemed to work.

With the test object you suggest, I couldn’t find it in SpyWeb, but it’s more like you made a typo and it should be like this ‘body[@class=“cke_editable cke_editable_themed cke_contents_ltr”]’

But still my problem remains unsolved :disappointed_relieved:

image
image872×559 31.9 KB

image
image1141×221 11.3 KB

2 Likes
6

You didn’t change your script like I suggested in #3 in my post above. You have also misspelled the class for the <iframe>; there should be an “e” at the end of ‘frame’. You can double click on the text within the HTML and copy and paste it into your script.

2 Likes
7

This script from item #3 should be here because I haven’t used it before and without it I get the “No signature of method” error.

Now I copied the correct class from the html of my page and it came out like this. But there is another error here.

Unable to find the element located by ‘By.xpath: iframe[@class=“cke_wysiwyg_frame cke_reset”]’. Please recheck the objects properties to make sure the desired element is located. :x: Unable to verify image ‘iframe[@class=“cke_wysiwyg_frame cke_reset”]’ present Unable to verify image ‘iframe[@class=“cke_wysiwyg_frame cke_reset”]’ present Unable to verify image ‘iframe[@class=“cke_wysiwyg_frame cke_reset”]’ present

By this method it looks like it doesn’t see the frame.

image
image823×274 15.1 KB

image
image1393×242 14.1 KB

2 Likes
8

I believe you should have just added the path // to your lines.

image
image761×292 9.64 KB

In this case, I get all the steps completed.

image
image1019×143 5 KB

But then we’re back where we started. The text is not inserted in the text editor… :cry:

image
image1204×779 21.5 KB

Maybe some special nested Xpath is needed here?

image
image1149×189 13 KB

Object Spy when clicking on Verify and Highlight this attribute shows me this element correctly. But it looks like it just doesn’t see the text input field.

1 Like
9

Maybe @kazurayam or @Russ_Thomas as XPath experts can help me?

1 Like
10

I read only the original post#1. I haven’t read the following post #2 and others because the post #1 was so problematic.

@prosmartfony

You are far, far away.

1 You can not change the content text of <p> element using WebUI.setText keyword

You are trying to change a given DOM node like

<body><p><br></p></body>

to something like

<body><p>How are you today?</p></body>

using WebUI.setText(...), right? You completely misunderstood what this keyword does. Read the doc again:

Set the value of an <input> field, as though you type it in. It also clears the previous value of the <input> field.

You can not change the content text of <p> element using WebUI.setText keyword.

You think that XPath is the only issue that blocks you … that’s not right. It seems that you don’t understand more fundamental stuff about HTML, DOM, WebDriver.

2 You should NEVER use Self Healing of Katalon Studio

In my humble opinion, the Self Healing is a sin of Katalon team. Self Healing is a terrible mistake. They should not have built it in the product. Self Healing hides your mistakes and let you stay unaware of your faults. It disturbs your pathway of learning XPath and/or CSS Selector.

I do not like to give any advice to those who love Self Healing. Trying to help them is a waste of my time and efforts. I would rather leave them wandering forever in the jail of Self Healing.

3. Learn the basics from good tutorials.

If you think you need, you should study XPath and CSS Selectors from good resources such as O’Reilly books. Katalon tools and docs are not good learning resources. If you want to find any free web resources for XPath, find this

1 Like
11

I am not an XPATH expert. I never use anything that’s completely unnecessary.

1 Like
12

@prosmartfony I completely concur with everything @kazurayam said.

To change the text inside any element (in your case, a <p> element:

String js='document.querySelector(element-css-selector).innerText = "my text";'
WebUI.executeJavaScript(js, null)

If the text includes HTML…

String js='document.querySelector(element-css-selector).innerHTML = "my<br>text";'
WebUI.executeJavaScript(js, null)

For an iframe, you should change it to:

js = 'document.querySelector(iframe-css-selector).contentWindow.document.querySelector(element-css-selector).innerText = "my text";'
1 Like
13

@Russ_Thomas

I expected that you would advise @prosmartfony to have a look at the following advice of yours:

But, at the same time, I thought you might be tempted to demonstrate js solutions. … You did it above. :slightly_smiling_face:

1 Like
14

No. When an element has the contenteditable attribute it is akin to any other input element. It’s not very common, but it does happen.

I don’t think they can be submitted, though. i.e. they’re not part of any <form> hierarchy.

1 Like
15

Just use WebUI.waitForElementPresent(findTestObject(’ '), 30) on where you are getting returns empty value, instead of WebUI.waitForPageLoad(10)
And also put one line of click code before WebUi.setText()

1 Like
16

Sorry for the silly question, but how do I wrap this properly? I don’t understand anything about .js and I thought I would find a simple solution in Katalon for the only test case I need :frowning:

js = 'document.querySelector(.cke_wysiwyg_frame).contentWindow.document.querySelector(body).innerText = "hello, how are you?";'

I googled a bit, tried different options to specify a css selector, but fail miserably.

In one of the topics it was said that it is necessary to import two lines:

import org.openqa.selenium.JavascriptExecutor as JavascriptExecutor
import com.kms.katalon.core.webui.driver.DriverFactory as DriverFactory

But still I fail…

1 Like
17

You’re missing some quotes:

String js = 'document.querySelector(".cke_wysiwyg_frame").contentWindow.document.querySelector("body").innerText = "hello, how are you?";'
WebUI.executeJavaScript(js, null)

Imports: You don’t need anything more than WebUI which you should already have.

1 Like
18

I am now getting the following message in the console. Maybe because I selected a false CSS selector value? It’s weird though, the other selector isn’t there (by right-clicking in the browser console) and Object Spy also shows that it is…

:x: Unable to execute JavaScript. TypeError: document.querySelector(…) is null

1 Like
19

Copy it into the console in the browser. Let me know what it says (screenshot if possible).

1 Like
20

Sorry for Ukrainian, I switched language to English but it still here :thinking:

image
image1917×890 50.3 KB

Wow, looks it works! So why do Katalon give me an error: document.querySelector(…) is null?

1 Like