Testable Angular Forms

on YouTube ↗01h 16m

" summary

Repository is an Angular 14 Reactive Forms workshop that actually builds a contact form, focuses tests on the email control, and shows concrete assertions: use patchValue and detectChanges to exercise the FormGroup, inspect validity with fixture.componentInstance.form.get('email'), and target DOM nodes with form control name selectors or fixture.debugElement.querySelector. Tests parameterize valid/invalid cases, check touched state to reveal error messages, and run Lighthouse or Accessibility Insights to verify labels, tab order, and ARIA fixes.

AI-written summary · about

" chapters (10)

1. 0:00Angular forms testing intro
2. 2:59Why unit test Angular forms
3. 10:13Test environment setup
4. 14:24First unit test: email required
5. 25:50Invalid email validation
6. 32:06Parameterized email tests
7. 45:47DOM field presence
8. 51:54Error messages for invalid inputs
9. 1:04:28Accessibility in form testing
10. 1:15:51Summary

" related talks

• 43mAngular Reactive Forms - Developing Forms and Validation with AngularFabian Gosebrink · Voxxed Days Zürich 2022
• 48mHandling Angular Forms Without Losing Your SanityJennifer Wadella · NDC Sydney 2019
• 21mComparing Angular FormsAlex Lakatos · NG-MY 2019
• 20mLet’s Build A Form Around ItSani Yusuf · NGConf 2018
• 35mLet's Build a Form Around ItSani Yusuf · ComponentsConf 2019
• 28mHandling Angular Forms Without Losing Your SanityJennifer Wadella · NG-DE Conference 2019
• 35mIndiana Jones and the Hidden Secrets of the Forms APIJennifer Wadella · DevReach 2023
• 36mUnleash the Power of Angular Reactive FormNir Kaufman · AngularUP 2017