Screenshot capture (cy.screenshot) in Cypress - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to take a screenshot of the current page.

Cypress

cy.[1]()

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

Avisit

Bclick

Cscreenshot

Dtype

Attempts:

3 left

💡 Hint

Common Mistakes

Using commands like 'click' or 'type' instead of 'screenshot'.

Forgetting the parentheses after the command.

The cy.screenshot() command captures a screenshot of the current page.

2fill in blank

medium

Complete the code to take a screenshot with a custom file name 'home-page'.

Cypress

cy.screenshot({ name: '[1]' })

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

Alogin-page

Bhome-page

Cdashboard

Derror-page

Attempts:

3 left

💡 Hint

Common Mistakes

Using a wrong or unrelated name.

Not passing the name as a string.

Setting the name option to 'home-page' names the screenshot file accordingly.

3fill in blank

hard

Fix the error in the code to correctly capture a screenshot of an element with selector '#submit-btn'.

Cypress

cy.get('#submit-btn').[1]()

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

Ascreenshot

Bclick

Ctype

Dvisit

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'click' or 'type' instead of 'screenshot'.

Trying to call screenshot without chaining it to an element.

The screenshot() command can be chained after cy.get() to capture a screenshot of a specific element.

4fill in blank

hard

Fill both blanks to take a screenshot with the name 'login-form' and capture only the element with selector '.form-container'.

Cypress

cy.get('[1]').screenshot({ name: '[2]' })

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

A.form-container

B.submit-button

Clogin-form

Dhome-page

Attempts:

3 left

💡 Hint

Common Mistakes

Mixing up selectors and names.

Using unrelated selectors or names.

We select the element '.form-container' and name the screenshot 'login-form'.

5fill in blank

hard

Fill all three blanks to take a full-page screenshot named 'full-home' with the option to capture beyond the viewport.

Cypress

cy.screenshot('[1]', { [2]: 'fullPage', [3]: 500 })

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

Afull-home

Bcapture

Ctimeout

Dhome-page

Attempts:

3 left

💡 Hint

Common Mistakes

Not setting 'capture' to 'fullPage'.

Using wrong option names or missing the timeout.

The first blank is the screenshot name 'full-home'. The second blank is the option 'capture' set to 'fullPage' to capture the entire page. The third blank is 'timeout' set to 500 milliseconds.