Applications

Below is a list of complete applications tested in Cypress.

NameJSDescription
Kitchen SinkVanillaShowcases every single Cypress command
TodoMVCReactCompares the official TodoMVC Selenium tests to Cypress
RealworldReactFull end-to-end tests for the gothinkster/realworld "Conduit" app
PhonecatAngular 1.xCompares the official Phonecat Protractor tests to Cypress
PieChopperAngular 1.xTests a fully featured application with many forms and modals

Kitchen Sink

https://github.com/cypress-io/cypress-example-kitchensink

This is an example app which is used to showcase every command available in Cypress.

kitchensink running

TodoMVC

https://github.com/cypress-io/cypress-example-todomvc

This repo compares Cypress Tests to official TodoMVC Tests. This gives you a good comparison of writing and running tests in Cypress versus vanilla Selenium.

  • Query and make assertions about DOM elements state.
  • Type into an input using cy.type().
  • Create a custom cy.createTodo() command to run multiple cy commands.
  • Click and double click elements using cy.click() and cy.dblclick().
TodoMvc testing in Cypress

TodoMVC Redux

https://github.com/cypress-io/cypress-example-todomvc-redux

A fork the official Redux TodoMVC example. Through a combination of end-to-end and unit tests shows how you can achieve 100% code coverage.

  • Instrument and collect code coverage following the Cypress Code Coverage guide.
TodoMVC Redux application code coverage report

Realworld

https://github.com/cypress-io/cypress-example-realworld

Shows a full blogging application, "Conduit", with back end code and a database.

  • Create a test user from tests by running database commands via the cy.task() command.
  • Log in using cy.request() and then setting the returned JWT token in localStorage.
  • Test all aspects of writing blog posts, commenting, and marking favorite posts.
  • Collect full stack code coverage using @cypress/code-coverage. Read the Cypress code coverage guide for more details.
Realworld test in Cypress

Phonecat

https://github.com/cypress-io/cypress-example-phonecat

This tests the original Angular Phonecat example app using Cypress.

  • Test redirect behavior of application using .hash().
  • Test loading behavior of app.
Phonecat Angular tutorial app tested in cypress

PieChopper

https://github.com/cypress-io/cypress-example-piechopper

This is a single page application with a decent amount of features. The tests involve a lot of form submissions.

  • Test mobile responsive views using cy.viewport()
  • Test that the app scrolls correctly
  • Check checkboxes using cy.check()
  • Stub responses from our back end using cy.route()
Piechopper app tested in cypress