Cypress 是一个现代的 JavaScript 端到端测试工具，拥有对测试的易用性和可靠性都有很大的提升。Cyprss 还支持截图功能，并且提供了 cy.screenshot() 方法，可以用来进行页面截图。在实际的测试工作中，有时需要将截图保存到自定义的路径中。本文将介绍如何在 Cypress 中使用 cy.screenshot() 方法时，进行自定义保存路径的操作，并提供示例代码。
步骤
1. 创建自定义目录的文件夹
我们可以在项目中的根目录手动创建一个 screenshots 目录，用于存储测试截图，并在 cypress.json 文件中添加如下配置：
{
"screenshotFolder": "cypress/screenshots"
}2. 更改文件名
默认情况下，Cypress 将截图保存为 "screenshot.png" 的文件名。如果我们需要更改截图的文件名，可以通过 cy.screenshot() 方法传递一个对象参数，例如：
cy.screenshot({
fileName: 'my-screenshot',
...
})3. 自定义保存路径
要将截图保存到自定义的路径中，我们需要将 cy.screenshot() 方法返回的异步 Promise 对象存储在一个变量中，并使用 Node.js 中的 fs 模块将文件复制到目标文件夹中。例如：
-- -------------------- ---- -------
---------------
---
--------------- -- -
----- ------ - ------------------------------------
----- -------- - ---------------------------
----- ---- - ------------------------
------ ------------------ ------ --------- ----- -- -
-- ----- ----- ----
--
--示例代码
下面是一个完整的示例代码，用于在 Cypress 中对页面进行截图，并将结果保存到自定义路径中：
-- -------------------- ---- -------
----- -- - --------------
---------------------- -- -- -
------------- -- -
-------------------------------
---
---------------- -- -- -
------------------------------------------
---------------
-------- -----------
------ -----
--------------------------- -----
---- ----
--------------- -- -
----- ------ - ------------------------------------
----- -------- - ---------------------------
----- ---- - ------------------------
------ ------------------ ------ --------- ----- -- -
-- ----- ----- ----
--------------- ----------
--
--
--
--总结
本文介绍了在 Cypress 中使用 cy.screenshot() 方法进行页面截图时，如何进行自定义保存路径的操作，并提供了示例代码。Cypress 拥有丰富的测试功能，能够大大提升测试效率。希望本文能为大家提供一些帮助，更好地使用 Cypress 进行前端测试。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64c79b865ad90b6d04110bb5