write-unit-tests

Write Vitest unit and integration tests for the tldraw SDK.

2|Updated May 20, 2026
One-click install
npx skills add https://github.com/Dianshu-Liao/SkilLGuard --skill write-unit-tests-dianshu-liao
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: write-unit-tests
Source: https://github.com/Dianshu-Liao/SkilLGuard/tree/main/data/skills/write-unit-tests
Command: npx skills add https://github.com/Dianshu-Liao/SkilLGuard --skill write-unit-tests-dianshu-liao

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Writing and maintaining consistent unit and integration tests for the tldraw SDK is time-consuming and easy to get wrong, especially when you need correct Vitest patterns and reliable editor test setup.

Core Features & Use Cases

  • Test file organization: Choose the right test location (alongside source files for unit tests, under src/test for integration tests, and alongside shape/tool implementations for targeted tests).
  • Correct test harness selection: Use TestEditor for integration-style flows that include default shapes/tools, and use Editor when you need custom configurations.
  • Common authoring patterns: Apply practical test utilities for pointer/keyboard simulation, state assertions, shape matching, undo/redo checks, fake timers, and vi.spyOn mocking with proper mockRestore cleanup.

Quick Start

Use the write-unit-tests skill to help you add a Vitest unit test for a failing behavior by following the recommended test location, editor setup (TestEditor vs Editor), and assertion style described in this guide.

Frequently Asked Questions about write-unit-tests

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

FAQPage Schema
How do I write Vitest unit tests for tldraw editor behavior?

To write Vitest unit tests for tldraw editor behavior, place test files alongside source files and use the Editor class for custom configurations or TestEditor for default shapes and tools. This ensures correct editor automation and reliable state assertions.

When should I use TestEditor instead of Editor in tldraw integration tests?

Use TestEditor for tldraw integration tests when you need integration-style flows that include default shapes and tools. Use Editor when you require custom configurations, ensuring your Vitest tests target the correct editor automation scope.

What is the correct file location for tldraw unit and integration tests?

The correct file location for tldraw unit tests is alongside the source files, while integration tests belong under the src/test directory. Targeted shape or tool tests should be placed alongside their respective implementations for proper organization.

How do I mock functions and use fake timers in Vitest for tldraw?

To mock functions and use fake timers in Vitest for tldraw, apply vi.spyOn for mocking and ensure proper mockRestore cleanup. Use built-in test utilities for fake timers, pointer simulation, and keyboard automation to validate editor behavior safely.

Does tldraw testing support jest-style assertions in Vitest?

Yes, tldraw testing supports jest-style assertions within Vitest. You can apply practical test utilities for state assertions, shape matching, and undo/redo checks using familiar jest-style assertion patterns alongside Vitest.