How to find elements by CSS selectors in Playwright?

The most popular way to parse HTML content in web scraping are CSS selectors which are the default way to locate elements in Playwright as well. To find elements using CSS selectors we can use page.locator() method. For example:

from playwright.sync_api import sync_playwright

with sync_playwright() as pw:
    browser = pw.chromium.launch(headless=False)
    context = browser.new_context(viewport={"width": 1920, "height": 1080})
    page = context.new_page()
    page.goto("https://google.com/")

    h2_element = page.locator("h2.some-class")

⚠ It's possible that these commands will try to find elements before the page has fully loaded if it's a dynamic javascript page. For more see How to wait for page to load in Playwright?

Also see: How to find elements by XPath selectors in Playwright?

Question tagged: Playwright, Python

Related Posts

How to Scrape With Headless Firefox

Discover how to use headless Firefox with Selenium, Playwright, and Puppeteer for web scraping, including practical examples for each library.

Web Scraping Dynamic Websites With Scrapy Playwright

Learn about Selenium Playwright. A Scrapy integration that allows web scraping dynamic web pages with Scrapy. We'll explain web scraping with Scrapy Playwright through an example project and how to use it for common scraping use cases, such as clicking elements, scrolling and waiting for elements.

How to Use Chrome Extensions with Playwright, Puppeteer and Selenium

In this article, we'll explore different useful Chrome extensions for web scraping. We'll also explain how to install Chrome extensions with various headless browser libraries, such as Selenium, Playwright and Puppeteer.