Trying to get Puppeteer to navigate through my login page which will bring the automated test to the main page of my site. It all works until it reaches 'waitFor('#idSIButton9');'. Puppeteer successfully enters the password and username but can't seem to select the submit button(#idSIButton9). Any idea what might be going wrong here? Let me know if you guys need more info. Thanks :)

const puppeteer = require('puppeteer');
    const { defineSupportCode } = require('cucumber')

    defineSupportCode(({ Before, Given, When, Then }) => {
        Before({ timeout: 60 * 1000 }, async function testCase() {

            this.browser = await puppeteer.launch({ headless: false });

            this.page = await this.browser.newPage();

            await this.page.setViewport({width: 1024, height: 768});

            await this.page.goto('http://localhost:3000', {waitUntil: 'networkidle2'});

            await this.page.screenshot({ path: 'test_artifacts/img/load.png', fullPage: true });

            await this.page.waitFor('button');

            await this.page.click('button');

            await this.page.waitFor('#i0116');

            await this.page.type('#i0116', 'username');

            await this.page.waitFor('#i0118');

            await this.page.type('#i0118', 'password');

            await this.page.waitFor('#idSIButton9');

            await this.page.click('#idSIButton9');

        })

Trying to get Puppeteer to navigate through my login page which will bring the automated test to the main page of my site. It all works until it reaches 'waitFor('#idSIButton9');'. Puppeteer successfully enters the password and username but can't seem to select the submit button(#idSIButton9). Any idea what might be going wrong here? Let me know if you guys need more info. Thanks :)

const puppeteer = require('puppeteer');
    const { defineSupportCode } = require('cucumber')

    defineSupportCode(({ Before, Given, When, Then }) => {
        Before({ timeout: 60 * 1000 }, async function testCase() {

            this.browser = await puppeteer.launch({ headless: false });

            this.page = await this.browser.newPage();

            await this.page.setViewport({width: 1024, height: 768});

            await this.page.goto('http://localhost:3000', {waitUntil: 'networkidle2'});

            await this.page.screenshot({ path: 'test_artifacts/img/load.png', fullPage: true });

            await this.page.waitFor('button');

            await this.page.click('button');

            await this.page.waitFor('#i0116');

            await this.page.type('#i0116', 'username');

            await this.page.waitFor('#i0118');

            await this.page.type('#i0118', 'password');

            await this.page.waitFor('#idSIButton9');

            await this.page.click('#idSIButton9');

        })

• javascript
• cucumber
• cucumberjs
• puppeteer

• Maybe it's a typo on that page? Maybe adding a screenshot of that page might let us help you? – Md. Abu Taher Commented Jan 15, 2018 at 12:55

2 Answers 2

I seems to find, as the above answer

page.waitForNavigation('load') 

Works well in cases where clicking triggers navigation.

Seems fairly obvious but putting a wait before clicking works with a numeric value:

await this.page.waitFor(2000);

await this.page.click('#idSIButton9');

await this.page.waitForNavigation();