多次执行 cypress 并将结果保存在 Cypress 版本 12.10.0 中的不同屏幕截图文件夹中：解决问题

Question

我正在尝试创建一个文件夹来将从 Cypress 捕获的屏幕截图保存在屏幕截图内的自定义文件夹中，其中在 ScreenshotFolder 文件夹中，将为每次执行 run.cypress() 动态添加一个带有日期的文件夹，但它不起作用。

问题是，当执行代码 run.cypress() 时，最后它会更改我放置的路线并保留默认路线。

代码可以执行，如下：

const cypress = require('cypress');
const fs = require('fs');
const path = require('node:path'); 

//Function that create the test run
var createRunTest = async function (info, folderNameResults){

   //Datetime will be modified every time that the function is called
   var datetime2 = new Date(); //test start date
   datetime2 = datetime2.toISOString().slice(0, 19).replace('T', '_');
   datetime2 = datetime2.replace(/:\s*/g, '_');

   //Then I create the folders of the results for reports and screenshots with the number of execution and his datetime
   //Creation datetime folder in reports (time it runs)
   var reportsFolder = path.join(__dirname, 'cypress', 'reports', folderNameResults, cronInfo.execution_num + '_' + datetime2);
   fs.mkdir(reportsFolder, (err) => {
       if (err) {
          if (err.code == 'EEXIST') return console.error("file exist");
          return console.error(err);
       }
   });

   //Creation datetime folder in screenshots (time it runs)
   var screenshotsFolder = path.join(__dirname, 'cypress', 'screenshots', folderNameResults, info.execution_num + '_' + datetime2);
   fs.mkdir(screenshotsFolder, (err) => { 
       if (err) {
          if (err.code == 'EEXIST') return console.error("file exist");
          return console.error(err);
       }
   });


   console.log("It should be: ", screenshotsFolder);

   let results = await cypress.run({
       browser: 'chrome',
       configFile: __dirname + '/cypress.config.js',
       spec: __dirname + '/cypress/e2e/investigation/testWeb.cy.js', //put your test here
       reporter: "cypress-multi-reporters",
       reporterOptions: {
           "reporterEnabled": "mochawesome",
           "mochawesomeReporterOptions": {
               "reportDir": reportsFolder + "/json/",
               "overwrite": false,
               "html": false,
               "json": true
           }
       },
       videosFolder: __dirname + '/cypress/videos',
       screenshotsFolder: screenshotsFolder,
   });
   console.log("But it is this", results.config.screenshotsFolder);

   info.execution_num += 1;

   return;
}



//Here i have information of execution times
var info = {
    id: 1
    created: new Date().toISOString().slice(0, 10),
    execution_num: 0, //execution number
}

var folderNameResults = info.id + '_' + info.created;


//here i create a folder with folderNameResults in directories "cypress/reports/ and cypress/screenshots"
//i.e. remaining as follow: cypress/reports/1_05_17_2023 (and the same with screenshots)

fs.mkdir(__dirname + '/cypress/reports/' + folderNameResults, (err) => { //creation in REPORTS
    if (err) {
        if (err.code == 'EEXIST') return console.error("file exist");
        return console.error(err);
    }
});

fs.mkdir(__dirname + '/cypress/screenshots/' + folderNameResults, (err) => { //creation in SCREENSHOTS
    if (err) {
        if (err.code == 'EEXIST') return console.error("file exist");
        return console.error(err);
    }
});


//Then i call the function to create a execution test
console.log("FIRST EXECUTION"); //increment +1 execution number (1)
createRunTest(info, folderNameResults).then( () => {
    console.log("SECOND EXECUTION");
    //increment +1 execution number (2)
    createRunTest(info, folderNameResults);
});

在第一次执行中，输出显示它不起作用：

It should be:  C:\Users\xeom\Desktop\Ayudantia\v2_script\script/cypress/screenshots/1_2023-05-17/0_2023-05-17_19_32_30

But it is this C:\Users\xeom\Desktop\Ayudantia\v2_script\script\cypress\screenshots

所以发生的情况如下图所示：

包含每次执行的捕获的文件存储在您创建的文件夹之外，并且也会在 testWeb.cy.js 文件夹中覆盖（每个执行文件夹都应该有一个这样命名的文件夹）。< /p>

此外，我们可以看到，通过报告，它的效果非常好。

如何修复它？

Answer 1

Wandille 是正确的，您只是将配置设置在错误的位置 - 所以我怀疑您正在努力学习基础知识。

我建议使用 before() 设置屏幕截图路径，这样更改不仅适用于模块 API 调用，还适用于 cypress run 和 cypress open。

before(() => {
  const folderName = 'ROX';
  const timestamp = (new Date())
    .toISOString()
    .slice(0, 19)
    .replace('T', '_')
    .replace(/:\s*/g, '_')
  
  const myScreenshotsFolder = `${folderName}/${timestamp}`
  
  Cypress.Commands.overwrite('screenshot', (originalFn, subject, ...args) => {
    let {name, userOptions} = args
    name = `${myScreenshotsFolder}/${(name || Cypress.currentTest.title)}`
    originalFn(subject, name, userOptions)
  })
})

注释：

• 您想要的额外路径 myScreenshotsFolder 会自动添加到基本路径 cypress/screenshots

• 您的测试定义文件名 cy.screenshot('some-file-name') 将使用它，否则使用测试标题。这遵循赛普拉斯当前的惯例。

• before() 应放入 cypress/support/e2e.js 文件以供全局使用

Answer 2

screenshotsFolder 应位于 config 部分

let results = await cypress.run({
    browser: 'chrome',
    configFile: __dirname + '/cypress.config.js',
    //spec: __dirname + '/cypress/e2e/investigacion/testWeb.cy.js',
    reporter: "cypress-multi-reporters",
    reporterOptions: {
        "reporterEnabled": "mochawesome",
        "mochawesomeReporterOptions": {
            "reportDir": "cypress/reports/" + folderName + '/' + datetime + "/json/",
            //"reportDir": "cypress/reports/json/",
            "overwrite": false,
            "html": false,
            "json": true
        }
    },
    config:{
       videosFolder: __dirname + '/cypress/videos',
       screenshotsFolder: screenshotsFolder
    }
});

代码来源