Skip to content

Instantly share code, notes, and snippets.

@mykhas
Last active July 9, 2020 15:01
Show Gist options
  • Save mykhas/b1780891dfcc9082a9d2e8188ef646f3 to your computer and use it in GitHub Desktop.
Save mykhas/b1780891dfcc9082a9d2e8188ef646f3 to your computer and use it in GitHub Desktop.

<2020-07-09 Thu> Front-End Testing Workshop

Kinds of tests

By object of testing:

  • unit tests — testing only one class/function, mocking all its dependencies;
  • integration tests — testing several units at a time within the same project. Usually, in implies mocking of input data, like API calls;
  • e2e tests — testing of the product. Usually is performed on the predefined DB snapshot, might test at the same time several projects/modules (API, ftw, widgets-routes etc.
  • pixel-perfect — by-pixel comparison of the rendered page
  • snaphot testing — comparisong of the generated by component html-code, which allows to find missing data or any changes.

By the environment:

  • browser tests — are executed in the browser, oftenly with Karma or Puppeteer. Allows to test how components are builded/rendered in the browser, with native support of browser globals and events. Often executed on the headless versions of browsers, which improves performance. Our widgets-ssr module is builded in the similar fashion
  • Node.JS tests — all globals are mocked with dummies/polyfills, tests are executed poorely with NodeJS. It’s fast, but might result in problems with environement or missing some issues that might appear in the browser.

What should be tested

  • dom interactions are relatively complicated to test, but still possible with Jest.
  • code, that works fine but have to be refactored;
  • bugs, that has been reopened after change in related component/service;
  • business-logic parts

Service unit-testing

Component unit-testing

Links

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment