Working with React based pages


I am trying to scrape information from a web page based on ReactJs. The main problem is that the DOM keeps changing as I scroll up or down, hence I cannot get the complete information from the DOM (because it is incomplete).

Selectors did not help since the idx values change after scrolling up/down. Since selectors could not help me, I used Inject JS to get the DOM information, but no luck.

Can anybody provide any suggestion on this?

Thanks in advance.

@zahid_tushar Can you Show us the Screenshots of the Web Page and the Element that you want to Scrape? Also the Selector of the Element in UiExplorer, to check if there are any other attributes that can help to get the required element.

If you have used Inject JS, Can you show us the JS code and also a Screenshot of the HTML content when you Inspect the Element ?

It is the client’s backend, hence I am unable to share the screenshot.

However, please check the number of children counts I am getting.

As I scrolled through the selected div, the number of children changed from 2 to 6 to 4. The children count kept changing as I scrolled down.

I used the same JS code from the console in the inject JS activity.

function(element, args){
var param = args.split(",");
return (document.getElementsByClassName(param[0]).item(0).children[param[1]].children[0].children[0].children[1].children.length);


The children count that I am getting is passed on as paramenter (param[1]) in the function above. Since the children count differs, I found out that I am not getting all the children elements.

Here’s the UIExprlorer screenshot. I tried by checking/unchecking class, parentclass, etc. Again, no luck.