TestCafé 如何计算来自选择器的元素屏幕截图的大小？

Question

我们正在尝试调试我们在 TestCafé 和 Chrome 之间看到的问题（对于基本用例）我们看到额外的像素被添加到用于做一个快照。我假设这是因为我们的元素比我们想象的要高，但在 Chrome 调试器中，元素的高度看起来是正确的，而在快照中它不是。

我稍微查看了 TestCafé 源代码（从两个方向：从 takeElementScreenshot 方法向下和从 pngJS 代码向上）但是无法准确指出快照的大小在哪里take 从传递给 takeElementScreenshot.

的选择器中提取（计算）

谁能指出源代码中发生这种情况的正确位置？谢谢

Answer 1

首先，数据取自文档左上角的元素： https://github.com/DevExpress/testcafe/blob/master/src/client/driver/command-executors/browser-manipulation/index.js#L50

然后，它被转换为相对于文档可见部分的值： https://github.com/DevExpress/testcafe/blob/master/src/client/driver/command-executors/browser-manipulation/ensure-crop-options.js

这里计算出切割的像素坐标： https://github.com/DevExpress/testcafe/blob/master/src/screenshots/crop.js