angular-testing

Write unit and integration tests for Angular components using Vitest or Jasmine.

Updated Feb 4, 2026

Search Tags:#vitest #testing #angular #integration test #unit test #component testing #jasmine

Ready to run

npx skills add https://github.com/quantruong158/angular-chat-template --skill angular-testing-quantruong158

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: angular-testing
Source: https://github.com/quantruong158/angular-chat-template/tree/main/.opencode/skills/angular-testing
Command: npx skills add https://github.com/quantruong158/angular-chat-template --skill angular-testing-quantruong158

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill helps developers write robust unit and integration tests for Angular applications, ensuring code quality and preventing regressions, especially with modern features like signals and OnPush change detection.

Core Features & Use Cases

Vitest/Jasmine Integration: Write tests using either Vitest (recommended) or Jasmine.
Signal & OnPush Testing: Specifically targets testing components that utilize Angular Signals and OnPush change detection.
Dependency Mocking: Provides clear examples for mocking services and dependencies.
HTTP Request Mocking: Demonstrates how to effectively mock HTTP interactions.
Use Case: You've refactored a component to use signals and need to ensure its behavior remains correct under various conditions, including mocked API responses.

Quick Start

Use the angular-testing skill to write a unit test for an Angular component that uses signals.

Frequently Asked Questions about angular-testing

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

FAQPage Schema

How do I unit test Angular components that use signals and OnPush change detection?▼

To unit test Angular components using signals and OnPush change detection, you can utilize testing frameworks like Vitest or Jasmine to verify component behavior, update signal values, and assert DOM changes triggered by change detection cycles.

What is the best way to mock HTTP requests and dependency injection in Angular integration tests?▼

The best way to mock HTTP requests and dependency injection in Angular integration tests is by providing mock services and intercepting HTTP interactions, allowing you to isolate components and validate behavior against controlled API responses using Vitest or Jasmine.

Can I use Vitest instead of Jasmine for Angular component testing?▼

Yes, you can use Vitest instead of Jasmine for Angular component testing. Vitest is recommended for writing modern unit and integration tests, offering a fast environment to validate services, directives, pipes, and component harnesses.

How do I test component inputs and outputs in Angular?▼

To test component inputs and outputs in Angular, you can write unit tests that mock dependencies and explicitly set component inputs while subscribing to output emitters, verifying the component's interaction and event propagation using Vitest or Jasmine.

Does Angular testing support router testing and form validation patterns?▼

Yes, Angular testing supports advanced patterns like router testing and form validation. You can write integration tests to verify navigation logic and validate form input behavior using Vitest or Jasmine alongside component harnesses.

Why are my Angular unit tests failing after refactoring to use signals?▼

Angular unit tests may fail after refactoring to use signals if change detection is not properly triggered. Testing with OnPush change detection requires specific handling of signal updates to ensure the DOM reflects the expected state during test execution.