As software consultants at Test Double, we delight in helping client development teams succeed at building quality software at a sustainable pace. For most software consulting agencies that typically means contributing directly to software delivery and advising on good coding practices at a client.
One area often overlooked is the quality of automated testing on a client project. For many teams, automated testing is nonexistent or boils down to a checklist item with no ethos, mired in a spaghetti of hybrid unit-integration tests with an identity crisis.
Our consultants believe a healthy project depends on having automated testing in place with intentional rules and boundaries that team members have agreed upon. Know thyself, and then know what and why you’re testing.
End-to-end tests offer a great example of the kinds of tests that are ripe for misunderstanding and misuse by client teams. More often than not, we encounter end-to-end test suites that are slow, unreliable, and unmaintainable, slowing down teams as they constantly debug tests and rely on restarting CI builds to make flaky tests pass.
An unfortunate side effect of problematic test suites is that teams can blame testing tools instead of cutting to the heart of the real issue: ad hoc, poorly designed test suites. Granted, software developers have raised legitimate concerns with end-to-end testing tools. Thanks to those concerns, we now have tools such as Cypress. If you haven’t heard of Cypress, it offers a carefully-designed ecosystem of tooling for writing, running, and debugging end-to-end test suites that reduces the friction found in other tools such as Selenium.
Unsurprisingly, many other issues with end-to-end tests didn’t disappear when teams adopted Cypress, though. Tests are still slow and still unreliable. Ever true to our mission, Test Double wants to improve how the world builds software, in this case by improving how teams test their code with end-to-end testing.
If you’re a web developer or QA engineer that wants to make your application more reliable, then this video series from your friends at Test Double is for you. Throughout, you will learn how to write Cypress end-to-end tests that provide the most value to your business without sacrificing maintainability. This video series will take you from knowing nothing about end-to-end tests or Cypress to building your own maintainable end-to-end test suite with Cypress.
In this first video, you will receive an introduction to the world of end-to-end testing with Cypress. You will learn who Test Double is and why we love Cypress, how end-to-end tests fit in the testing pyramid, the pros and cons of end-to-end tests, and what you should expect from this series. By the end of this video, you will understand what end-to-end tests are and why Cypress makes writing them familiar and fun.
The video embedded on this page includes the full playlist, and individual lesson module videos are also linked below.
Intro to End-to-End Testing with Cypress
Learn what end-to-end tests are and why Cypress makes writing them familiar and fun.
Learn how to initialize a Cypress test suite and start writing end-to-end tests with Cypress.
Learn why your Cypress end-to-end tests should be real-world, happy path tests.
Write your first real-world, happy path test and learn interactive Cypress commands.
Learn how to write test setup code and isolate persisted state between different tests.
Learn about the DRY principle (Don't Repeat Yourself) and how to write reusable helper functions for data setup in end-to-end tests.
Learn how similar tests slow down your tests. Plus find out how to combine happy path tests to improve performance.
Make test suites more maintainable through setup helper functions and configuring cypress.json.
Image Attributions:
- https://pixabay.com/illustrations/hook-check-mark-done-yes-consent-2470296/
- https://pixabay.com/vectors/tag-badge-logo-medal-tape-763169/
[00:00] (upbeat music)
[00:03] - [Jeremy] Hello, and welcome to Test Double's intro course
[00:06] on end-to-end testing with Cypress.
[00:09] My name is Jeremy Fairbank,
[00:10] and I will be your humble guide on this testing journey.
[00:14] At Test Double, we believe software is broken,
[00:16] and we are here to fix it.
[00:19] Our mission is to improve how the world builds software.
[00:22] Test Double's seasoned developer consultants
[00:25] work as extended members of your engineering team.
[00:28] We get things done by embracing your tools,
[00:31] participating in your process,
[00:33] and making improvements as we go.
[00:36] We tackle the technical and human aspects of every problem,
[00:40] striving to build both great software and great teams.
[00:44] If you'd like to have our consultants help your team,
[00:47] or if you'd like to join our awesome team of consultants,
[00:50] follow the links below.
[00:52] Cypress has grown immensely popular over the past few years,
[00:56] quickly becoming a leader
[00:58] in the world of web application end-to-end testing.
[01:01] At Test Double, we love using Cypress
[01:04] and helping our clients
[01:05] build safe and maintainable applications with it.
[01:09] But what even are end-to-end tests in Cypress?
[01:13] End-to-end tests are automated tests
[01:15] that verify all the parts of an application
[01:17] work together correctly throughout the whole stack.
[01:21] They've traditionally occupied the top layer
[01:24] of what's known as the testing pyramid.
[01:26] Each slice of the testing pyramid offers guidelines
[01:29] about how much your team may wanna invest
[01:31] in those types of tests
[01:33] based on their value, speed, and maintainability.
[01:37] Although end-to-end tests provide reassurance
[01:39] that your application works as a whole,
[01:42] they tend to be the slowest and hardest to debug tests
[01:45] because they interact with the full stack.
[01:48] So the testing pyramid generally recommends
[01:50] limiting the number of end-to-end tests,
[01:53] focusing primarily on the most critical paths
[01:56] through your application.
[01:58] Many end-to-end testing solutions exist
[02:01] in the world of web development.
[02:03] Cypress has really stood out among the various options,
[02:06] thanks to its many developer-friendly design choices.
[02:11] For the most part,
[02:12] JavaScript has become the default language of the web
[02:15] and a popular choice among many web developers.
[02:18] Cypress fully embraces that.
[02:21] Cypress tests are written in modern JavaScript,
[02:24] and Cypress itself is built with JavaScript.
[02:27] Little to no waiting.
[02:28] Cypress' declarative API lets you primarily focus
[02:32] on interacting with your application
[02:34] without worrying about when elements appear or disappear
[02:38] from the DOM.
[02:39] Cypress offers an impressive suite of tools
[02:42] for debugging and replaying tests right inside the browser.
[02:47] Cypress is an all-in-one package.
[02:49] When you install Cypress,
[02:51] you have everything you need to start testing.
[02:54] No extra testing frameworks or libraries to piece together.
[02:58] So who is this course for,
[03:01] and is Cypress testing right for you and your team?
[03:04] Do you have a front-end web application
[03:06] driven by a back-end server?
[03:09] Do you want to have confidence that your app works correctly
[03:12] throughout the whole stack?
[03:14] Do you want to ensure sev0 bugs
[03:16] don't come back to haunt you?
[03:18] Do you wanna automate manual regressions tests
[03:20] and user acceptance tests,
[03:22] ensuring features work as intended?
[03:25] If you answered "Yes" to any of those questions,
[03:28] then this course is for you,
[03:29] whether you're a front-end, back-end,
[03:32] or a full-stack software engineer, or even a QA engineer.
[03:36] So what can you expect from this course?
[03:39] This course will be a follow-along tutorial
[03:42] spread across multiple short videos.
[03:45] This course also assumes you are new to Cypress.
[03:48] We'll start with basic concepts
[03:50] and build on top of previous videos
[03:52] to introduce more concepts.
[03:54] At times, you'll even re-factor or rewrite previous tests
[03:58] as you learn more advanced topics.
[04:00] This course takes a pragmatic approach
[04:03] to get you testing with Cypress on your own
[04:05] as quickly as possible.
[04:07] So you won't learn all of Cypress' API and options,
[04:11] but you will still learn advanced techniques,
[04:14] best practices, and some of Test Double's recommendations.
[04:18] That being said,
[04:19] there are some pre-requisites to this course.
[04:22] Since this pertains to web applications,
[04:24] you need to know HTML
[04:26] and have some experience with front-end web applications.
[04:30] As I mentioned, Cypress' test are written in JavaScript,
[04:33] so you need to be familiar with its syntax,
[04:36] asynchronous patterns, and interacting with JSON APIs.
[04:41] Also, you will need to use npm to install Cypress.
[04:45] Throughout this course,
[04:45] you will test a provided demo application
[04:48] built with React, Ruby on Rails, and Docker.
[04:51] If you're familiar with those technologies, that's great.
[04:54] If not, no worries.
[04:56] We will limit the time we spend
[04:58] in the application's source code,
[05:00] and instructions for using Docker are provided
[05:02] with the source code repo.
[05:04] Speaking of source code, the demo app is hosted on GitHub,
[05:07] so you will need some experience
[05:09] forking and cloning GitHub repos.
[05:12] Ultimately, when you complete this course,
[05:15] you will be able to:
[05:16] install and set up a new Cypress test suite,
[05:20] use many of Cypress' most important API commands,
[05:24] identify critical, happy-path user scenarios
[05:26] to test in your application,
[05:28] and identify what not to test with Cypress,
[05:31] use different approaches to control your application data
[05:35] for deterministic tests,
[05:37] create custom Cypress commands,
[05:39] use advanced techniques to makes tests more maintainable
[05:43] and eliminate false negatives that destroy productivity,
[05:47] and set up continuous integration environments
[05:49] to run your tests on a schedule
[05:51] and notify you of failing tests.
[05:54] Now that we've set the stage for this Cypress course,
[05:57] let's forge ahead.
[05:58] In the next video,
[05:59] you will learn how to install Cypress,
[06:02] initialize a test suite,
[06:04] and write your first test against the demo app.
[06:07] (upbeat music)
