Cypress · Browser testing end to end
How do screenshots work in Cypress?
Short answer
Cypress captures a screenshot on failure during cypress run, and cy.screenshot captures one on demand. Files go to the configured screenshotsFolder and are useful as CI artifacts.
A screenshot shows the exact rendered state at a moment in the test. In run mode Cypress takes one automatically when a test fails, which is often enough to see a missing element, an error banner or unexpected data. cy.screenshot lets you capture a specific state deliberately.
it("captures the checkout summary", () => {
cy.visit("/checkout");
cy.get("[data-cy=summary]").should("be.visible");
cy.screenshot("checkout-summary", {
capture: "viewport",
overwrite: true,
});
});Configuration and behaviour
- screenshotOnRunFailure controls automatic failure screenshots in run mode
- screenshotsFolder sets the output directory
- cy.screenshot can capture the viewport or the full page
- Screenshots are not taken in open mode by default, because you can inspect the runner directly
- PNG is the default format; JPEG is available for smaller artifacts
Screenshots are diagnostic, not a test oracle. Comparing screenshots across runs requires a visual testing tool and a tolerance for rendering differences. Do not treat a pixel diff as a replacement for asserting behaviour.
Follow-ups you should expect
Interviewers use these to check whether the first answer was understanding or memorisation.
- 1When does Cypress take a screenshot automatically?
- 2How do you capture the full page?
- 3Where are screenshots stored?
- 4Are screenshots a substitute for visual regression testing?
Say it in the interview
Cypress takes a screenshot automatically when a test fails in run mode, and cy.screenshot captures one on demand. The files land in screenshotsFolder, and I upload them as CI artifacts so a failure can be inspected without rerunning locally. I treat screenshots as diagnostics, not as assertions. Visual regression needs a dedicated comparison tool with tolerance for rendering differences.
Use this as a model, not a script. Saying it in your own words is what makes it survive follow-up pressure.
Related questions
Reading is step one
Now say it out loud.
Understanding an answer and delivering it under pressure are different skills. Rehearse this topic in a live Cypress mock interview and get scored feedback on depth, clarity and confidence.