Verified:GitHub

sdcorejs-testing-integration-angular-portal

Write Angular Portal integration tests validating DI wiring and mocked HTTP interactions.

2|Updated Apr 18, 2026

Search Tags:#integration testing #angular #ng-mocks #testbed #workflow actions #routertestingharness #httpclienttestingmodule

Ready to run

npx skills add https://github.com/sdcorejs/sdcorejs-agent --skill sdcorejs-testing-integration-angular-portal

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: sdcorejs-testing-integration-angular-portal
Source: https://github.com/sdcorejs/sdcorejs-agent/tree/main/plugin/skills/sdcorejs-testing-integration-angular-portal
Command: npx skills add https://github.com/sdcorejs/sdcorejs-agent --skill sdcorejs-testing-integration-angular-portal

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Prevents Angular Portal integration regressions by validating real DI, component lifecycle, router navigation, and mocked HTTP boundaries in a single integration spec rather than isolated unit tests.

Core Features & Use Cases

TestBed-driven collaborator integration: Render a component with its real service/DI wiring while mocking the network via HttpClientTestingModule.
RouterTestingHarness navigation assertions: Verify form submit flows and route changes using a real router harness.
Core UI stubbing with ng-mocks: Avoid heavy @sd-angular/core imports while still asserting DOM behavior.
Workflow action coverage: Test permission-allowed and permission-denied action paths and the resulting API calls + UI updates.

Quick Start

Use the skill to create an integration spec for ProductListComponent and ProductCreateComponent, mocking HTTP and asserting DOM rendering plus navigation after submit.

Frequently Asked Questions about sdcorejs-testing-integration-angular-portal

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

FAQPage Schema

What is the best way to test router navigation flows in Angular integration tests?▼

Workflow action testing uses TestBed integration specs to validate permission-allowed and permission-denied action paths, asserting resulting API calls via HttpTestingController and verifying subsequent UI state updates after whenStable().

Does ng-mocks work with @sd-angular/core components for Angular integration testing?▼

ng-mocks stubs @sd-angular/core components in Angular integration tests to avoid heavy library imports while still rendering the DOM, allowing assertions on component-service-router collaborators without pulling in full UI dependencies.

How do I mock HTTP requests in Angular TestBed integration specs?▼

Mock HTTP requests in Angular TestBed specs by configuring HttpClientTestingModule and injecting HttpTestingController to stub network responses, then call httpMock.verify() to ensure all expected HTTP interactions are matched.

Why do my Angular integration tests fail with async component lifecycle and HTTP assertion errors?▼

Angular integration tests fail when async operations are unresolved, requiring whenStable() to wait for component lifecycle and router navigation to settle, followed by httpMock.verify() to confirm no pending HTTP requests remain.