validate-ui

Run end-to-end browser automation and codebase review to validate the Archon Web UI.

Updated May 13, 2026
One-click install
npx skills add https://github.com/cliffthelin/AXiomEngine --skill validate-ui-cliffthelin
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: validate-ui
Source: https://github.com/cliffthelin/AXiomEngine/tree/main/archon/.claude/skills/validate-ui
Command: npx skills add https://github.com/cliffthelin/AXiomEngine --skill validate-ui-cliffthelin

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps you confirm that the Archon Web UI works correctly for real users, covering UI/UX behavior, workflow orchestration visibility, streaming/SSE reliability, and core navigation flows.

Core Features & Use Cases

  • End-to-end UI validation: Run comprehensive browser automation against the full web interface, from the dashboard to chat, projects, workflows, and run logs.
  • Real-time correctness checks: Verify EventSource/SSE streaming, heartbeats, reconnection behavior, queue progression, and streaming UI state transitions.
  • Operational UI/UX audit: Produce a structured bug/UX report by combining browser test execution with targeted codebase review of critical UI and backend modules.

Quick Start

Run the validate-ui skill to start Archon locally, execute exhaustive browser automation against http://localhost:5173, and generate a detailed report of any bugs, UX issues, accessibility gaps, and performance problems.

Frequently Asked Questions about validate-ui

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

FAQPage Schema
How do I validate a React TypeScript UI for SSE streaming correctness and workflow orchestration?

End-to-end UI validation for SSE streaming requires running browser automation against the live interface to verify heartbeats, reconnection behavior, and queue progression. You then compare UI state transitions against backend endpoints to confirm real-time correctness and identify streaming errors.

What is e2e testing for workflow execution loops and stale cancel behavior?

E2e testing for workflow execution loops and stale cancel behavior involves executing scripted browser snapshots across navigation flows to capture the UI state during parallel steps. It validates that the frontend correctly renders artifacts and handles cancellation or stale states as workflows execute.

How do I perform a UX audit and codebase review for a dashboard and chat interface?

A UX audit and codebase review for a dashboard and chat interface combines browser test execution with targeted review of critical UI modules. This produces a structured bug report evaluating correctness, accessibility, performance, and error handling across the tested navigation flows.

Do I need to launch the backend and frontend locally to run end-to-end UI validation?

Yes, you need to launch both the backend and frontend locally to run end-to-end UI validation. The browser automation targets the local environment to test dashboard, chat, projects, and workflows, optionally seeding test data first to verify UI counts against backend endpoints.

Can I use browser automation to verify EventSource and SSE infrastructure reliability?

Yes, you can use agent-browser scripted snapshots to verify EventSource and SSE infrastructure reliability. The validation process checks streaming UI state transitions, heartbeats, and reconnection behavior to ensure the real-time infrastructure handles errors and connectivity drops correctly.

What is the best way to test tool cards and error handling in a chat interface?

The best way to test tool cards and error handling in a chat interface is through comprehensive browser automation combined with a focused codebase review. This approach validates UI rendering, streaming responses, and error states while generating a structured report of any UX gaps.