Since the knowledge of JavaScript is essential for working with Protractor, in this chapter, let us understand the concepts of JavaScript testing in detail.
JavaScript Testing and Automation
JavaScript is the most popular dynamically typed and interpreted scripting language, but the most challenging task is to test the code. It is because, unlike other compiled languages like JAVA, and C++, there are no compilation steps in JavaScript that can help the tester to figure out errors. Besides, browser-based testing is very time-consuming; hence there is a necessity for tools that support automated testing for JavaScript.
Concepts of Automated Testing
It is always a good practice to write the test because it makes the code better; the issue with manual testing is that it is a bit time-consuming and error-prone. The process of manual testing is quite boring for programmers too as they need to repeat the process, writing test specs, change the code, and refresh the browser several times. Besides, manual testing also slows down the development process.
Due to the above reasons, it is always useful to have some tools that can automate these tests and help programmers get rid of these repetitive and boring steps. What should a developer do to make the testing process automated?
Basically, a developer can implement the toolset in the CLI (Command Line Interpreter) or in the development IDE (Integrated development environment). Then, these tests will run continuously in a separate process even without input from the developer. Automated testing of JavaScript is also not new and lots of tools like Karma, Protractor, CasperJS, etc. have been developed.
Types of Testing for JavaScript
There can be different tests for different purposes. For example, some tests are written to check the behavior of functions in a program, while some other are written to test the flow of a module or feature. Thus, we have the following two types of testing −
Unit Testing
The testing is done on the smallest testable part of the program called the unit. The unit is basically tested in isolation without any kind of dependency of that unit on the other parts. In the case of JavaScript, the individual method or function having a specific behavior can be a unit of code and these units of code must be tested in an isolated way.
One of the advantages of unit testing is that the testing of units can be done in any order because the units are independent of each other. Another advantage of unit testing which really counts is that it can run the test at any time as follows −
- From the very beginning of the development process.
- After completing the development of any module/feature.
- After modifying any module/feature.
- After adding any new feature in the existing application.
For automated unit testing of JavaScript applications, we can choose from many testing tools and frameworks such as Mocha, Jasmine, and QUnit.
End-to-End Testing
It may be defined as the testing methodology used to test whether the flow of the application from start to finish (from one end to another end) is working fine as per design.
End-to-end testing is also called function/flow testing. Unlike unit testing, end-to-end testing tests how individual components work together as an application. This is the main difference between unit testing and end-to-end testing.
For example, suppose if we have a registration module where the user needs to provide some valid information to complete the registration then the E2E testing for that particular module will follow the following steps to complete the testing −
- First, it will load/compile the form or module.
- Now, it will get the DOM (Document object model) of the form’s elements.
- Next, trigger the click event of the submit button for checking if it is working or not.
- Now, for validation purpose collect the value from the input fields.
- Next, the input fields should be validated.
- For testing purpose, call a fake API to store the data.
Every step gives its own results which will be compared with the expected result set.
Now, the question that arises is, while this kind of E2E or functional testing can be performed manually also, why do we need automation for this? The main reason is that automation will make this test process easy. Some of the available tools that can be easily integrated with any application, for this purpose are Selenium, PhantomJS, and Protractor.
Testing Tools & Frameworks
We have various testing tools and frameworks for Angular testing. The following are some of the well-known tools and frameworks −
Karma
Karma, created by Vojta Jina, is a test runner. Originally this project was called Testicular. It is not a test framework, which means that it gives us the ability to easily and automatically run JavaScript unit tests on real browsers. Karma was built for AngularJS because before Karma there was no automated testing tool for web-based JavaScript developers. On the other hand, with the automation provided by Karma, developers can run a simple single command and determine whether an entire test suite has passed or failed.
Pros of using Karma
The following are some pros of using Karma in comparison to the manual process −
- Automates tests in multiple browsers as well as devices.
- Monitors files for errors and fixes them.
- Provides online support and documentation.
- Eases the integration with a continuous integration server.
Cons of Using Karma
The followings are some cons of using Karma −
The main disadvantage of using Karma is that it requires an additional tool to configure and maintain.
If you are using Karma test runner with Jasmine, then less documentation is available for finding information about setting up your CSS in the case of having multiple ids for one element.
Jasmine
Jasmine, a behavior-driven development framework for testing JavaScript code, is developed at Pivotal Labs. Before the active development of the Jasmine framework, a similar unit testing framework named JsUnit was also developed by Pivotal Labs, which has an inbuilt test runner. The browsers tests can be run through Jasmine tests by including the SpecRunner.html file or by using it as a command-line test runner also. It can be used with or without Karma also.
Pros of Using Jasmine
The followings are some pros of using Jasmine −
- A framework independent of browser, platform and language.
- Supports test driven development (TDD) along with behavioral driven development.
- Has default integration with Karma.
- Easy to understand syntax.
- Provides test spies, fakes and pass-through functionalities which assist with testing as additional functions.
Cons of Using Jasmine
The following is a con of using Jasmine −
- The tests must be return by the user as they change because there is no file-watching feature available in Jasmine while running test.
Mocha
Mocha, written for Node.js applications, is a testing framework but it also supports browser testing. It is quite like Jasmine but the major difference between them is that Mocha needs some plugins and library because it cannot run standalone as a test framework. On the other hand, Jasmine is standalone. However, Mocha is more flexible to use than Jasmine.
Pros of using Mocha
The following are some pros of using Mocha −
- Mocha is very easy to install and configure.
- User-friendly and simple documentation.
- Contains plugins with several node projects.
Cons of using Mocha
The following are some cons of using Mocha −
- It needs separate modules for assertions, spies etc.
- It also requires additional configuration for using with Karma.
QUnit
QUint, originally developed by John Resig in 2008 as part of jQuery, is a powerful yet easy-to-use JavaScript unit test suite. It can be used to test any generic JavaScript code. Although it focuses on testing JavaScript in the browser, yet it is very convenient to use by the developer.
Pros of using QUnit
The following are some pros of using QUnit −
- Easy to install and configure.
- User-friendly and simple documentation.
Cons of using QUnit
The following is a con of using QUnit −
- It was mainly developed for jQuery and hence not so good for use with other frameworks.
Selenium
Selenium, originally developed by Jason Huggins in 2004 as an internal tool at ThoughtWorks, is an open-source testing automation tool. Selenium defines itself as “Selenium automates browsers. That’s it!”. Automation of browsers means that the developers can interact with the browsers very easily.
Pros of using Selenium
The following are some pros of using Selenium −
- Contains large feature set.
- Supports distributed testing.
- Has SaaS support through services such as Sauce Labs.
- Easy to use with simple documentations and rich resources available.
Cons of using Selenium
The followings are some cons of using Selenium −
- A main disadvantage of using Selenium is that it must be run as a separate process.
- Configuration is a bit cumbersome as the developer needs to follow several steps.
