address chip, connect button

WHAT IT DOES

This tool scans any webpage to detect every interactive element including buttons, links, form inputs (text, email, number, tel, url, password, search, textarea, select, checkbox, radio), and clickable elements with click event listeners or role="button". For each element found, it displays the element type, text content or label, element selector, and interaction state (enabled, disabled, readonly). It identifies form associations and all input validation attributes including required, pattern, min, max, step, maxlength, minlength, autocomplete, and spellcheck. Color swatch previews are shown for text color, background color, and border color when detected. A powerful search filter lets you find elements by type, label text, selector, or any attribute value. You can copy element CSS declarations or the full HTML markup to your clipboard with one click. The inspector mode lets you click any interactive element on the page to see its complete attributes, computed styles, and form validation state in a detailed alert dialog.

WHERE IT RUNS

The script runs on every website and web application you visit. It works with all HTML interactive elements regardless of framework—React, Vue, Angular, Svelte, or plain HTML. It detects both native form elements and custom interactive components with role="button" or click handlers. The tool captures elements rendered server-side or client-side, and accurately reports their current state and attributes.

HOW TO USE

Upon installation, a floating panel appears with the tool interface. Click "Scan" to analyze the current page for all interactive elements. Use the search box to filter results by element type (e.g., "button", "text", "checkbox"), label text, selector, or validation attributes like "required" or "pattern". Notice that each entry shows a type badge, disabled/readonly/required status indicators, the element's label or text content, and color swatches for its styling. Hover over any entry in the panel to highlight that element on the page with a blue outline. Click "CSS" on any entry to copy that element's computed color, background-color, border-color, font-size, and font-weight declarations. Click "HTML" to copy the full outerHTML markup. Click "Highlight" to scroll to and emphasize the element on the page. Click "Inspect" to enter inspector mode, then click any interactive element on the page to see a detailed report including its tag, type, text content, value, placeholder, all attributes, computed styles, and validation state. Click "Inspect" again or press Escape to exit inspector mode.

TECHNICAL MECHANISM: COMPREHENSIVE INTERACTIVE ELEMENT DETECTION

This tool performs a multi-pass DOM traversal that identifies interactive elements through multiple detection strategies. It selects native form controls using comprehensive selectors: buttons (button, input[type="button/submit/reset"]), links (a[href]), role="button" elements, all input types except hidden, textarea, and select. It also detects elements with onclick attributes and elements with tabindex attributes (excluding tabindex="-1") as potential interactive elements. Each element is processed to extract its type, label (using for/id associations, parent label, placeholder, value, or text content), validation attributes, and computed styles. Color detection uses a temporary DOM element to validate that color values are actually valid colors before displaying swatches. The tool tracks disabled, readonly, and required states through both property checks and attribute presence. The scanning process uses batched processing with adaptive chunk sizing to maintain performance even on pages with thousands of interactive elements.

THE PANEL

The panel is fully draggable and remembers its position per website using GM_setValue. It automatically snaps to the nearest screen edge when released for a clean workspace. Click the collapse button to minimize it to a small floating bubble that takes minimal space. Click the bubble to expand the panel back. The panel can be resized by dragging any edge or corner. Press the Escape key to close the panel temporarily, and click the extension icon to reopen it.

PLEASE NOTE

This script requires the free BotGentz extension to function. As websites frequently update their structure and interactive patterns, scripts may need occasional updates to maintain compatibility. All data processing happens locally in your browser—no information about your pages, interactive elements, or browsing habits is ever transmitted or stored externally. The tool accesses page content solely for the purpose of interactive element detection and analysis, and does not modify or persist any page data.