How do I sign into Google using Puppeteer?

Question

I am using Puppeteer and I am trying to sign into my Gmail account

URL: https://accounts.google.com/ServiceLogin/identifier?service=mail&passive=true&rm=false&continue=https%3A%2F%2Fmail.google.com%2Fmail%2F&ss=1&scc=1&ltmpl=default&ltmplcache=2&emr=1&osid=1&flowName=GlifWebSignIn&flowEntry=AddSession

Currently my code types into the email form and submits enter, then when the page goes to the password screen, there is not way to write in the input for password. This may be because it is technically not a new page but the same. Either way I cannot seem to interact with this new page when I press enter on the email page.

I tried used a lot of the methods but to no avail.

const elementHandle = await page.$('input');
await elementHandle.type('dp-conference@digitalpulp.com');
  await page.click("#identifierNext");

//goes to new page
//this code does not work. 
const pw = await page.$('input[type="password"]');


page.on('load', () => console.log("Loaded: " + page.url()));

})

Answer 1

If a page load happens then the subsequent commands/scripts won't work as they aren't loaded properly. For that there's the waitForNavigation method.

Your code will look something like:

const elementHandle = await page.$('input');
await elementHandle.type('dp-conference@digitalpulp.com');
await page.click("#identifierNext");

// Wait for next pageload
await page.waitForNavigation(waitOptions)
const pw = await page.$('input[type="password"]');

Answer 2

This full script should work, please not this doesnt handle if you are logged in already or if your account uses 2-factor authentication, good luck

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

  const navigationPromise = page.waitForNavigation()

  await page.goto('https://accounts.google.com/')

  await navigationPromise

  await page.waitForSelector('input[type="email"]')
  await page.click('input[type="email"]')

  await navigationPromise

  //TODO : change to your email 
  await page.type('input[type="email"]', 'youremail@gmail.com')

  await page.waitForSelector('#identifierNext')
  await page.click('#identifierNext')

  await page.waitFor(500);

  await page.waitForSelector('input[type="password"]')
  await page.click('input[type="email"]')
  await page.waitFor(500);

  //TODO : change to your password
  await page.type('input[type="password"]', 'yourpassword')

  await page.waitForSelector('#passwordNext')
  await page.click('#passwordNext')

  await navigationPromise

  //await browser.close()
})()

Answer 3

This works for now... you can login once it loads like this. Get's around fedex login restrictions too :) Thanks @ABDELJALILAITETALEB !!!

const puppeteer = require('puppeteer-extra');
const StealthPlugin = require('puppeteer-extra-plugin-stealth');
puppeteer.use(StealthPlugin());
doit = async () => {
    const browser = await puppeteer.launch({args: ['--no-sandbox'], headless: false});
    let page = await browser.newPage();
    await page.goto('https://accounts.google.com');
}
doit();

Answer 4

Solved by signup process manually on puppeteer running instance and logged in successfully on Gmail. Thanks

Answer 5

Bro, I get it by adding an interval between instructions like this:

await page.goto('google-login-page-here')
await page.waitForTimeout(1000) // 1s interval
await page.waitForSelector('input[type="email"]')
await page.focus('input[type="email"]')
await page.keyboard.type('your-email-here', { delay: 50 })
await page.waitForTimeout(1000) // 1s interval
await page.click('next-button-selector-here')

await page.waitForTimeout(3000) // 3s interval
await page.waitForSelector('input[type="password"]')
await page.focus('input[type="password"]')
await page.keyboard.type('your-password-here', { delay: 50 })
await page.waitForTimeout(1000) // 1s interval
await page.click('next-button-selector-here')