Categories
Testing

Jasmine — First Test Suite

Spread the love

Testing is an important part of JavaScript.

In this article, we’ll look at how to create simple tests with Jasmine.

The First Test

We can create our first test by creating a file in the spec folder.

The file should end with Spec.js .

Then in it, we can write:

describe("A suite", function() {
  it("should always pass", function() {
    expect(true).toBe(true);
  });
});

describe is a function to describe our test suite.

it is a function that runs a test.

The string has the description.

expect lets us check if a value is a value we expect.

This should always pass since true is always the same as true .

Then we can run that with npx jasmine .

The names will help us find the tests in a large test suite.

Specs are defined by calling the global Jasmine function/

It takes a string like, drscribe and it .

The string is the title of the spec.

Matchers

A matcher implements a boolean comparison between the actual value and the expected value.

It’s used for reporting to Jasmine if the expectation is true or false .

Then Jasmine can determine if the test passed or failed.

We have the toBe matcher in the example earlier to check if the value is the given value.

Setup and Teardown

To keep our test code from having repeated code, we can add setup and teardown functions.

We can pass in a callback to the beforeEach function to run code before each test.

And we can do the same with the afterEach function to run the code after each test.

beforeAll lets us run some code before running the suite.

And afterAll lets us run some code after running the suite.

For instance, we can write:

describe("A suite", function () {
  let foo = 0;

  beforeEach(function () {
    foo += 1;
  });

  afterEach(function () {
    foo = 0;
  });

  it("should set foo to 1", function () {
    expect(foo).toBe(1);
  });
});

to add the beforeEach and afterEach callbacks to run the code after each test.

We can do the same with beforeAll and afterAll :

describe("A suite", function () {
  let foo = 0;

  beforeAll(function () {
    foo = 1;
  });

  afterAll(function () {
    foo = 0;
  });

  it("should set foo to 1", function () {
    expect(foo).toBe(1);
  });
});

Using this

We can share variables between different callbacks with this .

this is accessible if we use traditional functions.

For instance, we can write:

describe("A suite", function () {
  beforeEach(function () {
    this.foo = 0;
  });

  it("can use this in foo", function () {
    expect(this.foo).toEqual(0);
    this.bar = "foobar";
  });

  it("prevents test pollution by having an empty this created for  the next spec", function () {
    expect(this.foo).toEqual(0);
    expect(this.bar).toBe(undefined);
  });
});

We have this.foo , which we set in the beforeEach callback.

Then it’ll be accessible within the specs.

However, if we set a new this value in a spec, it won’t be available to the other specs.

This prevents us from having tests that are dependent on each other.

If we have dependencies, then it’ll be a headache to sort them out.

Conclusion

Creating tests is simple with Jasmine.

We can eliminate repetition by using various hooks.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *