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

【问题标题】：Capture screenshot of an element without resizing the viewport of cypress在不调整 cypress 视口大小的情况下捕获元素的屏幕截图
【发布时间】：2021-11-19 10:03:47
【问题描述】：

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

Cy.viewport(1440,700)

然后截图

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

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

Cypres 包 v- 8.3.1

【问题讨论】：

标签： cypress cypress-cucumber-preprocessor cypress-component-test-runner cypress-psoc

【解决方案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

【讨论】：