How can I scroll down to the end of a dynamically loading webpage?

Integrations
,
1

Hello community!!! :slightly_smiling_face:

As the title says, how can I scroll down to the end of a dynamically loading webpage? We are talking about a webpage which as much as your scrolling down new elements coming up, up to a point.

I have try:

  1. WebUI.scrollToElement(findTestObject('footer'), 30)
  2. WebUI.executeJavaScript('window.scrollTo(0, document.documentElement.scrollHeight)', [])
  3. WebUI.executeJavaScript('window.scrollTo(0, document.body.scrollHeight)', [])
  4. WebUI.executeJavaScript(‘window.scrollTo(0, **923** )’, [])

…But none of this works for me. Any other idea?

Thank you for your time!!!

2

The end of an endlessly-scrollable page — this sounds self-contradictory.

What do you define the term “the end of a dynamically loading webpage”?

3

I though I was clear…

We are talking about a webpage which as much as your scrolling down new elements coming up, >>> up to a point <<<.

Let’s take it again…

I open a page, and gives me 10 rows with five elements per row. Let’s say they are shoes images…
If I scroll down, 10 more new rows with five elements per row come up. Which did not exist before!!!
If I scroll down again, 10 more new rows with five elements per row come up and so on.
Οf course at some point, where we have seen all the products, page stop scrolling.
How can I scroll automatically until I get down there?

I have found something like this:

JavascriptExecutor js = (JavascriptExecutor) driver;
try {
    long lastHeight=((Number)js.executeScript("return document.body.scrollHeight")).longValue();
    while (true) {
        ((JavascriptExecutor) driver).executeScript("window.scrollTo(0, document.body.scrollHeight);");
        Thread.sleep(2000);

        long newHeight = ((Number)js.executeScript("return document.body.scrollHeight")).longValue();
        if (newHeight == lastHeight) {
            break;
        }
        lastHeight = newHeight;
    }
} catch (InterruptedException e) {
    e.printStackTrace();
}

But I don’t know how to apply it in Katalon Studio!!!

4

Did you put it in a Test Case and try it?

5

Yes, I am working it in test cases folder. My problem is that I can’t apply the code I added above into WebUI.executeJavaScript('', []). I have to add it as one line? It takes multi-line script? How?

6 
try { 
  long lastHeight=((Number) WebUI.executeJavaScript("return document.body.scrollHeight", null)).longValue(); 

  while (true) { 
    WebUI.executeJavaScript("window.scrollTo(0, document.body.scrollHeight);", null);
    Thread.sleep(2000);
    long newHeight = ((Number)WebUI.executeJavaScript("return document.body.scrollHeight"), null).longValue();
    if (newHeight == lastHeight) { 
      break;
    } 
    lastHeight = newHeight;
  } 
} catch (InterruptedException e) {
 e.printStackTrace();
}
7

Yes… How I’ll add this in here WebUI.executeJavaScript('', []) in script mode? What is the syntax? If I change line I get errors!!!

10

@simos.sigma, I think what Russ means is that he did implement WebUI.executeJavaScipt() into your code for you. It is not a copy/paste of your code.

15

First of all, I would like to apologize for the inconvenience I caused to this topic and to other users, because I wasn’t able to understand Moderator’s answer. My brain, at that particular moment, was in a state of emergency due to fatigue and I couldn’t see the obvious.

About my annoyance with the supposedly funny picture with the horses posted by Moderator, I don’t know… This is his “problem”, obviously a behavioral problem and I’ll let him do as he thinks.

Now, the reason I came back is to correct a small syntax error in the code in case someone else needs it…

try { 
  long lastHeight=((Number) WebUI.executeJavaScript("return document.body.scrollHeight", null)).longValue(); 

  while (true) { 
    WebUI.executeJavaScript("window.scrollTo(0, document.body.scrollHeight);", null);
    Thread.sleep(2000);
    long newHeight = ((Number)WebUI.executeJavaScript("return document.body.scrollHeight", null)).longValue();
    if (newHeight == lastHeight) { 
      break;
    } 
    lastHeight = newHeight;
  } 
} catch (InterruptedException e) {
 e.printStackTrace();
}
16

@simos.sigma

Your original question was this.

Have you found out a satisfactory answer to it?

Did the code you’ve just posted above solve your problem?

17

Yes, I found the answer I was looking for. Of course not with satisfactory way but anyway…

Yes of course and this is why I marked it as the solution!!!

18

Fine. Thank you for the reply.

Finally I understand what was your problem. The code above precisely tells it.

19

You are welcome.