javascript - Cypress เปลี่ยนเส้นทางของภาพหน้าจอ=ข้อผิดพลาด: EPERM: การดำเนินการไม่อนุญาต, เปลี่ยนชื่อ

ฉันกำลังลองใช้โค้ดที่พบในเอกสารของ Cypress ซึ่งอนุญาตให้ผู้ใช้ Cypress ปรับเปลี่ยนเส้นทางของภาพสกรีนช็อตได้

ฉันได้ลองตัวอย่างที่พวกเขาให้มาแล้ว แต่ฉันกำลังมีปัญหาเกี่ยวกับสิทธิ์

ข้อผิดพลาด: EPERM: ไม่อนุญาตให้ดำเนินการ, เปลี่ยนชื่อ 'c:mydocuments/cypress/example/dist.cypress/app/screemshots/login.cy.ts -- my first test (failed).png' -> 'c:/myscreenshots/screenshot.png'

https://docs.cypress.io/api/plugins/after-screenshot-api#Usage

ระบบ: Windows 10 และ 11
IDE: Visual Studio Code
ใช้ NX Workspace

// cypress.config.js

{ 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) {`your text`
      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 })
          })
        })
      })
    },
  },
})`

โค้ดของฉัน

const { defineConfig } = require('cypress')
const fs = require('fs')
const { Runnable } = require('mocha')

module.exports = defineConfig({
e2e: {
    setupNodeEvents(on, config) {
        on('after:screenshot', (details) => {
            console.log(details) // print all details to terminal
       const testNmae=Cypress.spec.name.replace(/\.|\/|\s/g,'_')
       const timeStamp = newDate().toISOString().replace(/:/g,'_')
       const filename = '${testname}--${timeStamp} (failed).png'
       const newPath = 'cypress/myscreenshots/${filename}'
    if (!fs.existsSync(newPath)) {fs.mkdirSync(newPath, {recursive: true });}
    return new Promise((resolve, reject) => {
    fs.rename(details.path, newPath, (err) => {if (err) return reject(err)
resolve({ path: newPath })
          })
        })
      })
    },
  },
})

ผลลัพธ์ :

1. template spec ผ่าน: ข้อผิดพลาด: EPERM: ไม่อนุญาตให้ดำเนินการ, เปลี่ยนชื่อ 'D:\Cypress\projects\example\cypress\screenshots\spec.cy.js\template spec -- passes (failed).png' -> 'D:\Cypress\projects\example\cypress\myscreenshots'

คำตอบ #1

ข้อความแสดงข้อผิดพลาดเกิดจากการที่คุณเรียกใช้ fs.mkdirSync ซึ่งไม่จำเป็น

แต่กับโค้ดนั้น คุณยังไม่สามารถไปได้ไกลขนาดนั้น - การเรียก Cypress.spec.name จะให้ข้อผิดพลาดที่ต่างออกไป - ดังนั้นฉันจึงค่อนข้างสับสนเกี่ยวกับความไม่สอดคล้องกันในคำถาม

ในกรณีใดๆ

• Cypress.spec.name สามารถใช้ได้เฉพาะในการทดสอบเท่านั้น ไม่สามารถใช้ในเหตุการณ์ปลั๊กอินได้
• พารามิเตอร์ details มีคุณสมบัติ specName แต่ไม่ได้ส่งค่าใด ๆ ฉันสันนิษฐานว่านั่นเป็นบั๊กในโค้ด Cypress เนื่องจากคุณสมบัตินี้มีอยู่ มันควรมีชื่อสเปคอยู่ด้วย
• ในการหลีกเลี่ยงปัญหานั้น ให้เพิ่มงานเพื่อส่งชื่อสเปคเข้าไปยังปลั๊กอินจากการทดสอบ หลังจากที่ Cypress แก้ไขปัญหาได้แล้ว คุณสามารถย้อนกลับได้

นี่คือโค้ดทั้งหมด:

const { defineConfig } = require("cypress");
const fs = require('fs')

let specName;   // temporary until bug fix

module.exports = defineConfig({
  e2e: {
    setupNodeEvents(on, config) {
      on('task', {
        sendSpecNameToPlugin: (name) => specName = name 
      })
      on('after:screenshot', (details) => {
        const testname = (details.specName || specName)  // temporary until bug fix
          .replace(/\.|\/|\s/g,'_')
        const timeStamp = new Date().toISOString().replace(/:/g,'_')
        const filename = `${testname}--${timeStamp} (failed).png`
        const newPath = `cypress/myscreenshots/${filename}`

        return new Promise((resolve, reject) => {
          fs.rename(details.path, newPath, (err) => {
            if (err) return reject(err)
            resolve({ path: newPath })
          })
        })
      })
    },
  },
})

การทดสอบ:

cy.task('sendSpecNameToPlugin', Cypress.spec.name)
cy.screenshot()

คำตอบ #2

คุณสามารถตั้งค่าโฟลเดอร์ภาพหน้าจอในการกำหนดค่าและช่วยให้ตัวเองประหยัดความยุ่งยากมากมาย

ใน cypress.config.js

const { defineConfig } = require('cypress')

module.exports = defineConfig({
  e2e: {
    baseUrl: 'http://localhost:1234',
  },
  screenshotsFolder: 'cypress\myscreenshots',
})

ด้วยวิธีนี้คุณจะเก็บเส้นทางย่อยของสเปค/ทดสอบไว้และจะไม่มีเรื่องน่าประหลาดใจเมื่อสกรีนช็อตหนึ่งทับอีกรูปหนึ่ง