Catégories
JavaScript

JS Testing Frameworks

Voici un recueil d’infos à propos des Frameworks de test ainsi que des assertion libraires populaires.

Jest

Zero configuration testing platform. A l’origine, basé sur Jasmine (jusqu’à la v15, today v23)

Strengths of Jest

  1. The biggest advantage of using Jest is that it works out of the box with minimal setup or configuration. Much of this is because it comes with an assertion library and mocking support. It’s built into the popular create-react-app
  2. Jest also supports snapshot testing, which can be really handy for preventing accidental UI regressions. Snapshots render a UI component, take a screenshot of it, and compare the component to a reference image stored with the test: expect(component).toMatchSnapshot();
  3. Jest runs your tests concurrently in parallel (asynchronous testing), providing a smoother, faster test run
  4. running on Node.js and in the browser
  5. configuration can be defined in the package.json file of your project, or through a jest.config.js file or through the –config <path/to/js|json>
  6. universal testing platform, with the ability to adapt to any JavaScript library or framework

Mocha

Mocha provides developers with a base test framework, allowing you to have options as to which assertion, mocking, and spy libraries you want to use.

Strengths of Mocha

  1. Mocha’s greatest strength is its flexibility, one of the most flexible JavaScript testing libraries available. If having complete control of your testing framework is something you want, Mocha is by far the most configurable and best choice.
  2. It doesn’t come with an assertion library or mocking framework. This SO post discusses some of the popular JavaScript assertion libraries. One popular choice is to use Chai for test assertions and Sinon for mocking.
  3. Community due to it’s lifetime.

Weaknesses of Mocha

Mocha’s main weakness is that it requires more configuration.

Jest VS Mocha

Jest usage has exceeded Mocha’s from Sept 18. Jest is popular among React community that is growing quickly 💪

Assertions Libraries

Chai is one of the most popular open-source assertion libraries is a BDD/TDD assertion library for node and the browser with an abundance of plugins and extensions.

Sinon is a popular mocking and spy library with robust documentation on fakes, stubs, spies, and mocks. Sinon is easy to pick up and integrate with Mocha and Jest.

Enzyme was developed by Airbnb for testing React components’ outputs. Enzyme shallow renders your components so that you ensure that your component is being passed the correct props and behaviors. Enzyme can be used in addition to any testing framework. Enzyme is easy to configure and has additional libraries for integration with popular libraries (like jest-enzyme and chai-enzyme).With Enzyme we can create a mock DOM to test whether components are rendered correctly, and whether they behave correctly when acted upon.Enzyme’s mock rendering can either be done through shallow rendering or full DOM rendering.
Enzyme v3 support React 16;
Enzyme is unopinionated regarding which test runner or assertion library you use, and should be compatible with all major test runners and assertion libraries out there.

react-testing-library high level testing utilities for React

Integration tests

Nightmare for integration testing

Headless alternatives à PhantomJs qui est ☠️

Puppeteer is a Node.js library, developed by Google. It provides a convenient Node.js API to control Headless Chrome that is just a regular Chrome v59+ that is launched with the
–headless flag that exposes an API to control it

BrowserSync affiche en parallèle le résultat de nos dev sur plusieurs écrans (avec live reloading): From live reloads to URL pushing, form replication to click mirroring, Browsersync cuts out repetitive manual tasks

Liens

blog

medium Jest vs Mocha 2018

Blog post sur Enzym

Sinon

Stats d’adoption des framework et + (2016 et 2017)

Compilation de toutes les infos nécessaire pour comprendre les différents outils intervenant dans les tests en JS:

  1. Provide a testing structure (Mocha, Jasmine, Jest, Cucumber)
  2. Provide assertions functions (Chai, Jasmine, Jest, Unexpected)
  3. Generate, display, and watch test results (Mocha, Jasmine, Jest, Karma)
  4. Generate and compare snapshots of component and data structures to make sure changes from previous runs are intended (Jest, Ava)
  5. Provide mocks, spies, and stubs (Sinon, Jasmine, enzyme, Jest, testdouble)
  6. Generate code coverage reports (Istanbul, Jest, Blanket). Istanbul is built into Jest, so configuration is handled directly by Jest. The report can be generated by triggering jest with the --coverage flag. Jest provides documentation for configuring test coverage here.
  7. Provide a browser or browser-like environment with a control on their scenarios execution (Protractor, Nightwatch, Phantom, Casper)