Testing Inputs, Outputs, and DOM
Assert on rendered output and events.
Testing the Component Contract
Components communicate through inputs (data in), outputs (events out), and the rendered DOM. Good component tests drive these three surfaces and verify the visible result, not internal implementation details.
Setting an Input
Assign to the component instance's input property, then call detectChanges() to re-render. With signal inputs you set via fixture.componentRef.setInput().
fixture.componentInstance.label = 'Save';
fixture.detectChanges();
// signal inputs:
fixture.componentRef.setInput('label', 'Save');
fixture.detectChanges();All lessons in this course
- TestBed and Component Fixtures
- Testing Inputs, Outputs, and DOM
- Mocking Services and Dependencies
- Testing Signals and Async Code