Test configuration per environment in Cypress - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

Output of environment-specific baseUrl in Cypress

Given the following Cypress configuration files for two environments, what will be the baseUrl used when running tests with the command cypress run --env configFile=staging?

Cypress

/* cypress.config.js */
const { defineConfig } = require('cypress')

module.exports = defineConfig({
  e2e: {
    setupNodeEvents(on, config) {
      const envConfig = require(`./cypress.env.${config.env.configFile}.json`)
      return {...config, ...envConfig}
    },
    baseUrl: 'http://localhost:3000'
  }
})

/* cypress.env.staging.json */
{
  "baseUrl": "https://staging.example.com"
}

/* cypress.env.production.json */
{
  "baseUrl": "https://www.example.com"
}

A https://staging.example.com

B http://localhost:3000

C https://www.example.com

D undefined

💡 Hint

Check how the configFile environment variable affects the loaded JSON file.

When running with --env configFile=staging, the setupNodeEvents function loads cypress.env.staging.json which overrides baseUrl to https://staging.example.com.

❓ assertion

intermediate

Correct assertion for environment-specific API endpoint

You want to assert that the API endpoint URL used in your Cypress test matches the environment-specific value. Which assertion correctly verifies that the API URL is set to the production endpoint when running with --env configFile=production?

Cypress

const apiUrl = Cypress.env('apiUrl')

// Production endpoint is https://api.example.com

A assert.equal(apiUrl, 'http://localhost:3000')

B expect(apiUrl).to.equal('https://api.example.com')

C expect(apiUrl).to.be.undefined

D assert.isTrue(apiUrl === 'https://staging.example.com')

💡 Hint

Use the correct assertion style and check the expected URL for production.

Option B uses the correct Cypress assertion syntax and matches the expected production API URL.

🔧 Debug

advanced

Debug failing environment variable in Cypress test

A test fails because the environment variable apiKey is undefined when running tests with --env configFile=qa. The cypress.env.qa.json file contains { "apiKey": "12345" }. What is the most likely cause?

Cypress

/* cypress.config.js */
const { defineConfig } = require('cypress')

module.exports = defineConfig({
  e2e: {
    setupNodeEvents(on, config) {
      const envConfig = require(`./cypress.env.${config.env.configFile}.json`)
      return {...config, ...envConfig}
    }
  }
})

A The apiKey variable is not accessed via Cypress.env('apiKey')

B The cypress.env.qa.json file is missing the apiKey property

C The test command did not include --env configFile=qa

D The setupNodeEvents function does not merge envConfig correctly

💡 Hint

Check the test run command and environment variable usage.

If the test command does not specify --env configFile=qa, the qa environment config file won't load, so apiKey remains undefined.

🧠 Conceptual

advanced

Best practice for managing sensitive environment variables in Cypress

Which approach is the safest and most recommended way to manage sensitive environment variables like API keys across different environments in Cypress?

A Use OS environment variables and load them in cypress.config.js without committing keys to version control

B Store sensitive keys directly in cypress.env.{env}.json files committed to version control

C Hardcode sensitive keys in test files for easy access

D Include sensitive keys in the baseUrl property in cypress.config.js

💡 Hint

Think about security and version control best practices.

Using OS environment variables and loading them in config files avoids committing sensitive data to version control, improving security.

❓ framework

expert

Configuring Cypress to run tests with multiple environment configurations sequentially

You want to run your Cypress tests sequentially for 'development', 'staging', and 'production' environments, each with its own config file (cypress.env.development.json, etc.). Which approach correctly sets this up in a Node.js script?

Cypress

const { exec } = require('child_process')

// Fill in the missing code to run tests sequentially for each environment

A ['development', 'staging', 'production'].map(env => exec(`cypress run --env configFile=${env}`))

B

async function run() {
  for (const env of ['development', 'staging', 'production']) {
    await exec(`cypress run --env configFile=${env}`)
  }
}
run()

C ['development', 'staging', 'production'].forEach(env => exec(`cypress run --env configFile=${env}`))

D

const runEnv = env => new Promise((res, rej) => {
  exec(`cypress run --env configFile=${env}`, (err) => err ? rej(err) : res())
})

async function run() {
  for (const env of ['development', 'staging', 'production']) {
    await runEnv(env)
  }
}
run()

💡 Hint

Consider how to wait for each exec command to finish before starting the next.

Option D wraps exec in a Promise and uses async/await to run tests sequentially, ensuring one finishes before the next starts.