Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Puppeteer Select Link

I want to click on a link in a html page, which contains following snippet:

<p>Die maximale Trefferanzahl von 200 wurde überschritten.
  <a href="/rp_web/search.do?doppelt">Verdoppeln Sie hier  Suchergebnislimit.</a>
</p>

I'm setting some filters before and then I am loading the page, which loads the page I need. On that resulting page, I want to click on the link as seen in the html snippet. The js I'm trying to use is this one

await Promise.all([
    page.click('input#landNW'), // set a filter
    page.click('input[type=submit]'), // submit the form
    page.waitForNavigation(), // wait for the page to load
    page.click('p a'), // not working: double the search results
    page.waitForNavigation() // not working: waiting for the page to reload
]).catch(e => console.log(e)); // no error

I am pretty sure the page.click('p a') is working properly, because in the console of my chrome browser I can do document.querySelector("p a").click(), which then reloads the page as expected.

I have also tried to select the url by using the href attr, e.g. with page.click('a[href="/rp_web/search.do?doppelt"]'), but I got an error: No node found for selector: a[href="/rp_web/search.do?doppelt"].

How can I accomplish what I expect to happen?

EDIT You can find the complete repo here: bitbucket/ytNeskews

like image 941
Neskews Avatar asked Jun 24 '18 15:06

Neskews


People also ask

How do you click a link in a puppeteer?

Java Prime Pack Puppeteer is capable of handling a link/button on a page. Before clicking an element we must be able to uniquely identify it with the help of any of the locators. In Puppeteer, we can click an element only if its dimensions are greater than zero pixel.

What is a selector puppeteer?

# Puppeteer and its approach to selectors. Puppeteer is a browser automation library for Node: it lets you control a browser using a simple and modern JavaScript API. The most prominent browser task is, of course, browsing web pages. Automating this task essentially amounts to automating interactions with the webpage.

How do you search for text in puppeteer?

We can get element text in Puppeteer. This is done with the help of the textContent property. This property of the element is passed as a parameter to the getProperty method.


1 Answers

There are lots of reports about page.click not working and in your case it indeed won't work for some reason. Luckily we can do everything with the help of a good old page.evaluate (or page.$eval): here I'm clicking the link manually in the browser context:

const puppeteer  = require ('puppeteer');
(async () => {
    const browser = await puppeteer.launch({ headless : false });
    const page = await browser.newPage();
    await page.goto('https://www.handelsregister.de/rp_web/mask.do?Typ=e');

    await Promise.all([
        page.click('input#landNW'), // set a filter
        page.click('input[type=submit]'), // submit the form
        page.waitForNavigation(), // wait for the page to load
    ]).catch(e => console.log(e));

    // Print the number of allowed results (must be 200)
    console.log(await page.$eval('#inhalt p', el => el.textContent.match(/\d+ hits/)[0]));

    await Promise.all([
         // Manual clicking of the link
         page.$eval('p a', el => el.click()),
         page.waitForNavigation()
    ]).catch(e => console.log(e));

    // Print the number of allowed results (must be 400 now)
    console.log(await page.$eval('#inhalt p', el => el.textContent.match(/\d+ hits/)[0]));

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

Results:

200 hits
400 hits

Also not that you should wait only for one page navigation at once. And one more note if I may — it is much more convenient to write such scripts with Chromium visible ({headless : false}).

like image 54
Vaviloff Avatar answered Sep 20 '22 22:09

Vaviloff