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

Product Forums Katalon Studio
,
21

Of course it works. You don’t trust me? :nerd_face:

Timing. Make sure you wait until the iframe is present. Add another second or two then you should be good.

1 Like
22

Oh, my God, it’s working. I wish I could go out during curfew to buy champagne now, but I would if I could!

Thank you Thomas, you’ve been a great help! You are a wizard, you do good deeds for newbies like me :joy:

And for people like me, I advise you to switch off Self-healing permanently.

image

Because if it fails at one point, you’ll spend weeks trying to figure out the problem and by then you’ll probably have forgotten what tools you were using and on top of that, the Self-healing prompts will lead you down the wrong path, which will take you even longer to figure out the problem.

Thank you so much again, Thomas and all those who were so willing to help me!

2 Likes
23

Thank you. I did not know “contenteditable” at all. Now I learned it.

Let me post what I have done to learn.

I made a burningworld.html file in the project directory:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>title</title>
        <!-- <link rel="stylesheet" href="style.css"> -->
    </head>
    <body>
        <header>
            Header
        </header>
        <main>
            <p style="font-size: 64px">Hello, <span id="greet-to" contenteditable="true"> world </span>!</p>
        </main>
        <footer>
            Footer
        </footer>
    </body>
</html>

I made a Test Case:

import java.nio.file.Path
import java.nio.file.Paths

import com.kms.katalon.core.configuration.RunConfiguration
import com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUI

WebUI.openBrowser('')
WebUI.setViewPortSize(800, 800)
Path projectPath = Paths.get(RunConfiguration.getProjectDir())
Path html = projectPath.resolve("contenteditable.html")
WebUI.navigateToUrl(html.toFile().toURI().toURL().toExternalForm())
WebUI.delay(1)
WebUI.takeScreenshot("shot1.png")

String js = '''
document.querySelector('#greet-to').innerHTML = 'burning world'
'''
WebUI.executeJavaScript(js, null)

WebUI.takeScreenshot("shot2.png")
WebUI.delay(3)
WebUI.closeBrowser()

When I ran this script, it passed. I got 2 PNG files:

Before editting content:

shot1
shot11600×1340 31.7 KB

After editting content:

shot2
shot21600×1340 41.3 KB

I could edit a <span contenteditable="true"> node using JavaScript.

A finding. I changed the HTML so that the target <span> element has no contenteditable attribute.

            <p style="font-size: 64px">Hello, 
                <span id="greet-to"> world </span>!</p>

When I ran the script, it passed. It produced just the same screenshots. This proves that JavaScript can modify the DOM regardless the span element has the contenteditable attribute or not. I am not surprised with this. It worked this way for decades ever since JavaScript was originated early 1990.

1 Like
24

Our discussion above proved that using JavaScript is one way to edit an HTML node with the attribute contenteditable="true".

Is the JavaScript the only way to achieve it?

I don’t think so. I found a post:

This Stackoverflow post is discussing that you can edit an HTML node with contenteditable="true" using ordinary WebUI.click, WebUI.clear and WebUI.sendKeys keywords. I’m not going to dig this any further. Anyone who is interested, please study and report the result back here, please.

2 Likes
25

Thank you!

1 Like
26

To be clear…

There is NO connection between…

  1. The fact that a given element has the contenteditable attribute, and…

  2. Using innerText = "stuff and things" in JavaScript.

The ONLY reason it was brought into the discussion was the point made by @kazurayam, that I would under normal circumstances tell @prosmartfony NOT to modify the AUT because that’s a BAD THING to do. However, given the presence of contenteditable, it’s completely OK.

Hope that’s a bit clearer.

3 Likes