The Angular CLI is a powerful tool that aids in code generation and scaffolding for your Angular app. When it comes to unit testing, the Angular CLI gives you the power to optionally generate unit tests alongside scaffolded entities such as components and services. In this guide, you will learn how to use the unit test generation capabilities of the CLI to help you thoroughly, and easily, test your app.
The Angular CLI can be downloaded onto your machine by running the following command using NPM:
1 npm install -g @angular/cli
The Angular CLI is an abstraction layer that is powered under the hood by a library called Schematics. Through the power of Angular Schematics' scaffolding capabilities, the Angular CLI exposes a number of commands. You can generate a new Angular app by running the following:
1 ng new test-app
This command will create a new Angular app within your current directory that is named test-app
. By default, the Angular CLI will generate a single, root component for your app with a .spec.ts
file alongside. This is important to note. Every Angular CLI command that scaffolds out new code for you will also, by default, generate an accompanying unit test. This stands true for commands like ng generate service
or ng generate component
.
Below, you can see an example of a generated unit test for a component scaffolded out via running ng g c my
.
1import { async, ComponentFixture, TestBed } from '@angular/core/testing';
2
3import { MyComponent } from './my.component';
4
5describe('MyComponent', () => {
6 let component: MyComponent;
7 let fixture: ComponentFixture<MyComponent>;
8
9 beforeEach(async(() => {
10 TestBed.configureTestingModule({
11 declarations: [ MyComponent ]
12 })
13 .compileComponents();
14 }));
15
16 beforeEach(() => {
17 fixture = TestBed.createComponent(MyComponent);
18 component = fixture.componentInstance;
19 fixture.detectChanges();
20 });
21
22 it('should create', () => {
23 expect(component).toBeTruthy();
24 });
25});
As you can see from the above code, the CLI sets up the testing bed and component instantiation for you so that you can focus on creating the individual it
unit testing blocks that you need to create.
It is a best practice to include unit tests by default when generating a new component or service. But what if you need to opt out? It may be that you want to generate a helper service that you intend to use directly with an end-to-end test, or that you have your own custom testing solution. In either case, you need a way to opt out of unit test generation.
Opting out of unit test generation can easily be accomplished via adding the --skipTests
parameter to your scaffolding command. As an example, the following command will generate a new service without a unit test: ng g service --skipTests
.
In this guide, you have learned how unit test generation works with the Angular CLI. Without using any custom command line parameters, you now know that you can take full advantage of Angular's unit test scaffolding capability by default. You can now be confident when it comes to optionally generating unit tests via the CLI for components, services, pipes, guards, and other entities that work in tandem with the ng generate
command. For more information, you can always check out the relevant portion of the Angular documentation.