Testing
Cypress component testing works across frameworks. React gets the most coverage in tutorials, but Vue 3 and Angular both have first-class support. This guide covers the setup, idiomatic patterns, and real-world considerations for each. Vue 3 Component Testing Setup npm install --save-dev cypress npx cypress open Copy
Testing
Angular services are where most of the application's business logic lives. They're also easier to test than components — no DOM, no templates, just TypeScript classes that take inputs and produce outputs. This guide covers every pattern you'll need to test services properly. Testing a
Testing
Reactive forms are the preferred way to handle complex form logic in Angular. They're also well-suited to testing because the form model is a plain TypeScript object — you can set values, trigger validation, and inspect state without touching the DOM at all. This guide covers every pattern
Testing
Protractor reached end-of-life in 2023. If you're still running it, you're on borrowed time — unmaintained dependencies, no Chromium updates, and no support for modern Angular features. Playwright is the replacement worth betting on: faster, more reliable, and actively maintained by Microsoft. This guide covers
Testing
Angular's TestBed is the primary tool for unit testing components. It creates a mini Angular module in memory, compiles your component, and lets you interact with it the same way Angular's runtime would. This guide walks through every pattern you'll hit in real projects.
Test Automation
NgRx is the Redux-based state management library for Angular. Testing NgRx requires Angular's TestBed for dependency injection, along with NgRx's own testing utilities: provideMockStore, provideMockActions, and (optionally) jasmine-marbles for observable-based effects testing. Setup npm install @ngrx/store @ngrx/effects @ngrx/store-devtools npm
Angular
Angular Material's Component Test Harnesses provide a stable, semantic API for testing Material components without relying on CSS classes or internal DOM structure. Since Material 3 (M3) changed class names and element structure significantly from M2, harnesses are the only reliable way to test Material components across versions.
Angular
Angular 19 introduced two major reactive primitives: resource() for async data fetching tied to signals, and linkedSignal() for derived writable state. Both are in developer preview as of Angular 19.0. Testing them requires understanding their async lifecycle — resources go through idle, loading, loaded, error, and local states — and how
Angular
Angular 15 introduced provideHttpClient() as a functional alternative to HttpClientModule. Angular 18 completed the migration story with provideHttpClientTesting() — the functional equivalent of HttpClientTestingModule. This guide covers how to test HTTP requests, intercept calls, simulate errors, and mock responses in standalone Angular apps. Key Takeaways Replace HttpClientTestingModule with provideHttpClientTesting(). In standalone
Angular
Angular 17 introduced deferrable views — the @defer block that lazily loads components based on triggers like viewport intersection, idle time, user interaction, or explicit programmatic control. Testing deferrable views requires Angular's DeferBlockBehavior and getDeferBlocks() API to control when and how deferred blocks load. Key Takeaways Use DeferBlockBehavior.Manual
Angular
Angular standalone components (stable since Angular 15, default since Angular 17) remove NgModule from the component authoring model. Testing standalone components is simpler: you import the component directly into TestBed.configureTestingModule({ imports: [] }) instead of declaring it in a module. Dependencies go in the same imports array. Key Takeaways Import standalone
Angular
Angular Signals, introduced in Angular 17 and stabilized in Angular 18, replace RxJS-heavy state management with fine-grained reactivity. Testing signals requires understanding when Angular flushes effects, how computed values are lazy, and how to assert on DOM updates triggered by signal changes. This guide covers all of it.