Unable to find Element on the tspan

[hannah.martin]

After a rerun of test scripts, the element on the tspan reflects unable to find the element. I’ve tried to change the attributes and limit it only into XPath but it was also unable to find the element.
I am trying to verify the text inside this half pie graph,

While the locators is I have is Xpath:
//*[@id=“temp_humid”]/svg/text[2]/tspan
Here’s my object screencap:

While heres the error reflected:
=============== ROOT CAUSE =====================

For trouble shooting, please visit: https://docs.katalon.com/katalon-studio/docs/troubleshooting.html

05-15-2022 06:07:00 PM verifyElementText(findTestObject(“Admin/WP-0040 Container Information Sensors Relative Humidity on Sensor information module/Page_Container Information/tspan_98.0”), WP040RelativeHumidity)

Elapsed time: 33.187s

com.kms.katalon.core.webui.exception.WebElementNotFoundException: Web element with id: ‘Object Repository/Admin/WP-0040 Container Information Sensors Relative Humidity on Sensor information module/Page_Container Information/tspan_98.0’ located by ‘id(“temp_humid”)/svg[1]/text[2]/tspan[1]’ not found (Root cause: com.kms.katalon.core.exception.StepFailedException: com.kms.katalon.core.webui.exception.WebElementNotFoundException: Web element with id: ‘Object Repository/Admin/WP-0040 Container Information Sensors Relative Humidity on Sensor information module/Page_Container Information/tspan_98.0’ located by ‘id(“temp_humid”)/svg[1]/text[2]/tspan[1]’ not found
at com.kms.katalon.core.webui.keyword.internal.WebUIKeywordMain.stepFailed(WebUIKeywordMain.groovy:64)
at com.kms.katalon.core.webui.keyword.builtin.VerifyElementTextKeyword$_verifyElementText_closure1.doCall(VerifyElementTextKeyword.groovy:64)
at com.kms.katalon.core.webui.keyword.builtin.VerifyElementTextKeyword$_verifyElementText_closure1.call(VerifyElementTextKeyword.groovy)
at com.kms.katalon.core.webui.keyword.internal.WebUIKeywordMain.runKeyword(WebUIKeywordMain.groovy:20)
at com.kms.katalon.core.webui.keyword.builtin.VerifyElementTextKeyword.verifyElementText(VerifyElementTextKeyword.groovy:72)
at com.kms.katalon.core.webui.keyword.builtin.VerifyElementTextKeyword.execute(VerifyElementTextKeyword.groovy:40)
at com.kms.katalon.core.keyword.internal.KeywordExecutor.executeKeywordForPlatform(KeywordExecutor.groovy:74)
at com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords.verifyElementText(WebUiBuiltInKeywords.groovy:4749)
at com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords$verifyElementText$4.call(Unknown Source)
at WP-0040 Container Information Sensors Relative Humidity on Sensor information module.run(WP-0040 Container Information Sensors Relative Humidity on Sensor information module:56)
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 TempTestCase1652609162745.run(TempTestCase1652609162745.groovy:25)
)

Is there anyone familiar with this issue? All of my pie graphs object reflects the same output.

[kazurayam]

SVG has its own XML Namespace. You need to understand it so that you write an XPath which is XML Namespace aware.

Cannot locate svg elements (web development using vue.js)

Here is an example project in which a xpath selector can successfully locate a <svg> element generated by Highcharts. I think that the XML Namespace xmlns="http://www.w3.org/2000/svg" in the target <svg> element matters.

[hannah.martin]

I’ve reviewed the discussion above but, still doesn’t find the element on SVG.
I’ve tried to part of the internal elements inside my object, but Katalon only recognize the following objects:
//div[@ class=“row temp-gauge_chart_100”]//div[@id=“temp_humid”]
I am trying to find tspan data equivalent 85%.
Heres the snapshot of the elements inside:

I am trying this xpath to my Katalon but doesn’t work:
//div[@ class=“row temp-gauge_chart_100”]//div[@id=“temp_humid”]/[namespace-uri() = “SVG namespace” and local-name()=“svg”]/[local-name()=“text”][1]/[local-name()=“text”][1]/[local-name()=“tspan”][1]
Even the uri is removed. Can you help me find whats wrong with my object @kazurayam ? Thank you appreciate it a lot.

[kazurayam]

Please try the following XPath expression.

@hannah.martin

//div[@id="temp_humid"]/*[local-name()="svg"]/*[local-name()="text"][2]/*[local-name()="tspan"]

[hannah.martin]

Still doesn’t work,

my webpage has a lot of duplicate SVG file with the same value inside the object. Does it have a bearing on the xpath?

[kazurayam]

We need to be able to get access to the target web app and open it on browser in hand.

Is your target web app publicly accessble on the Internet? If so, please tell its URL to us.

If it is not public, please save the target page into a MIME HTML file, zip it and share the file here.

The following post tells you how to save a web page into a MIME HTML file.

Can Katalon Test SAP HTML with FRAMESETs? [was: How to extract value of a text field?]

We need to see this page opened in browser in action. However this url seems to be configured to be private; you can see it but others on the public Internet can not. You can save this page into a single file (MIME HTML format), and share it by attaching the *.mht file to this topic. How to save the page as a MHT file? You can do it quite easily by Chrome. open the target URL in Chrome. right-click on the page. you will see “Save As” menu, choose it [right_click_select_Save_As] c…

[hannah.martin]

Since the file is to big, I will just sent a link on my drive for the .mthml

Container Information.zip

Kindly inform if it was inaccessible. Thank you so much.

[kazurayam]

I made a Test Case that processes the MHTML you provided.

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

