[microsoft/playwright]仅适用于 chromium 浏览器使用 page.screenshot api 捕获屏幕截图时出现微小的像素差异噪声

您能为我们提供复制品以便我们可以在本地运行吗？如果它可以与 Puppeteer 配合使用，那么您可以为我们提供两个脚本，一个用于 Playwright，另一个用于 Puppeteer，这样我们就可以更好地进行调查，那就太好了。

您使用的是哪个主机操作系统和 Playwright 版本？由于 Linux 意义重大，我看到了两个不同的 Playwright 版本。

您好，这是回购步骤。我已经检查了我们在故事书文件夹中的存储库本身中捕获屏幕截图的 html。请告知这是否有效。

基本上它会打开故事书网址，等待 4 秒，截取屏幕截图，等待 2 秒，然后再次截取屏幕截图。

拍摄 2 个屏幕截图的原因是检查问题是否出在加载页面或 .screenshot api 中

1. 克隆sunilsurana/repoissue
2. 运行 npm 安装
3. 运行 npm run build
4. 多次运行 npm run chrome 以获得剧作家 chrome 屏幕截图
5. 多次运行 npm run firefox 获取剧作家 firefox 截图
6. 多次运行 npm run pupp-chrome 以获得 pupeteer chrome 屏幕截图
7. 执行 ls 或 dir 并查看字节差异

我在 Windows 和 ubuntu 中尝试过，我们看到相同的结果。剧作家版本1.27.1

另外有趣的是，如果我们在 headful 模式下打开 pupeteer，有时它会产生噪音。

这里有一些目录输出，提到了屏幕截图的大小

剧作家与火狐浏览器

铬傀儡师

剧作家与铬

谢谢你！我的同事会看一下。

@sunilsurana 我运行了多次以下命令，但没有任何运气：

npm run chrome
# check for differences in images
magick compare -verbose -metric mae  playwright-chrome-run_1_A.png playwright-chrome-run_1_B.png diff.png

生成的屏幕截图对我来说总是相同的。

您能分别附上您在这里获得的两张图片吗？

@aslushnikov 您好，您可能需要运行 npm run chrome 2 次，然后查看 chrome 启动 2 次时的差异。 _A 和 _B 是在同一浏览器上捕获屏幕截图时的情况。我刚刚添加它是为了检查是否由于屏幕截图方法或启动新的 chrome 实例而发生差异

@sunilsurana 啊，还是没有运气。

for i in {1..15}; do npm run chrome; done

@sunilsurana，所以如果您可以通过附加差异的屏幕截图来提供帮助，我将不胜感激！

哦。对你来说，它始终如一。我将在明天早上之前重新运行并附上屏幕截图。同时您能否告知您正在运行什么操作系统？

@sunilsurana 是的，太棒了，我能够在 Linux 上重现这个！

顺便说一句，只是好奇您在哪个平台上获得了一致的屏幕截图？另外想让您知道，我们有大约 1400 个屏幕截图，其中只有这 2-3 个屏幕截图显示了差异，其余的都很好。屏幕截图附在该线程的第一篇文章中。如果你看到它总是在人物照片的边界上。我猜 chrome 可能会做一些边框平滑之类的事情。我尝试将剧作家的默认启动选项与 pupeeter 中的默认启动选项相匹配，但这并没有解决问题。

只是好奇您在哪个平台上获得了一致的屏幕截图？

@sunilsurana 对我来说，macOS 上的结果是稳定的

@aslushnikov 只是检查一下，找到原因有运气吗？

@sunilsurana 好吧，长话短说：浏览器渲染不能保证是确定性的，因此相同的输入可能会不时产生不同的像素。对我来说这看起来像这个案例。

是的。奇怪的是，对于 Firefox，屏幕截图总是确定性的，对于 pupeeter 和 chromium 也是如此。不确定他们是否禁用或使用某些不同的标志来渲染或捕获屏幕截图

仅供参考，我也尝试过使用 webkit，并且使用 webkit 时，屏幕截图每次都会匹配。我已经在同一仓库命令中检查了与 webkit 相关的更改，命令是“npm run webkit”

@sunilsurana，我们不知道 webkit 或 firefox 呈现非确定性，所以我希望屏幕截图能够匹配。

我在 Windows 上也有类似的问题。我尝试制作屏幕截图，但经常出现一张 jpeg 图像与另一张屏幕截图之间略有不同的情况。