As it turns out, TDD on the frontend follows a similar approach involving automated UI testing and Unit tests.
When we write E2E tests for our API, we first compose our request, send it, and assert that it returns what is expected. In other words, our E2E tests are mimicking how an end user would interact with our API. For the frontend, a user would interact with our application through the user interface (UI). Therefore, the equivalent to E2E testing would be automated UI testing.
UI tests automate the actions that a user of the application would take. For example, if we want to test that an user can register, we'd write a test that:
- Navigates to the
/register
page - Types in the email
- Types in the password
- Presses the Register button
- Asserts that the user is registered
These tests can be written in Gherkin and run with Cucumber. The actual mimicking of the user action can automate these using Browser Automation Tools like Selenium. For example, when we run...