JasmineJS Writing Text & Execution - JasmineJS

What is JasmineJS - Writing Text & Execution?

In this chapter, we will create a hello world app which test our “helloworld.js” file. Before developing the hello world app, first refer the previous chapter and make sure that your environment is ready for testing using Jasmine.

Step 1 Create a Web application in your IDE

Create a Web application in your IDE

To develop our hello world app in Jasmine we will use NetBeans8.1. In NetBeans, go to File → New Project → Html5/JS application and create a project. After creating the project, the project directory should appear as the following screenshot. We will give the project name as Jasmine_Demo.

Step 2 − Include the Jasmine lib file into the application

Once the demo project is created then you need to include the unzip folder from Jasmine library in the Unit Tests folder of the application created. After adding all the library files to our application folder, the structure of our project will appear as shown in the following screenshot.

Include the Jasmine lib file into the application

Files mentioned under spec and src folders are demo files which are provided by the Jasmine team. To create our own test file and test case we need to delete spec and src folders first. While deleting those JavaScript file, we need to delete the reference of those files inside our output html file that is SpecRunner.html.

Screenshot of SpecRunner.html file where the reference of different JavaScript files inside spec and src will be deleted is as follows

Screenshot of SpecRunner

Step 3 − Create a JavaScript file

In this step, we need to create a JavaScript file named helloworld.js under src folder. This is the file which will be tested by Jasmine. After completion of creating a JavaScript file add the following code inside the file.

Step 4 − Create a test case

Now in this step, another JavaScript file will be created which contain the test case for the JavaScript file mentioned above. After creating above file, create a JavaScript file under “Spec” folder and name it as “HelloWorldsSpec.js”. Now add the following lines of code into this js file.

Step 5 − Add reference to the output file

Our own file and the corresponding test case is successfully created which is to be tested . We had keed it under two different folders. Here, we will modify “SpecRunner.html” to include the reference of these two newly created file.

Step 6 − Execute by running SpecRunner.html

This is the last step in development of our application . Run SpecRunner.html in any of your favorite browser. Result will be same as shown in the following screen shot. The green screen indicates success, whereas red indicates failure in test case.

Execute by running SpecRunner

Step 7 − Understand the failure case

Till now we have observed the success test case of the hello world application. Now let us see failure test case. To implement a failure case we need to write a failure test case. For that, we are going to modify the helloworld.js file using the following code.

The above code will fail definitely because the output of our spec file is not getting the expected string helloworld(). The following screenshot of the specRunner.html file depicts that there is an error with its red indicator.

Execute by running SpecRunner Output

All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd DMCA.com Protection Status

JasmineJS Topics