[Answers](https://scrapfly.io/blog)   /  [puppeteer](https://scrapfly.io/blog/tag/puppeteer)   /  [How to click on cookie popups and modal alerts in Puppeteer?](https://scrapfly.io/blog/answers/how-to-click-on-modal-alerts-like-cookie-pop-up-in-puppeteer)   # How to click on cookie popups and modal alerts in Puppeteer?

 by [Bernardas Alisauskas](https://scrapfly.io/blog/author/bernardas) Jul 10, 2023 1 min read [\#puppeteer](https://scrapfly.io/blog/tag/puppeteer) 

 [  ](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fscrapfly.io%2Fblog%2Fanswers%2Fhow-to-click-on-modal-alerts-like-cookie-pop-up-in-puppeteer "Share on LinkedIn")    

 

 

When scraping using Puppeteer we might encounter modal popups which are Javascript alerts that hide the content on page load and show some sort of message like this one:



The most common example of modal popup is the cookie consent popup and there are multiple ways to handle popups in Puppeteer:

1. We can click on one of the values like "OK", "Yes" or "I Agree"
2. We can delete the modal element from the DOM

For example, let's take a look at [web-scraping.dev/login](https://web-scraping.dev/login) page which on page load throws a cookie pop-up:

python```python
const puppeteer = require('puppeteer');

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

    await page.goto('https://web-scraping.dev/login');

    // Option #1 - use page.click() to click on the button
    try {
        await page.waitForSelector('#cookie-ok', { timeout: 2000 });
        await page.click('#cookie-ok');
    } catch (error) {
        console.log('no cookie popup');
    }

    // Option #2 - delete the popup HTML
    // remove pop up
    const cookieModal = await page.$('#cookieModal');
    if (cookieModal) {
        await page.evaluate((el) => el.remove(), cookieModal);
    }

    // remove grey backgdrop which covers the screen
    const modalBackdrop = await page.$('.modal-backdrop');
    if (modalBackdrop) {
        await page.evaluate((el) => el.remove(), modalBackdrop);
    }

    await browser.close();
})();
```



Above, we explore two ways to handle modal pop-ups: clicking a button that would dismiss it and hard removing them from the DOM.
Generally, the first approach is more reliable as the real button click can have functionality attached to it like setting a cookie so the pop-up doesn't appear again.
For cases when it's a login requirement or advertisement, the second approach is more suited.



 

    



Scale Your Web Scraping

Anti-bot bypass, browser rendering, and rotating proxies, all in one API. Start with 1,000 free credits.

  No credit card required  1,000 free API credits  Anti-bot bypass included 

 [Start Free](https://scrapfly.io/register) [View Docs](https://scrapfly.io/docs/onboarding) 

 Not ready? Get our newsletter instead. 

 

## Explore this Article with AI

 [ ChatGPT ](https://chat.openai.com/?q=Summarize%20this%20page%3A%20https%3A%2F%2Fscrapfly.io%2Fblog%2Fanswers%2Fhow-to-click-on-modal-alerts-like-cookie-pop-up-in-puppeteer) [ Gemini ](https://www.google.com/search?udm=50&aep=11&q=Summarize%20this%20page%3A%20https%3A%2F%2Fscrapfly.io%2Fblog%2Fanswers%2Fhow-to-click-on-modal-alerts-like-cookie-pop-up-in-puppeteer) [ Grok ](https://x.com/i/grok?text=Summarize%20this%20page%3A%20https%3A%2F%2Fscrapfly.io%2Fblog%2Fanswers%2Fhow-to-click-on-modal-alerts-like-cookie-pop-up-in-puppeteer) [ Perplexity ](https://www.perplexity.ai/search/new?q=Summarize%20this%20page%3A%20https%3A%2F%2Fscrapfly.io%2Fblog%2Fanswers%2Fhow-to-click-on-modal-alerts-like-cookie-pop-up-in-puppeteer) [ Claude ](https://claude.ai/new?q=Summarize%20this%20page%3A%20https%3A%2F%2Fscrapfly.io%2Fblog%2Fanswers%2Fhow-to-click-on-modal-alerts-like-cookie-pop-up-in-puppeteer) 



 ## Related Articles

 [  

 nodejs headless-browser 

### How to Web Scrape with Puppeteer and NodeJS in 2026

Introduction to using Puppeteer in Nodejs for web scraping dynamic web pages and web apps. Tips and tricks, best practic...

 

 ](https://scrapfly.io/blog/posts/web-scraping-with-puppeteer-and-nodejs) [     

 blocking nodejs 

### Puppeteer Stealth: Complete Guide to Avoiding Detection

Complete guide to puppeteer-extra-plugin-stealth for avoiding bot detection. Learn how detection works, configure stealt...

 

 ](https://scrapfly.io/blog/posts/puppeteer-stealth-complete-guide) [  

 headless-browser puppeteer 

### How to find elements by CSS selector in Puppeteer?

To find HTML elements using CSS selectors in Puppeteer the $ and $eval methods can be used. Here's how to use them.

 

 ](https://scrapfly.io/blog/posts/how-to-find-elements-by-css-selectors-in-puppeteer) 

  ## Related Questions

- [ Q How to click on cookie popups and modal alerts in Selenium? ](https://scrapfly.io/blog/answers/how-to-click-on-modal-alerts-like-cookie-pop-up-in-selenium)
- [ Q How to click on cookie popups and modal alerts in Playwright? ](https://scrapfly.io/blog/answers/how-to-click-on-modal-alerts-like-cookie-pop-up-in-playwright)
- [ Q How to handle popup dialogs in Puppeteer? ](https://scrapfly.io/blog/answers/how-to-click-on-alert-dialog-in-puppeteer)
- [ Q How to handle popup dialogs in Selenium? ](https://scrapfly.io/blog/answers/how-to-click-on-alert-dialog-in-selenium)
 
  



   



 Run headless browsers at scale, **1,000 free credits** [Start Free](https://scrapfly.io/register)