Skip to content

Latest commit

 

History

History
58 lines (46 loc) · 3.22 KB

README.md

File metadata and controls

58 lines (46 loc) · 3.22 KB
Raw

Demo project for my talks about frontend testing and eslint

For some reason, we still don't like writing test for web-frontends. Most backend developers do it, frontend devs often don't. And if they do, they get frustrated. But what can we do?

This repo contains the demo application for my talk about frontend testing, with examples that I use in the talk. You can have a look and try out things with this repo.

It is not intended to be a fully tested, working and deployable apps. It is an example for project setup and unit testing. Please do not copy & paste without thinking. Use this as inspiration only.

Mock-Service-Worker

This was not part of the talk. In order to simplify the use of mock-apis, we write a small wrapper around mswjs.io.

  • In setup.ts, the file mock-api.test-helper.ts is included, which initializes a default mock api
  • Default mocks for all endpoint should be provided in the setup function
  • The function useRequestHandlers can be used to override the default request handlers for specific test cases.
  • src/test-utils/mock-requestHandlers contains the factory functions for request-handlers, simplifying the override in test-cases. Maybe it would be better to move it so src/backend.
  • The mock-api.test-helper module also collects sent requests and exports the function getSentRequests so that api-calls can be verified in the test. This is a very basic facility, which could be improved, but for this repo, I wanted to keep it simple.

eslint

I created the eslint-config with

npm init @eslint/config@latest

and when my way from there. You can check the git-history for the different things I added. The branch orm2024 deliberately contains some eslint errors. Run npm run test:lint to find them.

Other References