Getting Started with Cypress

A short guide for getting Cypress set up and running basic tests.

Already using Cypress? If you already have a working Cypress project, you can jump to our guide on writing email tests.

Installing Cypress

Create a folder for your project:

mkdir -p your/project/path
cd your/project/path

Install Cypress via npm:

npm install cypress --save-dev

This will install Cypress locally as a dev dependency for your project.

Launching Cypress

Launch Cypress for the first time:

./node_modules/.bin/cypress open

Write a very basic first test

Your tests should be stored within the cypress/integration/ folder that now exists within your project. We’ll create a file called first.spec.js to get started:

touch cypress/integration/first.spec.js

Now, edit this file and add the following content:

describe('My First Test', () => {
    it('Does not do much!', () => {
        expect(true).to.equal(true)
    })
})

As you can see, this test doesn’t do much, but you should see Cypress process it as a passing test. Now it’s time to do something more useful.

Using Cypress commands

Cypress commands allow you to perform all manner of tests. Lets use some of these to create a test that:

  1. Open a browsers
  2. Navigates to a URL
  3. Makes an assertion
describe('My First Test', () => {
    it('Navigates to Password Reset screen', () => {
        cy.visit('https://github.com/password_reset')
        cy.title().should('equal', 'Forgot your password?')
    })
})

Great! That’s the basics of Cypress up and running. You can learn more about the functionality that comes with Cypress on its official website.

Let’s more on to extending Cypress with Mailosaur, and writing our first email test…