Test Types

Javascript testing contains the following types

  • Unit Tests– Testing of individual units like functions or classes by supplying input and making sure the output is as expected:
  • Integration Tests– Testing processes across several units to achieve their goals, including their side effects:
  • Functional Tests – Testing how scenarios function on the product itself, by controlling the browser or the website. These tests usually ignore the internal structure of the application entirety and looks at them from the outside like on a black box.

Running Tests

Tests can run in the browser by creating an HTML page with the test libraries and tests included as JS files. Tests can also be executed in Node.js by simply importing the tests and dependent libraries. jsdom is commonly used in Node.js to simulate a browser-like environment using pure JavaScript. 

Unit Tests

Should cover all small pure units of the application- utils, services and helpers. Provide all these units with simple and edge case inputs and make sure their outputs are as expected using the assertion functions Also make sure to use a code coverage reporting tool to know which units are covered. Unit tests are one of the reasons to use functional programming and pure functions as much as possible.

Integration Tests

Integration tests should cover important cross-module processes. Sometimes they extend to processes across several classes and sometimes to testing different systems like Front-End-Back-End interactions.

Also, as opposed to unit tests, a browser or browser-like environment (jsdom) could be required to access the window. They provide us with a way to test how processes affect selected components without actually rendering them into a browser or browser-like environment.

Functional Tests

Functional tests control browsers and simulate user behavior on these environments (clicking, typing, scrolling etc…) and make sure these scenarios actually work from the point of view of an end user. Also it is worth noting that many services provide you with devices and browsers to run these tests on. 

Visual regression testing tools can also be set up to verify that the different screens of your applications are ok visually by a smart comparison of screenshots. These screenshots are usually taken as part of your Functional Tests or by executing a separate session of browser automation.