Skip to content

Contact sales

By filling out this form and clicking submit, you acknowledge our privacy policy.

Optionally Generating Unit Tests Using the Angular CLI

Aug 20, 2020 • 4 Minute Read

Introduction

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.

Getting Started Using the Angular CLI

The Angular CLI can be downloaded onto your machine by running the following command using NPM:

      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:

      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.

      import { async, ComponentFixture, TestBed } from '@angular/core/testing';

import { MyComponent } from './my.component';

describe('MyComponent', () => {
  let component: MyComponent;
  let fixture: ComponentFixture<MyComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ MyComponent ]
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(MyComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

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

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.

Opting Out of Unit Test Generation

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.

Conclusion

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.