Dual commands in Cypress - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ Predict Output

intermediate

What is the output of this Cypress dual command chaining?

Consider the following Cypress test code. What will be the text content of the element after the commands run?

Cypress

cy.get('#message').invoke('text').then(text => {
  cy.get('#message').should('contain.text', text);
});

A The test fails because 'should' cannot be used after 'then'.

B The test passes if the element with id 'message' contains its own text content.

C The test passes but the text content is always empty.

D The test fails because 'invoke' cannot be chained with 'then'.

💡 Hint

Remember that Cypress commands are asynchronous and 'then' waits for the previous command to resolve.

The code gets the text of the element with id 'message' and then asserts that the element contains that text. This is a valid dual command chaining pattern in Cypress.

❓ assertion

intermediate

Which assertion correctly verifies the value after a dual command?

You want to check that an input field with id 'email' has the value '[e-mail]' using Cypress dual commands. Which assertion is correct?

Cypress

cy.get('#email').invoke('val').then(value => {
  // assertion here
});

A expect(value).to.contain('[e-mail]');

B assert.equal(value, '[e-mail]');

C expect(value).to.equal('[e-mail]');

D assert.isTrue(value === '[e-mail]');

💡 Hint

Use the most direct equality assertion for exact value matching.

The 'expect' assertion with 'to.equal' checks exact equality, which is appropriate here. 'to.contain' would allow partial matches, which is not precise enough.

🔧 Debug

advanced

Why does this Cypress dual command fail to find the element?

Examine the code below. Why does the test fail with 'Timed out retrying: Expected to find element: #submit, but never found it.'?

Cypress

cy.get('#form').then(form => {
  cy.wrap(form).find('#submit').click();
});

A Because 'then' yields a jQuery element, but 'find' must be called on Cypress chainable, so the selector is not found.

B Because 'find' is not a Cypress command and cannot be chained after 'wrap'.

C Because '#submit' does not exist inside '#form' at the time of the test.

D Because 'click' cannot be called inside a 'then' callback.

💡 Hint

Remember the difference between jQuery elements and Cypress chainables.

Inside 'then', 'form' is a jQuery element, but 'find' is a Cypress command that works on Cypress chainables. Using 'cy.wrap(form).find()' returns a Cypress chainable, but if the element is not found, it times out. The failure is due to timing or selector context.

❓ framework

advanced

How does Cypress handle dual commands internally to avoid race conditions?

Which mechanism does Cypress use internally to ensure dual commands like 'get' and 'then' run in the correct order without race conditions?

A Cypress queues commands and executes them sequentially, waiting for each to finish before starting the next.

B Cypress runs all commands in parallel and merges results asynchronously.

C Cypress uses JavaScript Promises but does not queue commands, relying on user callbacks.

D Cypress executes commands immediately without waiting, causing possible race conditions.

💡 Hint

Think about how Cypress manages command execution flow.

Cypress maintains an internal command queue and runs commands one after another, ensuring each command completes before the next starts. This prevents race conditions and makes test execution predictable.

🧠 Conceptual

expert

What is the main advantage of using dual commands in Cypress tests?

Why do Cypress tests often use dual commands like 'cy.get().then()' instead of just chaining commands directly?

A Dual commands are required to use assertions inside Cypress tests.

B Dual commands run commands in parallel to speed up tests.

C Dual commands disable automatic retries to improve test speed.

D Dual commands allow access to the yielded subject for custom logic while preserving Cypress's automatic retries and chaining.

💡 Hint

Consider how Cypress handles asynchronous commands and user callbacks.

Using 'then' after a Cypress command allows you to work with the yielded subject directly in a callback, enabling custom logic while still benefiting from Cypress's automatic retries and command queue. This is the main advantage of dual commands.