<ul><li>In Cypress headless mode, screenshots of test errors only show where the error occurred, not the cause.</li><li>A workaround is to create a custom screenshot displaying the error message directly on the page.</li><li>The provided code block listens for the fail event, creates a red banner with the error message, and takes a screenshot with the message displayed.</li><li>This code should be placed in the cypress/support/e2e.ts file for TypeScript or e2e.js for JavaScript.</li></ul>

Tech bits 1 - Cypress screenshot errors in headless mode

Discover more