Forum Discussion
I would like to know the same thing. We are moving to a new project and will start using React. Does Test Complete handle React web pages correctly?
- twhitehouse8 years agoContributor
I was actually able to create a quick script that navigates to this web page with example React code on it, clicks the "Result" link under #2 on this page and finally checks the text on the "Home" button. Everything worked as expected. Sometimes in the past, with dynamic pages, Test Complete could not find the item on the page. But, this script below seemed to cause no issues on this React web page.
sub test1
Sys.Browser("iexplore").ToUrl("http://tutorialzine.com/2014/07/5-practical-examples-for-learning-facebooks-react-framework/")
aqUtils.Delay 5000
Call Aliases.browser.page5PracticalExamplesForLearnin.sectionContent.articlePost.frameHttpJsfiddleNetDannymarkovV.panelWrapper.header.linkResult.Click()
aqUtils.Delay 5000
Call aqObject.CheckProperty(Aliases.browser.page5PracticalExamplesForLearnin.sectionContent.articlePost.frameHttpJsfiddleNetDannymarkovV.frameFiddleJshellNetDannymarkovV.panel.textnodeHome, "contentText", cmpContains, "Home", False)
end sub- twhitehouse8 years agoContributor
That being said, does anyone have more information or samples within Test Complete for how it handles React web sites? Any help would be appreciated.
- AlexKaras8 years agoChampion Level 3
Hi,
I did not work with React personally, but considering that this is just another javascript library I would like to reference a brilliant reply from Lino Tadros: https://community.smartbear.com/t5/Functional-Web-Testing/TestComplete-9-3-Does-it-support-kendoUI/m-p/81168#M17730 and till the end of the thread.
The approach should be the same as for other dynamic web pages:
-- Perform some action (click a link or a button, etc.);
-- Wait until the page is loaded;
-- Because of the fact that dynamic pages not necessarily reload the page: wait until either the target object or one of its parents appears;
-- If you was waiting for some parent object, search for the target object using (dynamic) set of unique properties;
-- Do whatever required with the found target object.