When you run tests in Cypress, we launch a browser for you. This enables us to:
- Create a clean, pristine testing environment.
- Access the privileged browser APIs for automation.
Browsers
When Cypress is initially run from the Test Runner, you can choose to run Cypress in a select number of browsers including:
Cypress automatically detects available browsers on your OS. You can switch the browser in the Test Runner by using the drop down in the top right corner:
Download specific Chrome version
The Chrome browser is evergreen - meaning it will automatically update itself, sometimes causing a breaking change in your automated tests. We host chromium.cypress.io with links to download a specific released version of Chrome (dev, Canary and stable) for every platform.
Electron Browser
In addition to the browsers found on your system, you’ll notice that Electron is an available browser. The Electron browser is a version of Chromium that comes with Electron.
The Electron browser has the advantage of coming baked into Cypress and does not need to be installed separately.
By default, when running cypress run from the CLI, we will launch Electron headlessly.
You can also launch Electron headed:
cypress run --headed
Because Electron is the default browser - it is typically run in CI. If you are seeing failures in CI, to easily debug them you may want to run locally with the --headed option.
Chrome Browsers
All Chrome* flavored browsers will be detected and are supported.
You can launch Chrome browsers:
cypress run --browser chrome
To use this command in CI, you need to install the browser you want - or use one of our docker images.
By default, we will launch Chrome in headed mode. To run Chrome headlessly, you can pass the --headless argument to cypress run.
You can also launch Chromium:
cypress run --browser chromium
Or Chrome Canary:
cypress run --browser canary
Launching by a path
You can launch any supported browser by specifying a path to the binary:
cypress run --browser /usr/bin/chromium
# or
cypress open --browser /usr/bin/chromium
Cypress will automatically detect the type of browser supplied and launch it for you.
See the Command Line guide for more information about the--browser arguments
Customize available browsers
Sometimes you might want to modify the list of browsers found before running tests.
For example, your web application might only be designed to work in a Chrome browser, and not inside the Electron browser.
In the plugins file, you can filter the list of browsers passed inside the config object and return the list of browsers you want available for selection during cypress open.
// cypress/plugins/index.js
module.exports = (on, config) => {
// inside config.browsers array each object has information like
// {
// name: 'canary',
// family: 'chrome',
// displayName: 'Canary',
// version: '80.0.3966.0',
// path:
// '/Applications/Canary.app/Contents/MacOS/Canary',
// majorVersion: 80
// }
return {
browsers: config.browsers.filter((b) => b.family === 'chrome')
}
}
When you open the Test Runner in a project that uses the above modifications to your plugins file, only the Chrome browsers found on the system will display in the list of available browsers.
If you return an empty list of browsers or
browsers: null, the default list will be restored automatically.
If you have installed a Chromium-based browser like Brave, Vivaldi and even the new Microsoft Edge Beta you can add them to the list of returned browsers. Here is a plugins file that inserts a local Brave browser into the returned list.
// cypress/plugins/index.js
const execa = require('execa')
const findBrowser = () => {
// the path is hard-coded for simplicity
const browserPath =
'/Applications/Brave Browser.app/Contents/MacOS/Brave Browser'
return execa(browserPath, ['--version']).then((result) => {
// STDOUT will be like "Brave Browser 77.0.69.135"
const [, version] = /Brave Browser (\d+\.\d+\.\d+\.\d+)/.exec(
result.stdout
)
const majorVersion = parseInt(version.split('.')[0])
return {
name: 'Brave',
family: 'chrome',
displayName: 'Brave',
version,
path: browserPath,
majorVersion
}
})
}
module.exports = (on, config) => {
return findBrowser().then((browser) => {
return {
browsers: config.browsers.concat(browser)
}
})
}
Once selected, the Brave browser is detected using the same approach as any other browser of the chrome family.
If you modify the list of browsers, you can see the resolved configuration in the Settings tab of the Test Runner.
Unsupported Browsers
Many browsers such as Firefox, Safari, and Internet Explorer are not currently supported. While it may be possible to modify the list of browsers found and run Cypress within them - we do not guarantee full functionality. Support for more browsers is on our roadmap. You can read an exhaustive explanation about our future cross browser testing strategy here.
Browser Environment
Cypress launches the browser in a way that’s different from a regular browser environment. But it launches in a way that we believe makes testing more reliable and accessible.
Launching Browsers
When Cypress goes to launch your browser it will give you an opportunity to modify the arguments used to launch the browser.
This enables you to do things like:
- Load your own chrome extension
- Enable or disable experimental chrome features
Cypress Profile
Cypress generates its own isolated profile apart from your normal browser profile. This means things like history entries, cookies, and 3rd party extensions from your regular browsing session will not affect your tests in Cypress.
Wait, I need my developer extensions!That’s no problem - you have to reinstall them once in the Cypress launched browser. We’ll continue to use this Cypress testing profile on subsequent launches so all of your configuration will be preserved.
Disabled Barriers
Cypress automatically disables certain functionality in the Cypress launched browser that tend to get in the way of automated testing.
The Cypress launched browser automatically:
- Ignores certificate errors.
- Allows blocked pop-ups.
- Disables ‘Saving passwords’.
- Disables ‘Autofill forms and passwords’.
- Disables asking to become your primary browser.
- Disables device discovery notifications.
- Disables language translations.
- Disables restoring sessions.
- Disables background network traffic.
- Disables background and renderer throttling.
- Disables prompts requesting permission to use devices like cameras or mics
- Disables user gesture requirements for autoplaying videos.
You can see all of the default chrome command line switches we send here.
Browser Icon
You might notice that if you already have the browser open you will see two of the same browser icons in your Dock.
We understand that when Cypress is running in its own profile it can be difficult to tell the difference between your normal browser and Cypress.
For this reason we recommend downloading Chromium or downloading Canary. These browsers both have different icons from the standard Chrome browser, making them more distinguishable. You can also use the bundled Electron browser, which does not have a Dock icon.
Additionally, we’ve made the browsers spawned by Cypress look different than regular sessions. You’ll see a darker theme around the chrome of the browser. You’ll always be able to visually distinguish these.
