Angular Component Test Harnesses FTW

on YouTube ↗22m

" summary

Claims that using Angular CDK's test harnesses makes component unit tests simpler and more resilient, demonstrates built-in harnesses for Angular Material controls (available since Angular v12) and shows a custom harness for an app add comment component that is tested via TestbedHarnessEnvironment.loader and harness predicates. Examples use Karma unit tests, show the harness API (e.g. MatInputHarness setValue/getValue, locatorFor/locatorForAll), and report harness-based tests surviving the Angular v15 MDC changes.

AI-written summary · about

" chapters (6)

1. 0:00The challenge of UI testing
2. 2:34Understanding test harnesses
3. 4:49Harnesses in action
4. 8:46CDK testing API mechanics
5. 13:45Writing custom harnesses
6. 20:17Best practices and conclusion

" related talks

• 28mAngular Component Test Harnesses FTWAlisa Duncan · DevReach 2022
• 28mTesting with Component Harnesses for the WinAlain Chautard · Reliable Web Summit 2021
• 16mAngular components - unit testingTomasz Borowski · NG Poland 2018
• 56mAngular Unit Testing from the TrenchesJustin James · NDC Minnesota 2018
• 13mTesting Angular Components FundamentalsJesse Palmer · Assert(js) 2018
• 59mTechniques and practices for testing Angular 2Duncan Hunter, Adam Stephensen · NDC London 2017
• 52mAngular Testing: Do I Really Have to Do It?!Alessandro Giorgetti · Angular Day 2017
• 19mTesting Best Practices for Angular ApplicationsYi Qi · NGConf 2018