drive-ui

Drives the Insight web UI in a real browser to verify behavior and capture defect evidence.

10|9|Updated May 22, 2026
One-click install
npx skills add https://github.com/constructorfabric/insight --skill drive-ui-constructorfabric
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: drive-ui
Source: https://github.com/constructorfabric/insight/tree/main/.claude/skills/drive-ui
Command: npx skills add https://github.com/constructorfabric/insight --skill drive-ui-constructorfabric

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Verifying the Insight dashboard in a live browser fails in expensive ways: remote stands behind Microsoft Entra passkeys cannot be logged into from a freshly launched browser, seeded test stands break when opened on the wrong origin, and negative observations are easily manufactured by cached pages or virtualized lists. This Skill provides the correct acquisition, verification, and evidence-capture workflow for every stand type. ## Core Features & Use Cases - Authenticated browser acquisition: Chooses the right move per stand — plain playwright-cli open for local Keycloak compose, --persistent sessions for kind and remote stands, and CDP or extension attach to the user's own Chrome for passkey-protected Entra stands. - False-negative prevention: Rules out page cache, selector scope, list virtualization, and premature waits before accepting any negative observation as a real defect. - Actionable evidence capture: Produces tight element screenshots, contrast shots, page snapshots, console logs, and API request/response captures, with guidance on scrubbing personal data and mocking hostile responses via route interception. - Use Case: A user asks to check whether a chart on the IC page is still broken on a shared remote stand. The Skill attaches to the user's Chrome session, navigates to the route, captures the widget screenshot plus the underlying API response, and hands the evidence to the bug-filing workflow. ## Quick Start Ask the assistant to open the Insight stand in a browser and verify whether a specific page or chart renders correctly, capturing screenshots as evidence.

Frequently Asked Questions about drive-ui

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I test a web UI behind a passkey login with Playwright?

Passkey logins cannot be completed in a freshly launched browser because the credential is bound to the user's real Chrome profile. Attach to the user's running Chrome via CDP or a browser extension instead, then target that named session for all subsequent commands.

How do I capture evidence for a UI bug report?

Capture three artifacts: a tight screenshot of the offending element, a contrast shot of correct behavior, and a full page snapshot. Add console output and the failing API request and response so the reader can see both the displayed value and what the backend returned.

Why does Playwright show no network request when I click a control?

The SPA caches query results, so a control whose answer is already cached fires no request and re-renders nothing. Reproduce the behavior from a fresh page load on the shortest path to the symptom before concluding the control is broken.

Can I test XSS payloads against a shared staging environment?

Yes, by mocking the API response with route interception rather than writing payload content into the shared database. This puts hostile or extreme content through the real render path without leaving data in a stand colleagues use.

Why does the login page loop when I open the frontend port directly?

The published frontend nginx serves only the SPA with no /api or /auth locations, so auth calls fall through to index.html and the login chain loops. Open the gateway origin instead, which fronts the SPA, auth, and API together.