import com.kms.katalon.core.testobject.ConditionType
import com.kms.katalon.core.testobject.TestObject
import com.kms.katalon.core.webui.keyword.WebUiBuiltInKeywords as WebUI

Path html = Paths.get("./Container Information.mht")
WebUI.openBrowser(html.toFile().toURI().toURL().toExternalForm())

String xpath = """//div[@id="temp_humid"]/*[local-name()="svg"]/*[local-name()="text"][2]/*[local-name()="tspan"]"""
TestObject tObj = makeTestObject("my", xpath)

WebUI.verifyElementPresent(tObj, 5)
String value = WebUI.getText(tObj)
println value

WebUI.closeBrowser();

TestObject makeTestObject(String name, String expr) {
	TestObject to = new TestObject(name)
	to.addProperty("xpath", ConditionType.EQUALS, expr)
	return to
}

I ran it and got the following output.

2022-05-16 21:50:48.821 INFO  c.k.katalon.core.main.TestCaseExecutor   - --------------------
2022-05-16 21:50:48.824 INFO  c.k.katalon.core.main.TestCaseExecutor   - START Test Cases/SVG
2022-05-16 21:50:50.191 INFO  c.k.k.core.webui.driver.DriverFactory    - Starting 'Chrome' driver
5 16, 2022 9:50:50 午後 org.openqa.selenium.remote.DesiredCapabilities chrome
情報: Using `new ChromeOptions()` is preferred to `DesiredCapabilities.chrome()`
2022-05-16 21:50:50.242 INFO  c.k.k.core.webui.driver.DriverFactory    - Action delay is set to 0 milliseconds
Starting ChromeDriver 100.0.4896.60 (6a5d10861ce8de5fce22564658033b43cb7de047-refs/branch-heads/4896@{#875}) on port 30486
Only local connections are allowed.
Please see https://chromedriver.chromium.org/security-considerations for suggestions on keeping ChromeDriver safe.
ChromeDriver was started successfully.
[1652705453.473][WARNING]: This version of ChromeDriver has not been tested with Chrome version 101.
5 16, 2022 9:50:53 午後 org.openqa.selenium.remote.ProtocolHandshake createSession
情報: Detected dialect: W3C
2022-05-16 21:50:53.769 INFO  c.k.k.core.webui.driver.DriverFactory    - sessionId = 08a10e5ebcda9c66f3efa5c7f222e301
2022-05-16 21:50:53.809 INFO  c.k.k.core.webui.driver.DriverFactory    - browser = Chrome 101.0.4951.64
2022-05-16 21:50:53.840 INFO  c.k.k.core.webui.driver.DriverFactory    - platform = Mac OS X
2022-05-16 21:50:53.862 INFO  c.k.k.core.webui.driver.DriverFactory    - seleniumVersion = 3.141.59
2022-05-16 21:50:53.883 INFO  c.k.k.core.webui.driver.DriverFactory    - proxyInformation = ProxyInformation { proxyOption=NO_PROXY, proxyServerType=HTTP, username=, password=********, proxyServerAddress=, proxyServerPort=0, executionList="", isApplyToDesiredCapabilities=true }
85.0 %
2022-05-16 21:50:56.602 INFO  c.k.katalon.core.main.TestCaseExecutor   - END Test Cases/SVG

As you see, the sample code was able to read “85.0 %” successfully.

I do not see why the XPath expression does not work for you.

[hannah.martin]

The code works fine also on my end. And the Xpath is targeted the exact object I’m looking. Thank you.
Apologies for this such a naïve question, but when I’m creating the xpath manually on object repository the Xpath indicated was unable to find. Can you show me the steps on xpath creation on object repository on how to plot up the: //div[@id=“temp_humid”]/[local-name()=“svg”]/[local-name()=“text”][2]/*[local-name()=“tspan”] , i think there was a missing on my process on xpath manual creation.
My steps are:

1. On Object Repository > Create new test object
2. Name the object
3. Select Xpath (radbutton)
4. Paste this on the selected locator textbox: //div[@id=“temp_humid”]/[local-name()=“svg”]/[local-name()=“text”][2]/*[local-name()=“tspan”]

I hope you can help, what process I am missing

[kazurayam]

@hannah.martin

the Xpath indicated was unable to find.

Sorry I do not understand this sentence.

[kazurayam]

@hannah.martin

My steps are:
…

Were you successful about the 4 steps? or not?

[hannah.martin]

What I am trying to do is to Verify and Highlight the element using the object spy by the Xpath you’ve given, but Katalon says it was unable to find the object.

[hannah.martin]

Is the SVG file only applicable for hard coded declaration of Xpath? Does Katalon not support the element with SVG on Object Repository?

[kazurayam]

I am not a Katalon technical at all. I am just a user.

I see you are using Object Spy tool.

You expect Object Spy to capture an SVG element and generate an XPath expression which can appropriately select the element.

I guess (and I think it is quite likely), Object Spy tool is NOT able to capture an SVG element at all. I guess, Object Spy is NOT XML Namespace aware. I guess, Object Spy can not find any element with it’s unique XML Namespace other than HTML4/5 or XHTML.

In other words, if you want to deal with SVG elements, you should not expect Spy and Web Recorder tools to help you much. You should be able to write XPath expressions without help by these tools.

---

The Object Spy is a GUI tool to generate locators in a storage named Object Repository by point & click operation with mouse.

You do not necessarily need Object Spy to create/edit a Test Object. Once you have made an entry (which is called as Test Object) in the Object Repository, you can edit Test Object manually to give any locator string. When you manually edit a Test Object, you can write any expression as you want.