chingu-x / chingu-frontend

React / Apollo client for the Chingu Developer Network
10 stars 7 forks source link

Add test harness for frontend components #197

Open jdmedlock opened 5 years ago

jdmedlock commented 5 years ago

Add a test harness utilizing the Jest and Enzyme packages for use by frontend components.

jdmedlock commented 5 years ago

What follows is commentary and a proposal for how we should approach testing in the FE. I firmly believe we should spend a few minutes on this as a team to agree on a direction. Not because we need "group think", but because testing touches us all and is important both as a way to develop faster and to generate a higher quality product.

Before continuing, take the time to listen to Javascript Jabber #341. It's FE/BE agnostic and contains a huge amount of practical advice on how to approach testing. Seriously. I mean it. Vamp I'm talking to you.

To keep this short the guidelines for our approach should be:

  1. You don't have to develop tests before coding a component, but tests are required before PR's can be approved for merge.
  2. Implement the "diamond" approach to testing - concentrate the majority of effort on integration tests and impement unit and end-to-end (E2E) tests only as necessary. Unit tests are fragile since they are so closely tied to the UI. E2E tests are difficult and time consuming to build, so concentrate on "happy path" E2E tests to be used for high level validation before and after moving new functionality into production
  3. For now use manual testing to validate screen appearance. There are tools like Applitools, but IMHO validation of visual elements isn't taking much time at this point so automated appearance testing can be deferred.

Additional references:

Fini.