Book Image

AngularJS Testing Cookbook

By : Simon Bailey
Book Image

AngularJS Testing Cookbook

By: Simon Bailey

Overview of this book

<p>AngularJS stepped up to offer a comprehensive solution to frontend development with minimal dependencies and a clear set of objectives.</p> <p>This book follows the AngularJS philosophy and offers guidance on how to approach testing components that make up the AngularJS framework. At the start of the book, you will explore how to configure your system to run unit and end-to-end tests. Following this, you'll become familiar with fundamental principles on testing AngularJS with Jasmine. Then, you'll understand how spies can enable you to test your code with greater coverage and simplicity throughout your application. The final result is an AngularJS application that is tested with integrity, helping facilitate a cleaner and more reliable codebase.</p>
Table of Contents (16 chapters)
AngularJS Testing Cookbook
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Running tests using Karma


To save time and effort when manually running your tests, you can use a test runner. The recipe, Installing Karma, gets you ready to run tests with Karma. This recipe will introduce you to automatically run a Jasmine test with Karma (which you can visit at http://karma-runner.github.io/). You will learn how to set up a basic configuration file and automatically run your tests with Karma.

Getting ready

You can either implement this as an initial step to an existing project, or build upon the basic project created in the first recipe. You can do this as follows:

  1. Karma will need access to the angular.js and angular-mocks.js files, which can be downloaded from https://code.angularjs.org/1.2.28/. Ensure these are included in a lib/angular folder in your project root directory.

  2. Copy the cookbook.js file from the recipe Creating a basic AngularJS application, into the src directory.

  3. Finally, copy the cookbookSpec.js file from the Running a simple test using Jasmine recipe in this chapter, into a test directory.

How to do it…

Firstly, you need to create a Karma configuration file named karma.conf.js with the following code:

module.exports = function(config) {
  config.set({
    frameworks: ['jasmine'],
    files: [
        "lib/angular/angular.js",
        "lib/angular/angular-mocks.js",
        "src/cookbook.js",
        "test/cookbookSpec.js"
    ],
    autoWatch: true,
    browsers: ['Chrome']
  });
};

Once this has been created, you can run the following command:

karma start

As a result of this, you should see that Karma launches the Chrome browser and produces the following in the console window:

How it works…

Karma requires a configuration file for it to run our AngularJS application tests. Let's step through the configuration options:

  • frameworks: Framework adaptors that must be installed via the karma init process or manually, for example npm install karma-jasmine --save-dev.

  • files: These are the file patterns specifying applications and test files.

  • autoWatch: This option watches for changes to applications/test files and re-run tests.

  • browsers: These are the launchers that must be installed via the karma init process or manually, for example npm install karma-chrome-launcher --save-dev.

The angular.js file is a dependency for angular-mocks.js, therefore angular.js must be declared before angular-mocks.js.

For a more comprehensive list of configuration options, please refer to Karma's configuration file documents at http://karma-runner.github.io/0.12/config/configuration-file.html.

There's more…

Use a glob pattern for files, as opposed to declaring each file explicitly, by inserting the following code:

files: [
  "lib/angular/angular.js",
  "lib/angular/angular-mocks.js",
  "src/**/*.js",
  "test/**/*.js"
]

See also

  • The Installing Karma recipe in this chapter