1. gibin.in
  2. Free tools
  3. Selector tester
Free tool · web scraping

Test scraping selectors on real HTML

For people who write web scrapers. A scraper needs selectors: short patterns that point at what you want on a page, like every product name and price. Paste a page's HTML, try your selectors, and see exactly what they pull out before you write any code.

Use it when
  • You're writing a scraper in Python, Playwright or Selenium and want the selectors right first
  • A scraper stopped returning data and you need to find which selector broke
  • You're learning CSS selectors or XPath and want to see results as you type
● Runs in your browserNothing uploadedFree, no sign-up
  1. Paste the page HTML
  2. Write a selector for each field
  3. Copy the rows or the code
Fields

Why you'd use this

This one is for people who build web scrapers: programs that visit a page and copy out data, like prices from a shop or listings from a directory. Every scraper depends on selectors, short patterns such as div.product h2 that tell it which part of the page to read.

Getting them wrong is the most common reason a scraper returns empty columns or shifted data. Usually you only find out after writing the code and running it. Here you paste the page, try selectors, and see the exact rows they'd produce, as you type. When it looks right, copy the working Python or Playwright code. If you don't write scrapers, this isn't the tool for you, and that's fine.

How to use it

  1. Get the HTML. View page source and copy it all, or copy one element's outerHTML from DevTools if the page builds its content with JavaScript.
  2. Paste it in. Nothing in it runs.
  3. Set repeat for each to the selector for one item, like div.product or table tr.
  4. Add a field per value you want. The number next to each field shows how many items it found something in. Amber means it matched nothing.
  5. When every field is green, copy the code or download the rows.

Selectors that survive a redesign

Most scrapers break because the selector was copied from DevTools and describes the page's layout instead of its meaning. A few habits that keep them alive longer:

  • Prefer meaning over position. .price or [itemprop=price] outlasts div > div:nth-child(3) > span.
  • Use data attributes when they exist. data-id, data-sku and data-testid are there for machines and change less often than class names.
  • Scope fields to an item. With repeat-for-each, a product with no rating gets an empty cell instead of shifting every rating after it up by one row.
  • Watch the hit counts. A field that matches in 2 of 3 items is telling you something. Sometimes it's real (out of stock), sometimes the markup differs on that item.

Why not just give it a URL?

A web page isn't allowed to read another site's HTML, and a tool that fetched pages through its own server would see every URL you test. Pasting is one more step, but it means you can test selectors on a logged-in page, an internal tool, or a saved file, and none of it leaves your machine.

Where this comes from. I've written scrapers for a living: at S&P Global, crawlers that covered 3.4 million company websites and 40+ government filing portals, and now agent-written scrapers that a second agent checks. Getting selectors right on real HTML before writing the scraper saves most of the debugging.

Questions

Why paste HTML instead of a URL?

A browser page can't fetch another website's HTML because of cross-origin rules, and a tool that proxied it for you would see everything you test. Pasting keeps it local. In Chrome, right-click the page, View page source, select all and copy. For pages that build their content with JavaScript, copy the element from DevTools instead (right-click in Elements, Copy, Copy outerHTML).

Is it safe to paste HTML from any site?

Yes. The HTML is parsed into a detached document that never touches this page. Scripts in it don't run, and images, styles and iframes in it don't load. The sample even includes a script tag to show it.

What's "repeat for each"?

The selector for one item on a listing page: a product card, a search result, a table row. Each field is then searched inside that item, so fields stay lined up even when one item is missing a value. Leave it empty to run each selector over the whole page.

Does the generated code work as is?

It mirrors exactly what the tool did, so if the table looks right here, the code returns the same rows from the same HTML. The Python version uses parsel, the selector library behind Scrapy. The Playwright version runs inside the page, so you can also paste the inner function into the browser console.

CSS or XPath?

CSS is shorter and covers most cases. XPath can do what CSS can't: select by text (//a[contains(., 'Next')]), step up to a parent, or read an attribute directly (//a/@href). Inside a repeat-for-each item, start XPath with a dot (.//h2) so it searches the item, not the whole page.