composable-svelte-testing_skill

Overview

This skill documents testing patterns for Composable Svelte applications using the TestStore and provided mock utilities. It focuses on action-driven tests (send/receive), mocking dependencies, and testing composition strategies, reducers, and effects in isolation. Use these patterns to make tests fast, deterministic, and focused on business logic.

How this skill works

Create a TestStore with an initial state, reducer, and dependency overrides (api clients, clocks, websockets). Drive the store with send() to simulate user or external actions and receive() to assert actions produced by effects. Use finish() to ensure no pending actions remain and advanceTime() or mock clocks to control time-based behaviors.

When to use it

• Unit-testing reducers and effect interactions without rendering components
• Mocking APIs, clocks, WebSockets, or other external dependencies
• Testing debounced or delayed effects with deterministic time control
• Verifying composition strategies (scope, forEach) across nested reducers
• Ensuring effects dispatch correct follow-up actions and error handling

Best practices

• Test reducer logic and effects with TestStore instead of full component rendering
• Always call finish() to catch unexpected or leftover effect actions
• Mock external dependencies (API client, clock, WebSocket) to make tests deterministic
• Exercise error and edge cases (network failures, double submissions, invalid input)
• Use fake timers or MockClock when testing debounce, timeouts, or animations

Example use cases

• Load list flow: send load action, receive itemsLoaded or loadFailed, assert loading and error states
• Debounced search: change query, advanceTime to trigger effect, receive results and assert payload
• Form submission: validate fields locally, send submit, mock API, receive submissionSucceeded
• Navigation/modal flows: open destination, interact with presented actions, save and close
• Real-time features: simulate WebSocket open/message and assert connected state and messages