before and after hooks in Cypress - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to run a setup step before all tests in the suite.

Cypress

describe('My Test Suite', () => {
  [1](() => {
    cy.log('Setup before all tests')
  })

  it('Test 1', () => {
    cy.visit('/')
  })
})

Drag options to blanks, or click blank then click option'

Abefore

BbeforeEach

Cafter

DafterEach

Attempts:

3 left

💡 Hint

Common Mistakes

Using beforeEach instead of before causes the setup to run before every test, not once.

The before hook runs once before all tests in the suite. It is used for setup steps.

2fill in blank

medium

Complete the code to run a cleanup step after each test in the suite.

Cypress

describe('My Test Suite', () => {
  [1](() => {
    cy.log('Cleanup after each test')
  })

  it('Test 1', () => {
    cy.visit('/')
  })
})

Drag options to blanks, or click blank then click option'

AbeforeEach

BafterEach

Cafter

Dbefore

Attempts:

3 left

💡 Hint

Common Mistakes

Using after instead of afterEach causes the cleanup to run only once after all tests.

The afterEach hook runs after each test in the suite. It is used for cleanup steps.

3fill in blank

hard

Fix the error in the hook name to run code after all tests.

Cypress

describe('My Test Suite', () => {
  [1](() => {
    cy.log('Runs after all tests')
  })

  it('Test 1', () => {
    cy.visit('/')
  })
})

Drag options to blanks, or click blank then click option'

AafterEach

BafterAll

Cafter

Dbefore

Attempts:

3 left

💡 Hint

Common Mistakes

Using afterAll causes an error because Cypress does not support it.

The correct hook to run code after all tests is after. afterAll is not a valid Cypress hook.

4fill in blank

hard

Fill both blanks to run setup before each test and cleanup after each test.

Cypress

describe('My Test Suite', () => {
  [1](() => {
    cy.log('Setup before each test')
  })

  [2](() => {
    cy.log('Cleanup after each test')
  })

  it('Test 1', () => {
    cy.visit('/')
  })
})

Drag options to blanks, or click blank then click option'

AbeforeEach

Bafter

CafterEach

Dbefore

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing up before and beforeEach or after and afterEach.

beforeEach runs before each test for setup, and afterEach runs after each test for cleanup.

5fill in blank

hard

Fill all three blanks to run setup once before all tests, setup before each test, and cleanup once after all tests.

Cypress

describe('My Test Suite', () => {
  [1](() => {
    cy.log('Setup once before all tests')
  })

  [2](() => {
    cy.log('Setup before each test')
  })

  [3](() => {
    cy.log('Cleanup once after all tests')
  })

  it('Test 1', () => {
    cy.visit('/')
  })
})

Drag options to blanks, or click blank then click option'

AbeforeEach

Bafter

Cbefore

DafterEach

Attempts:

3 left

💡 Hint

Common Mistakes

Confusing afterEach with after or beforeEach with before.

before runs once before all tests, beforeEach runs before each test, and after runs once after all tests.