I have a button on a website that doesn’t want to be clicked. Clicking on said button hangs up puppeteer and doesn’t actually get clicked. I’ve used many different ways to click on the button however, they all result in the same way, everything stops and nothing is ran.

Below are some diffrent methods, I’ve attemped at least 20 ways. Puppeteer debugging really only shows limited logs. Every other portion of the code works, just this button its’t.

console.logs:
0: JSHandle:undefined
1: JSHandle:0
2: JSHandle:123
3: JSHandle:123
4: JSHandle:ASDDDDDDDDDDDDDDDDDDDDDDDDDDDD
Puppeteer Logs:
puppeteer:protocol:RECV ◀ [
puppeteer:protocol:RECV ◀ ‘{“method”:”Runtime.consoleAPICalled”,”params”:{“type”:”log”,”args”:[{“type”:”undefined”},{“type”:”number”,”value”:0,”description”:”0″},{“type”:”number”,”value”:123,”description”:”123″},{“type”:”number”,”value”:123,”description”:”123″},{“type”:”string”,”value”:”ASDDDDDDDDDDDDDDDDDDDDDDDDDDDD”}]… “stackTrace”:{“callFrames”:[{“functionName”:”onSubmit”…

Code V1

await page.evaluate(() => {
    const spanElements = document.querySelectorAll('span');
    for (const spanElement of spanElements) {
        if (spanElement.textContent.trim() === 'SAVE DETAILS') {
            spanElement.click();
                        console.log('found!!');

            break; 
        }
    }
});

Code V2

    try {
        await page.waitForSelector('span', { visible: true });
        const spanSelector = await page.evaluate(() => {
            const spanElements = document.querySelectorAll('span');
            console.log(`Found ${spanElements.length} span elements`);

            for (const spanElement of spanElements) {
                if (spanElement.textContent.trim() === 'SAVE DETAILS') {
                    console.log('Found the SAVE DETAILS span element.');
                    return spanElement; // Return the element itself
                }
            }
            return null;
        });

        if (spanSelector) {
            const result = await page.evaluate(span => {
                span.focus();
                span.click();
                return true;
            }, spanSelector);

            if (result) {
                console.log('Clicked the SAVE DETAILS span element successfully.');
            } else {
                console.log('Failed to click the SAVE DETAILS span element.');
            }
        } else {
            console.log('SAVE DETAILS span element not found.');
        }
    } catch (error) {
        console.error('Error during script execution:', error);
    }