Introduction to Testing with Cypress

Testing JavaScript code is notoriously difficult. Because JavaScript typically runs in a browser environment and interacts closely with the DOM and user behavior, it is often challenging to write tests that have value and are consistent and fast.

When thinking about testing JavaScript, it’s helpful to think about what you want to get out of testing. In this chapter, we’ll focus on two goals:

• Using tests to validate that the code is doing the things we think it is doing
• Using tests to help development by allowing us to rapidly run situations that would take a long time to recreate manually

While a wide variety of testing tools are available in JavaScript, in this chapter, our focus is on end-to-end testing with Cypress, which is a tool that will allow us to simulate interactions with our Rails server and the browser.

Why focus on just one tool? Well, the various tools overlap in functionality but differ in terminology just enough that trying to talk meaningfully about more than one of them at a time is a pretty good recipe for confusion on my part, and probably also yours.

And why end-to-end testing? The Stimulus team is explicit that end-to-end server testing is the preferred way of testing Stimulus behavior. While it’s possible to test Stimulus controllers or React components in isolation from a server, the Stimulus team does not do anything to make that process easier, and the React process is also slightly complex.