Angular: Testing and Debugging

Introduction

• Angular: Testing and debugging
• What you should know
• Exercise files

1. Getting Started

• Application overview
• Installing project dependencies
• Installing Angular CLI

2. How Angular Reports Errors

• Error handling in Angular
• Understanding zones in Angular apps
• Add a new file using Angular CLI
• Writing a custom error handler class
• Changes for Angular v16

3. Common Syntax Errors

• Adding a local storage service
• Fixing dependency injection errors
• Getting and setting data in local storage
• Adding a custom Angular pipe
• Using regular expressions to find content
• Using a pipe to change HTML content
• Common pipe errors
• Understanding Angular decorators
• Challenge: Filter the array of users by locationId
• Solution: Filter the array of users by locationId

4. Common Async Errors

• Getting data using REST requests
• Updating data using REST requests
• Working with observables
• Catching errors from an observable

5. Unit Testing in Angular

• Testing overview
• Basic Karma configuration
• Testing services
• Fixing injection dependency errors
• Testing pipes
• Testing components
• Challenge: Custom test bed wrapper
• Solution: Custom test bed wrapper

6. End-to-End Testing in Angular

• Basic Protractor configuration
• End-to-end testing without page objects
• End-to-end testing with page objects
• Changes for Angular v12
• Challenge: Testing filter input
• Solution: Testing filter input

7. Static Code Linting in Angular

• Installing and running ESLint
• Basic ESLint configuration
• Fixing lint errors
• Installing EditorConfig
• Basic EditorConfig configuration

Conclusion

• Next steps