puppeteer: Page.click() does not work with an input selector

Steps to reproduce

Tell us about your environment:

Puppeteer version: 1.8.0
Platform / OS version: Windows 10
URLs (if applicable):
Node.js version: 8.11.4

What steps will reproduce the problem?

I am trying to use page.click() to go to the username filed in Instagram. If I use the selector input[name=‘username’] in developer console it works. However, puppeteer keeps throwing an error that no node was found

Please include code that reproduces the issue.

const puppeteer = require('puppeteer');

(async () => {
	 try {
	const Browser = await puppeteer.launch({headless:false,
										defaultViewport:{width:600,height:800},
										waitUntil: ['load','domcontentloaded','networkidle0','networkidle2'],
						                timeout :0
						            	});
	const page=await Browser.newPage();
		
    await page.goto('https://www.instagram.com/accounts/login/?source=auth_switcher');
    
    await page.click('input[name="username"]');

    await page.keyboard.type('NewUser');
	await Browser.close();
	
	console.log("Iam done!");
	

	} catch(e) {console.log('main program error:' + e);
	}
	
})();

What is the expected result?

I should be able to type my username

What happens instead?

Puppeteer can’t find the user name field

About this issue

Original URL
State: closed
Created 6 years ago
Comments: 27 (5 by maintainers)

Commits related to this issue

swaping default click method See https://github.com/puppeteer/puppeteer/issues/3347 — committed to VirtualFlyBrain/geppetto-vfb by Robbie1977 4 years ago
fix(page): fix mouse.click method (#7097) The `Page#click` method relies on `Mouse#click` for execution. `Mouse#click` triggers the `move`, `down`, and `up` methods in parallel waiting for all of the... — committed to puppeteer/puppeteer by ptommasi 3 years ago

Most upvoted comments

I’m running into the same issue. Strangely, if I use page.evaluate, it does work. For example:

let selector = 'input[name="username"]';

// does not work
await page.click(selector); 

// does work
await page.evaluate((selector) => document.querySelector(selector).click(), selector);

I’d be curious if the same workaround works for you.

+82

russelldmatt on Oct 5, 2018

Here the same: await page.$eval('#link', elem => elem.click()); // works

await page.click('#link'); // doesn't work

const btn= await page.waitForSelector('#link'); await btn.click(); // doesn't work

+38

quarhodron on Mar 27, 2019

Page.$eval isn’t even working for me.

+13

twigs67 on Apr 18, 2019

I do not understand why google is not reacting to this issue originating back in 2018.

+12

elpupi on Oct 1, 2020

await page.click('#link') works most of the time. But for some mysterious reason, it won’t. The worst is that the program is doing exactly the same, but just on a different page with the exactly same layout.

Magically, await page.$eval('#link', elem => elem.click()); works really well.

+12

elpupi on Jun 13, 2019

Maybe you should first waitforselector(), then click.

+10

inevity on Nov 30, 2018

I tried to copy the js path from the log in button I wanted to be clicked on and it worked. await instagram.page.click(“#react-root > section > main > article > div.rgFsT > div:nth-child(1) > div > form > div:nth-child(4) > button > div”, {delay: 50});

The full function :


 login: async (username, password) => {
    await instagram.page.goto(BASE_URL, { waitUntil: 'networkidle2' });
  
    await instagram.page.waitFor(1000);
   
    /* Writing the username and password */

  await instagram.page.type('input[name="username"]', username, {delay: 150});
  await instagram.page.type('input[name="password"]',password, {delay: 150});
  

  /* Click on the login Button */ 

await instagram.page.click("#react-root > section > main > article > div.rgFsT > div:nth-child(1) > div > form > div:nth-child(4) > button > div", {delay: 50});


   
   
  
}

}

MadProgrammer0 on Apr 9, 2020

I’m able to see that in puppeteer 2.0.0, await page.$eval('#link', elem => elem.click()); // works await page.click('#link'); // doesn't work const btn= await page.waitForSelector('#link'); await btn.click(); // doesn't work Why this haven’t been fixed yet?

Parahet on Nov 13, 2019

from https://stackoverflow.com/questions/56226990/puppeteers-page-click-is-working-on-some-links-but-not-others/56227068

Try using ignoreHTTPSErrors option set to true:

puppeteer.launch({ ignoreHTTPSErrors: true, headless: false })

ezy on Feb 25, 2020

Ubuntu 18.04 Puppeteer 2.0.0

I went through this whole page and tried every solution to click a button of type submit and none of these worked for me. Curiously, most of these suggestions ended up unchecking a checkbox I had clicked that sits right above the target button instead

. . .

jbdoster on Dec 10, 2019