[Frontend] Set up example e2e test using Cypress

[karrui]

This is blocked by the creation of example sign in flow, WIP here #792

After that is fixed and merged, should set up example e2e test

[JasonChong96]

(I haven't been on any projects here that use Cypress so there might be some reason for using Cypress that I missed so maybe I'm wrong)

Would it be a good idea to explore using PlayWright instead? I've done some preliminary exploration for using this on Redeem as it provides cross-browser testing which we need. Cypress only works on chromium browsers and Chromatic seems to lack support for webkit browsers. This makes all iOS browsers and safari on MacOS our "blindspot" in testing. PlayWright supports chromium, firefox and webkit browsers which would address this issue.

PlayWright should be easy to integrate as we can either run it with jest-playwright or its own test runner with 1st party typescript support. The API for PlayWright/Cypress seems to be pretty similar as well so there shouldn't be much of a learning curve.

The only downside I see is that Playwright is a less mature framework (~1 year) but it's already quite popular (26k stars on github) and the documentation and community support seems great from what I've seen.

[karrui]

No preference as for now. In fact, FormSG uses Testcafe for e2e (don't really like it, have to spin up a server for testing). Feel free to experiment!