Uncaught Error Error: Node is either not clickable or not an HTMLElement

Question

Im trying to go to https://www.zalando.se/cart/ with these lines of code:

const cart = "https://www.zalando.se/cart/"

await page.goto(cart)

And it doesn't work. It has worked before completely fine but now all of a sudden it doesn't. I've tried doing it like I usually do that involves a click method but that didn't work so i resolved to this method instead.

This is the error thats popping up:

Uncaught Error Error: Evaluation failed: TypeError: Cannot read properties of undefined 
(reading 'click')
at _ExecutionContext_evaluate (file:///C:/Users/marce/node_modules/puppeteer- 
core/lib/cjs/puppeteer/common/ExecutionContext.js:229:15)
at processTicksAndRejections (node:internal/process/task_queues:95:5)
Process exited with code 1

This is my entire code if it's needed:

async function startBrowser() {
const browser = await puppeteer.launch({executablePath: 'C:\\Program 
Files (x86)\\Google\\Chrome\\Application\\chrome.exe',  headless: false,  
ignoreDefaultArgs: ['--disable-extensions'] });      
const page = await browser.newPage();
return page;
}


const puppeteer = require('puppeteer-extra');
const StealthPlugin = require('puppeteer-extra-plugin-stealth')
puppeteer.use(StealthPlugin())
const AdblockerPlugin = require('puppeteer-extra-plugin-adblocker')
puppeteer.use(AdblockerPlugin({ blockTrackers: true }))
const product_url = "https://www.zalando.se/nike-sportswear-air-flight- 
lite-mid-hoega-sneakers-whiteblack-ni112n02z-a11.html"
const cart = "https://www.zalando.se/cart/"




async function addToCart(page){
// going to website
await page.goto(product_url)
await new Promise(r => setTimeout(r, 1000));
// clicking "handla"
await page.waitForSelector("button[class='DJxzzA u9KIT8 uEg2FS U_OhzR 
ZkIJC- Vn-7c- FCIprz heWLCX JIgPn9 LyRfpJ pxpHHp Md_Vex NN8L-8 GTG2H9 
MfX1a0 WCjo-q EKabf7 aX2-iv r9BRio mo6ZnF  PLvOOB']");
await page.click("button[class='DJxzzA u9KIT8 uEg2FS U_OhzR ZkIJC- Vn- 
7c- FCIprz heWLCX JIgPn9 LyRfpJ pxpHHp Md_Vex NN8L-8 GTG2H9 MfX1a0 WCjo- 
q EKabf7 aX2-iv r9BRio mo6ZnF  PLvOOB']", elem => elem.click);
// clicking "size EU 41"
await page.evaluate(() => document.getElementsByClassName('_6G4BGa 
_0Qm8W1 _7Cm1F9 FxZV-M IvnZ13 Pb4Ja8 ibou8b JT3_zV ZkIJC- Md_Vex JCuRr_ 
na6fBM _0xLoFW FCIprz pVrzNP KRmOLG NuVH8Q')[4].click());
console.log("körs")
await new Promise(r => setTimeout(r, 1000));
// going to "cart"
await page.goto(cart)
await new Promise(r => setTimeout(r, 1000));
// clicking "gå till checkout"
await page.waitForSelector("button[class='z-1-button z-coast-base- 
primary-accessible z-coast-base__sticky-sumary__cart__button-checkout z- 
1-button--primary z-1-button--button']");
await page.click("button[class='z-1-button z-coast-base-primary- 
accessible z-coast-base__sticky-sumary__cart__button-checkout z-1- 
button--primary z-1-button--button']", elem => elem.click);
await new Promise(r => setTimeout(r, 1000));
// logging into gmail
const email = await page.waitForSelector("[id='login.email']");
await email.type('marc.ehinger1@gmail.com');
await new Promise(r => setTimeout(r, 1000));
// typing in password
const password = await page.waitForSelector("[id='login.secret']");
await password.type('Bassasdsa');
await new Promise(r => setTimeout(r, 1000));
// clicking "log in"
await page.evaluate(() => document.getElementsByClassName('DJxzzA u9KIT8 
uEg2FS U_OhzR ZkIJC- Vn-7c- FCIprz heWLCX JIgPn9 LyRfpJ pxpHHp Md_Vex 
NN8L-8 GTG2H9 MfX1a0 WCjo-q EKabf7 aX2-iv r9BRio mo6ZnF E6Km4r') 
[0].click());
await new Promise(r => setTimeout(r, 2000));
// clicking "hämta hos postombud"
await page.evaluate(() => document.getElementsByClassName('z-coast- 
fjord_deliveryDestinationTab_option z-coast- 
fjord_deliveryDestinationTab_option_PICKUP_POINT')[0].click());
await new Promise(r => setTimeout(r, 2000));
// clicking "välj postombud"
await page.evaluate(() => document.getElementsByClassName('z-1-button z- 
coast-base-primary-accessible undefined z-1-button--primary z-1-button-- 
button')[1].click());
await new Promise(r => setTimeout(r, 2000));
// clicking "fortsätt"
await page.evaluate(() => document.getElementsByClassName('z-1-button z- 
coast-base-primary-accessible undefined z-1-button--primary z-1-button-- 
button')[0].click());
await new Promise(r => setTimeout(r, 5500));
// clicking "kortbetalning"
await page.evaluate(() => document.getElementsByClassName('Vm2aBa 
_0Qm8W1 _7Cm1F9 FxZV-M JT3_zV _5Yd-hZ pVrzNP RKlRH1')[1].click());
await new Promise(r => setTimeout(r, 1000));
// clicking "fortsätt"
await page.evaluate(() => document.getElementsByClassName('z-1-button z- 
coast-base-primary-accessible undefined z-1-button--primary z-1-button-- 
button')[0].click());
await new Promise(r => setTimeout(r, 2000));
// clicking "skicka beställningen och betala"
await page.evaluate(() => document.getElementsByClassName('z-1-button z- 
coast-base-primary-accessible undefined z-1-button--primary z-1-button-- 
button')[0].click());
await new Promise(r => setTimeout(r, 8000));
// clicking "fortsätt"

}  





async function checkout(){
var page = await startBrowser();
await addToCart(page);
}

checkout();

Answer 1

Judging by the error, you're using the wrong selector use [data-id=login-button] for the login button like in the code below or [data-id=continue-shopping-button] for the other button.

Code :

const puppeteer = require("puppeteer");

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

    let cart = 'https://www.zalando.se/cart/';

    await page.goto(cart, {waitUntil: 'networkidle2', timeout: 30000});

    const loggain = await page.waitForSelector('[data-id=login-button]', {timeout: 5000});
    await loggain.click();

})().catch(err => console.error(err)). finally(() => browser ?. close());