write-e2e-tests

Author Playwright-based end-to-end tests for tldraw UI interactions.

49.7k|3.4k|Updated May 9, 2021
One-click install
npx skills add https://github.com/tldraw/tldraw --skill write-e2e-tests
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: write-e2e-tests
Source: https://github.com/tldraw/tldraw/tree/main/.claude/skills/write-e2e-tests
Command: npx skills add https://github.com/tldraw/tldraw --skill write-e2e-tests

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps development teams create reliable Playwright-based end-to-end tests for tldraw, improving UI confidence and regression coverage.

Core Features & Use Cases

  • Test File Structure: Organizes tests under apps/examples/e2e/ and apps/dotcom/client/e2e/ with fixtures, page objects, tests, and shared utilities.
  • Test authoring patterns: Demonstrates standard test structure, setup patterns, and data-driven examples to cover common UI interactions.
  • Use Case: When adding UI or interaction coverage to an SDK or web app, use this Skill to scaffold consistent E2E tests and verification flows.

Quick Start

Start by reviewing existing e2e examples in apps/examples/e2e/, then create a new test spec under apps/examples/e2e/tests/ using the pattern test.describe/ test('name', ...) and place supporting fixtures under apps/examples/e2e/fixtures.

Frequently Asked Questions about write-e2e-tests

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

FAQPage Schema
How do I write Playwright E2E tests for tldraw UI interactions?

To write Playwright E2E tests for tldraw, you create test specs under apps/examples/e2e/tests/ using the test.describe and test('name', ...) patterns, placing supporting fixtures in the corresponding e2e/fixtures directory to ensure stable browser automation coverage.

What is the best way to structure scalable Playwright fixtures and page objects for SDK examples?

The best way to structure scalable Playwright fixtures and page objects is by organizing test files under dedicated e2e/ directories, separating fixtures, page objects, tests, and shared utilities to maintain clear setup patterns and reliable regression coverage.

Can I use this Skill to scaffold E2E tests for both SDK examples and web app deployments?

Yes, you can use this Skill to scaffold consistent E2E tests for both the apps/examples/e2e/ SDK contexts and the apps/dotcom/client/e2e/ web deployment contexts, ensuring structured test layouts and clear setup patterns across different tldraw environments.

Do I need existing test examples before adding UI or interaction coverage to a tldraw app?

You do not need existing examples strictly, but reviewing existing e2e examples in apps/examples/e2e/ is recommended before creating a new test spec to understand standard setup patterns, data-driven examples, and reusable fixture layouts.

Why does my tldraw browser automation test require reusable fixtures and shared utilities?

Reusable fixtures and shared utilities are required for tldraw browser automation tests to establish clear setup patterns, which ensures stable, scalable E2E coverage and improves UI confidence by reducing test flakiness during interactions.