How to redirect a page, wait until fully loaded and then query

Question

I'm trying to have a code which redirect to a certain page and then wait the page to be fully loaded and then do some queries on this new page. For example I want to redirect to google.com and then inject 'hello' in the search bar.

I have tried some sleep/wait functions or event listeners but didn't worked.

<!DOCTYPE html>
<html>
<head>
    <title>query</title>
</head>
<body>
    <script type="text/javascript">
        window.location = 'https://google.com';
        document.querySelector('input[name="q"]').value = 'hello';
    </script>
</body>
</html>

I would like to wait that the new page has fully charged and then do the query, but with the above script it only goes to google.com and don't inject 'hello' in the search bar.

That is not possible from current page. When new page loads current page code is gone and has no access to the new window. The code to modify next page needs to be included in that page — charlietfl, Aug 04 '19 at 18:29
Put the query in the url instead `window.location = 'https://google.com?q=hello';` — charlietfl, Aug 04 '19 at 18:38
But I would like to execute a few queries, I don't think putting them in the url is the good solution... And if it is not possible do you have an alternative ? I'm just trying to automate some simple actions to check an information from this new page — Dime, Aug 04 '19 at 18:43
The only way to inject code programmatically on pages that you don't have control is by using a browser extension. — Emeeus, Aug 04 '19 at 18:43
That's not possible unless you code a chrome extension that allows you to mess with the pages' content. — Ozan Kurt, Aug 04 '19 at 18:43
You can also use `userscripts` in an extension like TamperMonkey. Or run a headless browser server side — charlietfl, Aug 04 '19 at 18:44
Userscripts in Tampermonkey are fairly easy to get started after a couple of brief tutorials — charlietfl, Aug 04 '19 at 18:59

score 1 · Accepted Answer · answered Aug 04 '19 at 18:26

1

If you're using jQuery, you can use one of the 3 below.

<script>
    $(function() {
        // Code...
    });

    jQuery(document).ready(function($) {
        // Code...
    });

    $(document).ready(function() {
        // Code...
    });
</script>

If not check this answer:

Pure JavaScript equivalent of jQuery's $.ready() - how to call a function when the page/DOM is ready for it

answered Aug 04 '19 at 18:26

Ozan Kurt

3,731
4
18
32

This does not solve what is being asked. Also question is not tagged jQuery – charlietfl Aug 04 '19 at 18:31
Could you please give examples of pages you're referring to so that I can understand what you mean more clearly. – Ozan Kurt Aug 04 '19 at 18:32
You can't take any JS action in a page you don't code. Why exactly do you need to append the query string (?query=hello) after the page load? – Ozan Kurt Aug 04 '19 at 18:42
Trying to automate the login into my account on a website and check an information – Dime Aug 04 '19 at 18:44
As @Emeeus said in the comments a plugin is your only way out. – Ozan Kurt Aug 04 '19 at 18:48

score 0 · Answer 2 · answered Aug 04 '19 at 19:45

0

If you load a new page, you lose control. Do not look no further, javascript cant help you there.

If you want to query google just write "https://www.google.com/search?q=" and your query.

Or you can use iframes.

answered Aug 04 '19 at 19:45

Marius Danciu

178
8

score -1 · Answer 3 · answered Aug 04 '19 at 19:14

You can use puppeteer to do this. This comes with node.js. You can navigate to a page, wait until it loads, then input text in a text field and click on submit.

https://pptr.dev/

Here is the sample code:

    const puppeteer = require('puppeteer');

    (async () => {
      const browser = await puppeteer.launch();
      const page = await browser.newPage();
      await page.goto('https://google.com');
      await page.screenshot({path: 'example.png'});

      await browser.close();
    })();

How to redirect a page, wait until fully loaded and then query

3 Answers3