Testing forms
As we saw in Chapter 10, Collecting User Data with Forms, forms are integral to an Angular application. It is rare for an Angular application not to have at least one simple form, such as a search form. In this chapter, we will focus on reactive forms because they are easier to test than template-driven forms.
Consider the following search.component.ts
file:
import { Component } from '@angular/core';
import { FormGroup, FormControl, Validators, ReactiveFormsModule } from '@angular/forms';
@Component({
selector: 'app-search',
imports: [ReactiveFormsModule],
template: `
<form [formGroup]="searchForm" (ngSubmit)="search()">
<input type="text" formControlName="searchText">
<button type="submit" [disabled]="searchForm.invalid">Search</button>
</form>
`
})
export class SearchComponent {
searchForm = new FormGroup({
...