cancel
Showing results for 
Search instead for 
Did you mean: 

Exploring the DOM - Finding ChildNodes

SOLVED
coffee
Contributor

Exploring the DOM - Finding ChildNodes

Hi,

 

I am very very new in TestComplete. Just trying the product.

 

I am wondering, can TestComplete explore the DOM and find the Child Nodes ?

 

E.g. in Javascript we can write this to find some elements in the DOM 

 

var x = document.getElementById("div3");
var y = x.getElementsByTagName("p");
var contents = y[2].innerHTML;

Or 

 

var y = document.childNodes[0].childNodes[1].childNodes[1].childNodes[1];

Can TestComplete do the same?  

 

Secondly, I am also wondering if I am going to the wrong track, because most TestComplete users tend to use the Keyword Recorder and then convert the Keyword to e.g. JavaScript script and modify the script from there (without any need to analyse the DOM).  I find it easier but the Recorder refers to a coordinate on the page , so the script looks like this (instead of referring to the specific web element in the DOM)

Aliases.browser.pageGooglecom.textboxUsername.Click(67, 13);

 

What is the best practice for TestComplete user? Should TestComplete user analyse the DOM and create Javascript script from there or just run & rely on the Keyword Recorder?

 

I come from Selenium background , so I tend to analyse the DOM to create my Java code. 

 

Thank You.

 

1 ACCEPTED SOLUTION

Accepted Solutions
Colin_McCrae
Community Hero

Re: Exploring the DOM - Finding ChildNodes

When you record a Click, it takes in the co-ordinates (relative to the control it's applying the click to).

 

But in most cases, they're not required and you can just remove them. In the above example, try changing it to plain old "Click()" and it should still work just fine. Personally, I write all my scripts from scratch. Converted recordings are OK, but generally need at least some tweaking to make them more flexible/useful and tidy up some of the extra stuff you often get from auto-generated scripts (such as click co-coordinates) which you don't really need.

 

If you want to explore the DOM, look at the tabs at the bottom of your project area, there should be an "Object Browser" tab. Click that (with your site or application open) and it will show you the entire structure, as TestComplete see's it. On top of that, there are plenty of "Find" type options including XPath and CSS Selector type options similar to Selenium (for web based tests). Similarly, you can start with the object spy on a specific object and then jump to it in the main Object Explorer in TC. (Top right button in the object spy once you select an object)

View solution in original post

4 REPLIES 4
Colin_McCrae
Community Hero

Re: Exploring the DOM - Finding ChildNodes

When you record a Click, it takes in the co-ordinates (relative to the control it's applying the click to).

 

But in most cases, they're not required and you can just remove them. In the above example, try changing it to plain old "Click()" and it should still work just fine. Personally, I write all my scripts from scratch. Converted recordings are OK, but generally need at least some tweaking to make them more flexible/useful and tidy up some of the extra stuff you often get from auto-generated scripts (such as click co-coordinates) which you don't really need.

 

If you want to explore the DOM, look at the tabs at the bottom of your project area, there should be an "Object Browser" tab. Click that (with your site or application open) and it will show you the entire structure, as TestComplete see's it. On top of that, there are plenty of "Find" type options including XPath and CSS Selector type options similar to Selenium (for web based tests). Similarly, you can start with the object spy on a specific object and then jump to it in the main Object Explorer in TC. (Top right button in the object spy once you select an object)

View solution in original post

tawilli5
New Contributor

Re: Exploring the DOM - Finding ChildNodes

I am unable to retrieve any child elements within a table. When using the following code, I am able to retrieve the entire row with no issue:

 

 

1. var xpath = "//tr/td/div[text() = 'Ryan STIG Regression Test']"; 
2. var theVisitor = page.FindChildByXPath(xpath)
3. 
4. if(theVisitor.Exists){
5. 
6. Sys.HighlightObject(theVisitor);
7. Log.Message(theVisitor.parentElement.parentElement.innerText); 
8. 
}

But when adding the following code :

8. Log.Message(theVisitor.parentElement.parentElement.cells[1].innerText);

I receive a JavaScript runtime error. “TypeError: Cannot read property ‘innerText’ of undefined.

This is a valid element search, as it works with no problem when utilizing the browser console via the dev toolsTestComplete_2018-12-04_13-19-19.png

AlexKaras
Community Hero

Re: Exploring the DOM - Finding ChildNodes

Hi,

 

Cannot read property ‘innerText’ of undefined.

This means that theVisitor.parentElement.parentElement does not contain cells[1] child.

Use ObjectBrowser to explore page structure but not dev tools.

 

P.S.

page.FindChildByXPath(xpath)

While search by XPath is supported by TestComplete, it is not recommended and .FindXXX() methods must be used instead. Search by XPath is the last resort way in TestComplete world.

 

Regards,
  /Alex [Community Hero]
____
[Community Heroes] are not employed by SmartBear Software but
are just volunteers who have some experience with the tools by SmartBear Software
and a desire to help others. Posts made by [Community Heroes]
may differ from the official policies of SmartBear Software and should be treated
as the own private opinion of their authors and under no circumstances as an
official answer from SmartBear Software.
The [Community Hero] signature is used with permission by SmartBear Software.
https://community.smartbear.com/t5/custom/page/page-id/hall-of-fame
================================
tawilli5
New Contributor

Re: Exploring the DOM - Finding ChildNodes

Thanks for your insight

New Here?
Join us and watch the welcome video:
Announcements
Top Kudoed Authors