5 ways to run a single test spec file in Angular app

5 ways to run a single test spec file in Angular app

In this tutorial, You learn different ways to run a single test component file in an angular application. This also includes running a single spec file from jasmine and mocha with karma runner.

Usually, an Angular application created with CLI has a test.js file located in the src folder This file contains the below line of code which configures to include test files while running the ng test or ng t command.

const context = require.context("./", true, /\.spec\.ts$/);

The first parameter is all files of an angular project the third parameter includes all spec files

Running ng test command executes all test spec files of an angular project.

ng test
(or)
ng t

if you have a my.component.spec.ts that you want to run a single component test file for debugging and testing it.

There are multiple ways we can do

configure test.js to execute a single spec file

Let’s configure the component spec file in test.js

const context = require.context("./", true, /my.component\.spec\.ts$/);

Running the ng test command, execute the test cases in the my.component.spec.ts file.

if you want to run all test spec files inside a folder, you can configure them like this

const context = require.context("./service", true, /my.component\.spec\.ts$/);

this will run all spec files under the service folder

command line to run single test spec file

Angular CLI provides the --include option to include a regular expression for including single or multiple files/folders.


ng test --include=**/my.component.spec.ts // single file
ng test --include'**/service/*.spec.ts // multiple files inside a folder

or

// single file
npm run test -- --include src/app/my.component.spec.ts

// all files inside the service folder
npm run test -- --include src/app/service

npm script to single test spec file

In package.json, commands configure in the scripts tag

{
  "scripts": {
    "singletest": "ng test --include=**/my.component.spec.ts"
  }
}

It runs with the `npm run single test command

jasmine and karma allow executing one component test spec

normally we have a description for group of tests and it has a single test method for writing unit testing in angular

describe('MyComponent', () => {
  it('should create', () => {
    //test for undefined
  }
}

Jasmine provides fdescribe and fit allowing you to focus specific test cases to run it and skipped non-focused test case execution.

fdescribe('MyComponent', () => {
  fit('should create', () => {
    //test for undefined
  }
}

Please note that use describe for jasmine version <2.1 version, and use fdescribe for >2.1 version.

How to run a single component spec file with mocha and karma

mocha and karma allows only method to run single and multiple tests

  • describe.only- Allows to run a group of tests
  • it.only - Allows running a single test case
describe.only('MyComponent', () => {
  it.only('should create', () => {
    //test for undefined
  }
}

Conclusion

You learned multiple ways to run a single test or group of tests inside a folder.