{
  "doc": {
    "id": "api/node-events/after-screenshot-api",
    "title": "After Screenshot Event | Cypress Node Events",
    "description": "The after:screenshot event fires after a screenshot is taken in Cypress.",
    "section": "api",
    "source_path": "/llm/markdown/api/node-events/after-screenshot-api.md",
    "version": "24a73f8a97175663aaffd3b016289fb2a523a4ea",
    "updated_at": "2026-05-14T20:17:33.301Z",
    "headings": [
      {
        "id": "api/node-events/after-screenshot-api#after-screenshot-event",
        "text": "After Screenshot Event",
        "level": 1
      },
      {
        "id": "api/node-events/after-screenshot-api#syntax",
        "text": "Syntax",
        "level": 2
      },
      {
        "id": "api/node-events/after-screenshot-api#usage",
        "text": "Usage",
        "level": 2
      },
      {
        "id": "api/node-events/after-screenshot-api#modify-screenshot-details",
        "text": "Modify screenshot details",
        "level": 3
      },
      {
        "id": "api/node-events/after-screenshot-api#modify-screenshot-path",
        "text": "Modify screenshot path",
        "level": 4
      },
      {
        "id": "api/node-events/after-screenshot-api#see-also",
        "text": "See also",
        "level": 2
      }
    ]
  },
  "chunks": [
    {
      "id": "api/node-events/after-screenshot-api#syntax",
      "doc_id": "api/node-events/after-screenshot-api",
      "heading": "Syntax",
      "heading_level": 2,
      "content_markdown": "## Syntax\n\n⚠️ This code is part of the [setupNodeEvents](/llm/markdown/app/plugins/plugins-guide.md#Using-a-plugin) function and thus executes in the Node environment. You cannot call `Cypress` or `cy` commands in this function, but you do have the direct access to the file system and the rest of the operating system.\n\n*   cypress.config.js\n*   cypress.config.ts\n\n```\nconst { defineConfig } = require('cypress')module.exports = defineConfig({  // setupNodeEvents can be defined in either  // the e2e or component configuration  e2e: {    setupNodeEvents(on, config) {      on('after:screenshot', (details) => {        /* ... */      })    },  },})\n```\n\n```\nimport { defineConfig } from 'cypress'export default defineConfig({  // setupNodeEvents can be defined in either  // the e2e or component configuration  e2e: {    setupNodeEvents(on, config) {      on('after:screenshot', (details) => {        /* ... */      })    },  },})\n```\n\n**details _(object)_**\n\nAn object describing the screenshot that was taken, with the following properties:\n\n| Property | Type | Description |\n| --- | --- | --- |\n| `size` | `number` | The size of the image file (in bytes). |\n| `takenAt` | `string` | The date and time the screenshot was taken. ISO 8601 format in UTC (example: `'2020-03-09T07:30:37.686Z'`) |\n| `duration` | `number` | Duration taking and saving the screenshot (in milliseconds). |\n| `dimensions` | `object` | The width and height of the image in pixels (example: `{ width: 100, height: 50 }`) |\n| `multipart` | `boolean` | Whether the screenshot was stitched together from multiple screenshot images. |\n| `pixelRatio` | `number` | _(Optional)_ The ratio of screenshot pixels to the browser's displayed pixels. |\n| `name` | `string` | _(Optional)_ The `fileName` argument passed in via [cy.screenshot()](/llm/markdown/api/commands/screenshot.md#Arguments) |\n| `specName` | `string` | The name of the specfile where the screenshot was taken. |\n| `path` | `string` | The absolute path to the image. |\n| `scaled` | `boolean` | Whether the application under test was scaled to fit into the browser viewport. May be `scale` argument passed in via [cy.screenshot()](/llm/markdown/api/commands/screenshot.md#Arguments) |\n| `blackout` | `array` | The `blackout` argument passed in via [cy.screenshot()](/llm/markdown/api/commands/screenshot.md#Arguments) |\n",
      "section": "api",
      "anchors": [
        "syntax"
      ],
      "path": "/llm/json/chunked/api/node-events/after-screenshot-api.json",
      "token_estimate": 453
    },
    {
      "id": "api/node-events/after-screenshot-api#usage",
      "doc_id": "api/node-events/after-screenshot-api",
      "heading": "Usage",
      "heading_level": 2,
      "content_markdown": "## Usage\n\n### Modify screenshot details\n\nUsing [setupNodeEvents](/llm/markdown/app/plugins/plugins-guide.md#Using-a-plugin) you can tap into the `after:screenshot` event.\n\nIf you change the `path`, `size` or `dimensions` of the image, you'll want to update the new values so that the details are correctly reported in the test results. _Any other properties besides `path`, `size`, and `dimensions` will be ignored._\n\nYou can return an object or a promise that resolves to an object from the callback function. _Any type of returned value other than an object will be ignored._ The object can contain the following properties:\n\n*   **path**: The absolute path to the current location of the image\n*   **size**: The size of the current image file (in bytes)\n*   **dimensions**: The width and height of the current image in pixels (as an object with the shape `{ width: 100, height: 50 }`)\n\nThe properties will be merged into the screenshot details and passed to the `onAfterScreenshot` callback (if defined with [Cypress.Screenshot.defaults()](/llm/markdown/api/cypress-api/screenshot-api.md) and/or [cy.screenshot()](/llm/markdown/api/commands/screenshot.md)).\n\n#### Modify screenshot path\n\nIf you move the location of the screenshot image, you'll want to specify the new `path` of the image.\n\n*   cypress.config.js\n*   cypress.config.ts\n\n```\nconst { defineConfig } = require('cypress')const fs = require('fs')module.exports = defineConfig({  // setupNodeEvents can be defined in either  // the e2e or component configuration  e2e: {    setupNodeEvents(on, config) {      on('after:screenshot', (details) => {        console.log(details) // print all details to terminal        const newPath = '/new/path/to/screenshot.png'        return new Promise((resolve, reject) => {          // fs.rename moves the file to the existing directory 'new/path/to'          // and renames the image to 'screenshot.png'          fs.rename(details.path, newPath, (err) => {            if (err) return reject(err)            // because we renamed and moved the image, resolve with the new path            // so it is accurate in the test results            resolve({ path: newPath })          })        })      })    },  },})\n```\n\n```\nimport { defineConfig } from 'cypress'import fs from 'fs'export default defineConfig({  // setupNodeEvents can be defined in either  // the e2e or component configuration  e2e: {    setupNodeEvents(on, config) {      on('after:screenshot', (details) => {        console.log(details) // print all details to terminal        const newPath = '/new/path/to/screenshot.png'        return new Promise((resolve, reject) => {          // fs.rename moves the file to the existing directory 'new/path/to'          // and renames the image to 'screenshot.png'          fs.rename(details.path, newPath, (err) => {            if (err) return reject(err)            // because we renamed and moved the image, resolve with the new path            // so it is accurate in the test results            resolve({ path: newPath })          })        })      })    },  },})\n```\n",
      "section": "api",
      "anchors": [
        "usage"
      ],
      "path": "/llm/json/chunked/api/node-events/after-screenshot-api.json",
      "token_estimate": 539
    },
    {
      "id": "api/node-events/after-screenshot-api#modify-screenshot-details",
      "doc_id": "api/node-events/after-screenshot-api",
      "heading": "Modify screenshot details",
      "heading_level": 3,
      "content_markdown": "### Modify screenshot details\n\nUsing [setupNodeEvents](/llm/markdown/app/plugins/plugins-guide.md#Using-a-plugin) you can tap into the `after:screenshot` event.\n\nIf you change the `path`, `size` or `dimensions` of the image, you'll want to update the new values so that the details are correctly reported in the test results. _Any other properties besides `path`, `size`, and `dimensions` will be ignored._\n\nYou can return an object or a promise that resolves to an object from the callback function. _Any type of returned value other than an object will be ignored._ The object can contain the following properties:\n\n*   **path**: The absolute path to the current location of the image\n*   **size**: The size of the current image file (in bytes)\n*   **dimensions**: The width and height of the current image in pixels (as an object with the shape `{ width: 100, height: 50 }`)\n\nThe properties will be merged into the screenshot details and passed to the `onAfterScreenshot` callback (if defined with [Cypress.Screenshot.defaults()](/llm/markdown/api/cypress-api/screenshot-api.md) and/or [cy.screenshot()](/llm/markdown/api/commands/screenshot.md)).\n\n#### Modify screenshot path\n\nIf you move the location of the screenshot image, you'll want to specify the new `path` of the image.\n\n*   cypress.config.js\n*   cypress.config.ts\n\n```\nconst { defineConfig } = require('cypress')const fs = require('fs')module.exports = defineConfig({  // setupNodeEvents can be defined in either  // the e2e or component configuration  e2e: {    setupNodeEvents(on, config) {      on('after:screenshot', (details) => {        console.log(details) // print all details to terminal        const newPath = '/new/path/to/screenshot.png'        return new Promise((resolve, reject) => {          // fs.rename moves the file to the existing directory 'new/path/to'          // and renames the image to 'screenshot.png'          fs.rename(details.path, newPath, (err) => {            if (err) return reject(err)            // because we renamed and moved the image, resolve with the new path            // so it is accurate in the test results            resolve({ path: newPath })          })        })      })    },  },})\n```\n\n```\nimport { defineConfig } from 'cypress'import fs from 'fs'export default defineConfig({  // setupNodeEvents can be defined in either  // the e2e or component configuration  e2e: {    setupNodeEvents(on, config) {      on('after:screenshot', (details) => {        console.log(details) // print all details to terminal        const newPath = '/new/path/to/screenshot.png'        return new Promise((resolve, reject) => {          // fs.rename moves the file to the existing directory 'new/path/to'          // and renames the image to 'screenshot.png'          fs.rename(details.path, newPath, (err) => {            if (err) return reject(err)            // because we renamed and moved the image, resolve with the new path            // so it is accurate in the test results            resolve({ path: newPath })          })        })      })    },  },})\n```\n",
      "section": "api",
      "anchors": [
        "modify-screenshot-details"
      ],
      "path": "/llm/json/chunked/api/node-events/after-screenshot-api.json",
      "token_estimate": 536
    },
    {
      "id": "api/node-events/after-screenshot-api#modify-screenshot-path",
      "doc_id": "api/node-events/after-screenshot-api",
      "heading": "Modify screenshot path",
      "heading_level": 4,
      "content_markdown": "#### Modify screenshot path\n\nIf you move the location of the screenshot image, you'll want to specify the new `path` of the image.\n\n*   cypress.config.js\n*   cypress.config.ts\n\n```\nconst { defineConfig } = require('cypress')const fs = require('fs')module.exports = defineConfig({  // setupNodeEvents can be defined in either  // the e2e or component configuration  e2e: {    setupNodeEvents(on, config) {      on('after:screenshot', (details) => {        console.log(details) // print all details to terminal        const newPath = '/new/path/to/screenshot.png'        return new Promise((resolve, reject) => {          // fs.rename moves the file to the existing directory 'new/path/to'          // and renames the image to 'screenshot.png'          fs.rename(details.path, newPath, (err) => {            if (err) return reject(err)            // because we renamed and moved the image, resolve with the new path            // so it is accurate in the test results            resolve({ path: newPath })          })        })      })    },  },})\n```\n\n```\nimport { defineConfig } from 'cypress'import fs from 'fs'export default defineConfig({  // setupNodeEvents can be defined in either  // the e2e or component configuration  e2e: {    setupNodeEvents(on, config) {      on('after:screenshot', (details) => {        console.log(details) // print all details to terminal        const newPath = '/new/path/to/screenshot.png'        return new Promise((resolve, reject) => {          // fs.rename moves the file to the existing directory 'new/path/to'          // and renames the image to 'screenshot.png'          fs.rename(details.path, newPath, (err) => {            if (err) return reject(err)            // because we renamed and moved the image, resolve with the new path            // so it is accurate in the test results            resolve({ path: newPath })          })        })      })    },  },})\n```\n",
      "section": "api",
      "anchors": [
        "modify-screenshot-path"
      ],
      "path": "/llm/json/chunked/api/node-events/after-screenshot-api.json",
      "token_estimate": 327
    }
  ]
}