playwright-cli

Automate browser interactions using Playwright CLI commands and snapshot element targeting.

Updated May 14, 2026
One-click install
npx skills add https://github.com/chroniicallydiistracted/LorcanaChamp --skill playwright-cli-chroniicallydiistracted
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: playwright-cli
Source: https://github.com/chroniicallydiistracted/LorcanaChamp/tree/main/references/lorcana-simulator/.agents/skills/playwright-cli
Command: npx skills add https://github.com/chroniicallydiistracted/LorcanaChamp --skill playwright-cli-chroniicallydiistracted

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

It reduces the effort of manually interacting with web UIs by automating repeatable browser actions and capturing state for debugging.

Core Features & Use Cases

  • Browser automation commands: Open pages, navigate, click, fill, drag, and run DOM/evaluation code to drive workflows reliably.
  • Snapshots for UI targeting: Use snapshot element references to locate and interact with the correct controls during runs.
  • Debugging & test support: Record traces, screenshots, screenshots-as-output flows, and support running Playwright tests with non-interactive HTML reporting.
  • Use Case: Debug a flaky login test by replaying the exact sequence of clicks and fills while inspecting snapshots and tracing network/DOM state to identify what changed.

Quick Start

Open a page, take a snapshot, then click a button reference from the snapshot to verify the expected navigation or UI change.

Frequently Asked Questions about playwright-cli

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

FAQPage Schema
How do I automate browser interactions for web testing?

You can automate browser interactions by executing deterministic Playwright-driven commands to navigate, click, fill forms, and run DOM evaluations on web pages. This approach reliably drives workflows while capturing state for debugging UI regressions.

How does snapshot-driven element targeting work for UI testing?

Snapshot-driven element targeting captures a page snapshot and assigns references to interactive controls. You use these snapshot refs or selector locators to precisely identify and interact with the correct DOM elements during automated test runs.

Can I debug a flaky UI test by recording traces and inspecting network state?

Yes, you can debug flaky UI tests by starting and stopping Playwright tracing to record execution flows. This captures network mocking, DOM state, and screenshots to help identify what changed during the test sequence.

What's the best way to persist browser state like cookies during web automation?

To persist browser state during web automation, you can use Playwright commands to save and restore cookies and local storage. This allows your automated workflows to maintain authenticated sessions across multiple test runs without manual logins.

Do I need network mocking to run Playwright tests with non-interactive reporting?

Network mocking is supported through routing commands to intercept and modify network requests, but it is optional. You can generate non-interactive HTML reports from Playwright tests by running them headless and capturing trace and video recordings.

Why does my Playwright CLI session require snapshot refs instead of standard selectors?

A Playwright CLI session uses snapshot refs to provide deterministic element targeting during automation. While standard selector locators are also supported, snapshot refs ensure you interact with the exact UI controls captured at that specific execution moment.