Puppeteer in NodeJS reports ‘Error: Node is either not visible or not an HTMLElement’

by

If your code looks like this

const button = await page.$(selector);
await button.click();

Try changing

await button.click();

to

await button.evaluate(b => b.click());

The difference is that button.click() clicks using Puppeteer’s ElementHandle.click() which

  1. scrolls the page until the element is in view
  2. gets the bounding box of the element (this step is where the error happens) and finds the screen x and y pixel coordinates of the middle of that box
  3. moves the virtual mouse to those coordinates and sets the mouse to “down” then back to “up”, which triggers a click event on the element under the mouse

whereas button.evaluate(b => b.click()) “clicks” the element by running the JavaScript HTMLElement.click() method on the given element in the browser context, which fires a click event. It doesn’t scroll the page or move the mouse and works even if the element is off-screen.

More Related Contents:

  1. How to download file with puppeteer using headless: true?
  2. Why can’t I access ‘window’ in an exposeFunction() function with Puppeteer?
  3. Puppeteer – Protocol error (Page.navigate): Target closed
  4. How to avoid being detected as bot on Puppeteer and Phantomjs?
  5. Puppeteer: How to listen to a specific response?
  6. node.js require() cache – possible to invalidate?
  7. module.exports vs. export default in Node.js and ES6
  8. NPM modules won’t install globally without sudo
  9. “message failed to fetch from registry” while trying to install any module
  10. NodeJS – Error installing with NPM
  11. What are the differences between node.js and node?
  12. How can I solve error gypgyp ERR!ERR! find VSfind VS msvs_version not set from command line or npm config?
  13. Why is node.js only processing six requests at a time?
  14. npm WARN npm npm does not support Node.js v9.1.0
  15. bundling precompiled binary into electron app
  16. How to send an html page as email in nodejs
  17. Model.find().toArray() claiming to not have .toArray() method
  18. pg-promise returns integers as strings
  19. How to create folder or key on s3 using AWS SDK for Node.js?
  20. GYP ERR! build error. stack Error: ‘make’ failed with exit code 2
  21. find file with wild card matching
  22. What is the pwa-node type launch configuration on VSCode?
  23. Visual Studio Code Debug Console colors?
  24. Controlling the heartbeat timeout from the client in socket.io
  25. Node.js promise request return
  26. npm: Why is a version “0.1” invalid?
  27. fs.createWriteStream does not immediately create file?
  28. How to catch an ENOENT with nodejs child_process.spawn?
  29. What’s the difference between dependencies, devDependencies, and peerDependencies in NPM package.json file?
  30. How to limit upload file size in express.js

Leave a Comment