- Chrome DevTools: Chrome has a nifty features where if you inspect any element in the DOM, you can right click on it and go to the Copy menu to copy a CSS or XPath selector to the element.
- DIY: If you have experience with XPath or CSS selectors, you can often infer what attributes and structural elements to use to generate selectors.
- Finic: Run
finic generate-selectors
to use a LLM to predict selectors for elements you pick out.
Using the Finic Selector Generator
Finic’s selector generator runs entirely locally, except for a call to OpenAi or Anthropic using your API key. You can view the code here.help
or h
command will list all available commands.
Demo video
Step 1: Choose elements
Your terminal will update whenever a new element is selected. Enteradd
or a
to queue it up for generation. list
or l
will list all queued elements.
The browser will open in inspect mode, which prevents interacting with the website. Enter mode
or m
to toggle inspect mode on and off so you can navigate the website.
Step 2: Generate selectors
The commandgenerate
or g
will start generating selectors for the elements you’ve queued. To minimize token usage, we send HTML for only the 2 closest siblings of the target element, the parent element, and the grandparent element.
In our testing this ends up being less than 5000 tokens in most cases.
Selectors will be saved to selectors.json
in the current directory.
Registering selectors with Finic Selector Service (FSS)
This is a preview: The Finic Selector Service is currently in development and not yet available.
selector_id
will overwrite existing registered selectors.
We plan on updating the Finic SDK to automatically sync
selectors.json
with FSS in a future update.