Revamp Testing Specs

[ardelato]

Description

We initially wrote tests to address the specs listed in #452.

We wrote Jest tests as unit tests to address component specs and Playwright tests as integration/E2E tests to validate user flows. When issue #452 was created, it made sense to write some of these tests to get some coverage on for the MVP Store page.

We have since started to transition from releasing the MVP to optimizing and refactoring our current code. This has begun to expose pain points working with our current testing infrastructure ¹²³.

Problems

The main problems can be boiled down to:

1. The tests rely on static mocks which are tightly coupled to a type definition. This is rather burdensome for the Devs since there is no easy way to update these mocks if we modify the type definitions.¹².
2. Some of the tests cover very granular cases in which if we make a small change then the tests fail or our entire CI fails. ⁴³.

Discussion Questions

• What can we change to make it easier to generate these static mocks?

• Can we update the spec to address our new priorities and required business logic to refactor what our tests cover?

cc: @dhmacs

Footnotes

1. https://github.com/iFixit/react-commerce/issues/1400 ↩ ↩²

2. https://ifixit.slack.com/archives/C01DBJK0H7U/p1678196930648659 ↩ ↩²

3. https://github.com/iFixit/react-commerce/pull/1425 ↩ ↩²

4. https://github.com/iFixit/react-commerce/issues/1326 ↩

[ardelato]

For context on the static mocks, they were initially created by logging an actual response from the findProduct method call. The process would take place in local dev and it would include adding a console.log where findProduct was used. Then copying and pasting the output object into the file and doing some light formatting.