https://github.com/stephencooper/async-angular-testing
Examples of testing async Angular applications
https://github.com/stephencooper/async-angular-testing
Last synced: about 1 year ago
JSON representation
Examples of testing async Angular applications
- Host: GitHub
- URL: https://github.com/stephencooper/async-angular-testing
- Owner: StephenCooper
- License: mit
- Created: 2022-04-20T14:08:32.000Z (about 4 years ago)
- Default Branch: main
- Last Pushed: 2022-04-25T16:00:04.000Z (about 4 years ago)
- Last Synced: 2025-03-11T18:52:47.446Z (over 1 year ago)
- Language: TypeScript
- Size: 432 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Understanding async tests in Angular
This repo contains a sample application that uses [AG Grid](ag-grid.com) to display a list of Olympic medal winners. This data can be filtered using the [Quick Filter Text](https://ag-grid.com/angular-data-grid/filter-quick/) feature as provided with the grid.
It complements the dev.to article [Understanding async tests in Angular](https://dev.to/angular/understanding-async-tests-in-angular-f8n)

The application tests that we can filter our data to a specific country of interest. Our test will validate that:
1. Our grid shows the full set of 1000 rows and our application displays the row count of 1000.
1. Upon entering the text "Germany" the grid should filter the rows to only show German athletes
3. Our application row count should update to 68 (the number of German athletes).
The reason for choosing this application is that it contains asynchronous code making it virtually impossible to test synchronously.
## Async Test Examples
The test code can be found in the [app.component.spec.ts](https://github.com/StephenCooper/async-angular-testing/blob/main/async-testing-app/src/app/app.component.spec.ts) file.
You can run the tests from the `async-testing-app` folder.
```ts
npm install
npm run test
```