DOM Sniper

DOM Sniper is an element picker for developers who work with AI coding assistants. When you ask an assistant to change something on a page, it first has to find that element in your code. DOM Sniper gives it what it needs: click an element, and the page URL, a CSS selector path, the element's position, and its HTML are copied to your clipboard, ready to paste. HOW IT WORKS 1. Open the side panel from the toolbar icon. 2. Press "Select element", or use the keyboard shortcut. 3. Click the element. The text is copied and the capture is saved to the history. WHAT GETS COPIED URL: http://localhost:4173/pricing DOM Path: main#main > section#pricing > div.pricing-card.pricing-card--featured Position: top=272px, left=335px, width=250px, height=320px HTML Element: <div class="pricing-card pricing-card--featured">Pro $8 / month ...</div> The DOM path is a valid CSS selector, so it can be used directly with document.querySelector. FEATURES • Pick any element: hover to highlight, click to capture, and use the keyboard to move to the parent or child element • Works with hover menus, modal dialogs, and open shadow DOM • History in the side panel, with a screenshot of each element • Search the history by URL, selector, text, or HTML • Copy the element's screenshot as an image • English and Japanese, with customizable picker keys PRIVACY DOM Sniper makes no network requests. Captures are stored only in your browser, and you can delete them at any time. The extension reads a page only after you start selecting on it. SOURCE CODE The source code is public on GitHub. Bug reports and feature requests are welcome there. https://github.com/furdabu/dom-sniper