Delve into Angular test skills with Jasmine. Gain insights into mocking HTTP requests, testing forms, and writing effective unit tests to build reliable applications and maintain them long-term.

angular.tar.gz

CHROME_BIN

angular2

angular-parallel

angular-coverage

angular-coverage-copy

Jasmine is a popular framework used to test JavaScript and Angular applications. With the help of Jasmine, writing effective unit tests is quite easy and helps in building more reliable applications. 

The purpose of this course is to teach you how to read and write Jasmine unit tests. This course will focus on Angular test skills, including the ability to mock HTTP requests and test forms. Moreover, you will learn how to build real-world applications using Jasmine’s advanced features.

As a result of completing this course, you will be able to read existing unit tests, write your own tests, and be able to write better applications and the skills to maintain them for years to come.

Angular Testing with Jasmine

# Testing an Angular component

Let's take a look at the files created when we generate a new component using the Angular CLI. For example, we could use the `generate` command to create an `ArticlesIndex` component:

When Angular generates the component, it creates four files:

articles-index.component.html
articles-index.component.spec.ts
articles-index.component.ts
articles-index.component.css

Angular generates a basic test for us in `articles-index.component.spec.ts`.
At the end of the file, there is an example test that Angular has written for us. The `toBeTruthy` method tests that our result is `true` when interpreted as a boolean. All values are considered to be **truthy** except for the following **falsy** values: `false`, `0`, `-0`, `""`, `null`, `NAN`, and `undefined`. So, in this case, our `component` variable will be truthy if it was created successfully.

it('should create', () => {
  expect(component).toBeTruthy();
});

Try running your first Angular component test in the code widget below:

React

Dart

GoJS React

Typescript React

Vue.js

Remember that our goal in unit testing is to isolate the component or part of the system that we want to test. In this case, Angular provides us with a tool called `TestBed`, which we can use to do just that. `TestBed` lets us mount the component in a controlled environment. Instead of running the whole application, we fire up the component we are testing in isolation. Let's take a look at the first `beforeEach` block:

Learn how to test a basic Angular component.

Introduction to the Course

Getting Started with Jasmine

Assessment: Getting Started with Jasmine

Testing Angular Applications

Assessment: Testing Angular Applications

Advanced Topics

Assessment: Advanced Topics

Jasmine Deep Dive

Conclusion

Appendix

Write a Unit Test

Testing an Angular component