I open a website, then wait for all redirects to be done. Then I capture a captcha image, and send it via nodejs to a user. Then I recive the typed captcha:

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

    const page = await browser.newPage();



    await page.goto('http://localhost/p1.php' );

    await page.waitForNavigation();



    const captcha_image = await page.$eval('#security', e => e.getAttribute('src'));



    io.emit('send_captcha_to_client' , {text : captcha_image });



    var captcha = await captchaPromise;

After I receive the typed value of the capthca, I put it in the field and click the login button:

    await page.$eval('#W_CAPTCHA', (el , _captcha) => el.value = _captcha.W_CAPTCHA , captcha );



    await page.click('#login-btn');

Now after clicking the button, an ajax request will be sent to the server. Lets say http://example.com/login.php - if the captcha is right, I will get redirected to my dashboard, but if the ajax call returns lets say {status:er}

And there is <span id="alert"></span> in the page it'll add .Error class to it and put the error text in there. How can I intercept the ajax call and check if the login was successful or not?

I can check the result of the ajax call or wait and check the document for div.Error. But I am not sure how can I do any of them. Here is my failed attempt:

await page.waitForNavigation();



page.waitForSelector('.Error');

const error  = await page.$eval('.Error', e => e.value );



console.log(error);



browser.close();