JavaScript tests with Jasmine

Question

1 Answer

Best answer

Now, we've seen what Jasmine is about now let's see how it works.

Download the latest version of Jasmine and unzip it.
We enter the Jasmine directory and run SpecRunner.html and we will see the following:

This file runs some tests in an example code, if we want to run the tests we can refresh the browser and they will run.
Now let's see an example of Jasmine's use:

First we create a simple function that contains a string as a return call.

function helloWorld () {
return "Hello world!";
}

We're pretty sure this works, right? But let's try this with Jasmine and see what she thinks of our code.

We save the created function in a file that we can call hello.js , open SpecRunner.html to make the inclusion.

<! - this code must go somewhere in <head> ... ->
<script type = "text / javascript" src = "src / hello.js"> </ script>

Now let's put Jasmine to work, create a file that contains the following code:

describe ("Hello world", function () {
it ("says hello", function () {
expect (helloWorld ()). toEqual ("Hello world!");
});
});

Let's see what contains this portion of code:

First we have the describe, which usually defines a component of our application, it can be a class, function or maybe something else. In this example, it refers to our helloWorld () function.

Let's continue in the same code and we will have the block of it () , this is called a specification. It is a function in Javascript that tells us what to expect or what our component should do. For each describe we can have any number of specifications.

In this case we are testing if the helloWorld () function returns "Hello world!" And we verify it with the toEqual () that is not more than a matcher , this will basically tell us if the content of the string is the same with what is being testing.

We save the code with the name hello.spec.js we place it in the directory where the specifications are contained and we include it in our SpecRunner.html

<! - this code must go somewhere in <head> ... ->
<script type = "text / javascript" src = "spec / hello.spec.js"> </ script>

Finally we run this specification in our browser and we will see an output like the one we have below:

We can also use another type of matcher, let's see:

describe ("Hello world", function () {
it ("says world", function () {
expect (helloWorld ()). toContain ("world");
});
});

Instead of expecting the value to be the same, this time we expect the content to be the word "world" regardless of the rest of the content, as long as the word "world" exists in this test Jasmine will interpret it as correct.
If we go to our function we can change what it says and put something different to "Hello World", Jasmine will see this as incorrect because it is not what she is waiting for and that is the main reason why we want Jasmine, so that we tell when something is not expected and this will help us to make our code clean and without errors.

answered Jun 24, 2019 by stackoverflow (3.5m points)
edited Jun 24, 2019

JavaScript tests with Jasmine

Your answer

1 Answer

Your comment on this answer:

Related questions