CODEWITHSUNDEEP
javascriptnode.jsweb-scrapingweb-crawlerpuppeteer
ElJackiste
ElJackiste

Reputation: 4591

waitFor() doesn't find element which is displayed on the page

I am trying to run my first code on puppeteer.

Puppeteer v1.20.0

Node v8.11.3

Npm v5.6.0

It is a basic example but it doesn't works :

const puppeteer = require('puppeteer');

puppeteer.launch({headless: false}).then(async browser => {
  const page = await browser.newPage();

  await page.goto('https://www.linkedin.com/learning/login', { waitUntil: 'networkidle0' });

  console.log(0);
  await page.waitFor('#username');
  console.log(1);

  await browser.close();
});

When I run the script, chromium start and I can see the Linkedin login page with the form and the #username form's field, but puppeteer doesn't find the field. It displays 0 but never 1 and then runs a TimeoutError: waiting for selector "#username" failed: timeout 30000ms exceeded.

Increase timeout doesn't change anything and if I check the console in chromium the field is there.

Linkedin login page works as an SPA and I don't know if I'm using the right way here.

Thank you in advance.

Upvotes: 2

Views: 1481

Answers (1)

max
max

Reputation: 3716

username input is inside iframe you cant access it like this , you need to access iframe first

    await page.goto('https://www.linkedin.com/learning/login');
    await page.waitForSelector('.authentication-iframe');

    var frames = await page.frames();
    var myframe = frames.find(
        f =>
            f.url().indexOf("uas/login") > 0);

    let username = '[email protected]';
    const usernamefild = await myframe.$("#username");
    await usernamefild.type(username, {delay: 10});

Upvotes: 2

Related Questions