在不调整 cypress 视口大小的情况下捕获元素的屏幕截图

Posted 2023-02-16

【中文标题】在不调整 cypress 视口大小的情况下捕获元素的屏幕截图

【英文标题】：Capture screenshot of an element without resizing the viewport of cypress

【发布时间】：2021-11-19 10:03:47

【问题描述】：

我已经设置了如下的视口。

Cy.viewport(1440,700)

然后截图

Cy.get('xxxx').toMatchImageSnapshot()

但是在截屏时，浏览器会调整大小以适应浏览器窗口的大小。如何控制浏览器的大小调整。

Cypres 包 v- 8.3.1

【参考方案1】：

在截屏时覆盖默认的fullPage 捕获选项：

cy.get('xxxx').toMatchImageSnapshot(capture: 'viewport');

或者像这样在cypress/support/index.js文件中全局设置：

Cypress.Screenshot.defaults(
  capture: 'viewport'
);

参考：https://docs.cypress.io/api/commands/screenshot#Arguments