What is automatic waiting in Cypress? How is it different from Selenium's explicit waits?

Q: What is automatic waiting in Cypress? How is it different from Selenium's explicit waits?

Automatic Waiting in Cypress Cypress automatically waits for elements to appear, become visible, be enabled, and for the DOM to settle — before executing each command. This is called retry-ability. How It Works javascript // Cypress will automatically retry cy.get() until: // 1. Element exists in DOM // 2. Element is visible (not hidden) // 3. Element is interactable (not disabled) // 4. Timeout reached (default: 4000ms) cy.get('data-testid="submit"').click() // If button isn't there yet → Cypress retries until 4s timeout Default Timeouts javascript // cypress.config.js module.exports = { defa

Answer

Automatic Waiting in Cypress

Cypress automatically waits for elements to appear, become visible, be enabled, and for the DOM to settle — before executing each command. This is called retry-ability.

How It Works

JavaScript

// Cypress will automatically retry cy.get() until:
// 1. Element exists in DOM
// 2. Element is visible (not hidden)
// 3. Element is interactable (not disabled)
// 4. Timeout reached (default: 4000ms)

cy.get('[data-testid="submit"]').click()
// If button isn't there yet → Cypress retries until 4s timeout

Default Timeouts

JavaScript

// cypress.config.js
module.exports = {
  defaultCommandTimeout: 4000,   // cy.get(), .should()
  requestTimeout:        5000,   // cy.request()
  responseTimeout:      30000,   // cy.request() response
  pageLoadTimeout:      60000,   // cy.visit()
  execTimeout:          60000,   // cy.exec()
};

Override Timeout Per Command

JavaScript

// Wait up to 10 seconds for this specific element
cy.get('[data-testid="results"]', { timeout: 10000 })
  .should('be.visible')

// Wait up to 20s for slow API response to render
cy.get('[data-testid="data-table"]', { timeout: 20000 })
  .find('tr')
  .should('have.length.greaterThan', 0)

What Cypress Waits For Automatically

JavaScript

// 1. Element to exist in DOM
cy.get('#modal').should('exist')      // waits for modal to appear

// 2. Animation to finish
cy.get('.btn').should('not.have.class', 'loading').click()

// 3. XHR/fetch to complete (with cy.intercept alias)
cy.intercept('GET', '/api/users').as('getUsers')
cy.visit('/users')
cy.wait('@getUsers')   // explicitly wait for network request
cy.get('[data-testid="user-list"]').should('be.visible')

// 4. Page load
cy.visit('/dashboard')   // waits for page to fully load

Comparison: Cypress vs Selenium

Java

// SELENIUM — Manual waits required
WebDriverWait wait = new WebDriverWait(driver, Duration.ofSeconds(10));

// Wait for element to be clickable
WebElement btn = wait.until(ExpectedConditions.elementToBeClickable(By.id("submit")));
btn.click();

// Wait for visibility
wait.until(ExpectedConditions.visibilityOfElementLocated(By.cssSelector(".result")));

// Explicit sleep (bad practice)
Thread.sleep(3000);  // fragile!

JavaScript

// CYPRESS — Automatic, no explicit waits needed
cy.get('#submit').click()          // auto-waits for clickable
cy.get('.result').should('be.visible')  // auto-retries
// No Thread.sleep() equivalents needed!

When You DO Need cy.wait()

JavaScript

// Only use cy.wait() for:

// 1. Network requests (most common)
cy.intercept('POST', '/api/login').as('loginCall')
cy.get('#login-btn').click()
cy.wait('@loginCall').its('response.statusCode').should('eq', 200)

// 2. Fixed time (use sparingly — bad practice)
cy.wait(2000)  // only when truly needed, e.g., animation that can't be detected