Angular CLI - ng test Command

This chapter explains the syntax, argument and options of ng test command along with an example.

Syntax

The syntax for ng test command is as follows −


ng test <project> [options]
ng t <project> [options]

ng test run the unit test cases on angular app code.

Arguments

The argument for ng test command is as follows −

Sr.No.	Argument & Syntax	Description
1	<project>	The name of the project to test.

Options

Options are optional parameters.

Sr.No.	Option & Syntax	Description
1	--browsers=browsers	Override which browsers tests are run against.
2	--codeCoverage=true\|false	Output a code coverage report. Default: false
3	--codeCoverageExclude	Globs to exclude from code coverage.
4	--configuration=configuration	A named build target, as specified in the "configurations" section of angular.json. Each named target is accompanied by a configuration of option defaults for that target. Setting this exppcitly overrides the "--prod" flag Apases: -c
5	--help=true\|false\|json\|JSON	Shows a help message for this command in the console. Default: false
6	--include	Globs of files to include, relative to workspace or project root. There are 2 special cases − when a path to directory is provided, all spec files ending ".spec.@(ts\|tsx)" will be included. when a path to a file is provided, and a matching spec file exists it will be included instead.
7	--karmaConfig=karmaConfig	The name of the Karma configuration file.
8	--main=main	The name of the main entry-point file.
9	--poll	Enable and define the file watching poll time period in milpseconds.
10	--polyfills=polyfills	The name of the polyfills file.
11	--preserveSympnks=true\|false	Do not use the real path when resolving modules. Default: false
12	--prod=true\|false	Shorthand for "--configuration=production". When true, sets the build configuration to the production target. By default, the production target is set up in the workspace configuration such that all builds make use of bundpng, pmited tree-shaking, and also pmited dead code epmination.
13	--progress=true\|false	Log progress to the console while building.
13	--progress=true\|false	Log progress to the console while building.
14	--reporters	Karma reporters to use. Directly passed to the karma runner.
15	--sourceMap=true\|false	Output sourcemaps. Default: true
16	--tsConfig=tsConfig	The name of the TypeScript configuration file.
17	--watch=true\|false	Run build when files change.
18	--webWorkerTsConfig=webWorkerTsConfig	TypeScript configuration for Web Worker modules.

First move to an angular project updated using ng build command.The pnk for this chapter is

Now run the test command.

Example

An example for ng test command is given below −


>Node>TutorialsPoint> ng test
...
WARN:   app-goals  is not a known element:
1. If  app-goals  is an Angular component, then verify that it is part of this module.
2. If  app-goals  is a Web Component then add  CUSTOM_ELEMENTS_SCHEMA  to the  @NgModule.schemas  of this component to suppress this message. 
Chrome 83.0.4103 (Windows 7.0.0): Executed 0 of 4 SUCCESS (0 secs / 0 secs)
...
AppComponent should render title FAILED
   TypeError: Cannot read property  textContent  of null
      at <Jasmine>
      at UserContext.<anonymous> (http://localhost:9876/_karma_webpack_/src/app/app.component.spec.ts:33:51)
            ...
Chrome 83.0.4103 (Windows 7.0.0): Executed 1 of 4 (1 FAILED) (0 secs / 0.203 secs)
...
Chrome 83.0.4103 (Windows 7.0.0): Executed 2 of 4 (1 FAILED) (0 secs / 0.221 secs)
...
Chrome 83.0.4103 (Windows 7.0.0): Executed 4 of 4 (1 FAILED) (0 secs / 0.244 sec
Chrome 83.0.4103 (Windows 7.0.0): Executed 4 of 4 (1 FAILED) (0.282 secs / 0.244
 secs)
TOTAL: 1 FAILED, 3 SUCCESS

Now to fix failures update the app.component.spec.ts

app.component.spec.ts


import { TestBed, async } from  @angular/core/testing ;
import { RouterTestingModule } from  @angular/router/testing ;
import { AppComponent } from  ./app.component ;

describe( AppComponent , () => {
   beforeEach(async(() => {
      TestBed.configureTestingModule({
         imports: [
            RouterTestingModule
         ],
         declarations: [
            AppComponent
         ],
      }).compileComponents();
   }));

   it( should create the app , () => {
      const fixture = TestBed.createComponent(AppComponent);
      const app = fixture.componentInstance;
      expect(app).toBeTruthy();
   });
});

Now run the test command.

Example

An example is given below −


>Node>TutorialsPoint> ng test
...
WARN:   app-goals  is not a known element:
1. If  app-goals  is an Angular component, then verify that it is part of this m
odule.
2. If  app-goals  is a Web Component then add  CUSTOM_ELEMENTS_SCHEMA  to the  @
NgModule.schemas  of this component to suppress this message. 
Chrome 83.0.4103 (Windows 7.0.0): Executed 1 of 2 SUCCESS (0 secs / 0.053 secs)
...
Chrome 83.0.4103 (Windows 7.0.0): Executed 2 of 2 SUCCESS (0.097 secs / 0.073 se
cs)
TOTAL: 2 SUCCESS

ng test also opens the browser and displays the test status.

Angular CLI - ng test Command

Syntax

Arguments

Options

Example

Example

友情链接