Cypress Quick Tip: Configs

10/12/20171 Min Read — In Resources, Testing, Development

One of the first things you will want to do when spinning up Cypress in your project is setting up your configs. You can get pretty far without it and they come with sensible defaults.

After you install and run it for the first time, you will get a bunch of scaffolded files. One of the ones that doesn't live in the cypress directory, but in your project root is cypress.json this is where you can adjust your settings.

In the testrunner, you can also use the Settings tab to inspect the settings that Cypress is using and what the defaults and overrides are.

Here's an example from a current project I have set up

"baseUrl": "http://localhost:8080",
"video": false,
"waitForAnimations": true,
"viewportHeight": 1000,
"viewportWidth": 1200

Basics

  • Base URL is your default localhost with protocol and port, you can override this in your spec files but it's handy to have a default set.
  • Default resolution is good if your site is responsive or you are going to be doing a lot of visual diffing, you can always set this in your spec file.
  • Screenshots is something I don't utilize when doing local dev but it can be critical for your pipeline setup.
  • Main test file directory is something you can override if Integration is not your jam.
  • You can use "env" to set up your environment variables.
  • If you are mixing local and CI and other environments or other devs, you can also set these when you open or run from the commandline like so cypress open --config watchForFileChanges=false,waitForAnimations=false

Of course, you can Check Out The Docs for more info!