control-ui-e2e

Automate browser-based UI end-to-end tests for the OpenClaw Control UI with Vitest and Playwright.

7|12|Updated Mar 10, 2026
One-click install
npx skills add https://github.com/borealBytes/my-farm-advisor --skill control-ui-e2e-borealbytes
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: control-ui-e2e
Source: https://github.com/borealBytes/my-farm-advisor/tree/main/.agents/skills/control-ui-e2e
Command: npx skills add https://github.com/borealBytes/my-farm-advisor --skill control-ui-e2e-borealbytes

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

OpenClaw Control UI changes require reliable browser-based verification; without deterministic E2E testing, QA is slow and error-prone.

Core Features & Use Cases

  • Provides deterministic Vitest + Playwright-based UI end-to-end tests.
  • Supports mocked Gateway WebSocket flows and agent-verifiable browser proof.
  • Useful when testing Control UI changes, new workflows, or UI regressions in a controlled environment.

Quick Start

Run the Vitest + Playwright E2E suite against the mocked Control UI gateway.

Frequently Asked Questions about control-ui-e2e

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

FAQPage Schema
How do I run deterministic UI E2E tests with Vitest and Playwright?

Deterministic UI E2E tests run by automating browser-based verification using Vitest and Playwright against a mocked Gateway, validating boot, routing, WebSocket handshakes, and visible UI behavior across controlled scenarios.

What is the purpose of mocking Gateway data in browser-based UI testing?

Mocking Gateway data in UI testing provides controlled, deterministic scenarios for verifying browser behavior, replacing live API requests and WebSocket flows to eliminate network flakiness and ensure reliable end-to-end test execution.

Can I use Playwright to test Control UI routing and WebSocket handshakes?

Yes, Playwright tests Control UI routing and Gateway WebSocket handshakes by automating browser interactions against mocked data, capturing agent-verifiable proof of API requests and visible UI behavior without a live backend.

Do I need a live Gateway connection for Playwright end-to-end testing?

No, you do not need a live Gateway connection. E2E testing uses a mocked Gateway to simulate WebSocket flows and API requests, ensuring deterministic test outcomes when verifying Control UI changes and regressions.

What's the best way to prevent flaky results in Vitest Playwright E2E suites?

The best way to prevent flaky results is using deterministic mock Gateway scenarios. Mocking WebSocket flows and API requests isolates browser-based UI tests from network variability, ensuring reliable and repeatable end-to-end verification.

Where should Vitest and Playwright E2E test files be placed for Control UI?

Vitest and Playwright E2E test files should reside under the ui/src directory. Test execution and patterns are guided by the commands and configurations specified in the project's SKILL.md file.