Xvfb、Jenkins、Selenium 测试 - 捕获所有页面的屏幕截图 [英] Xvfb, Jenkins, Selenium tests - Capture Screenshots of all pages

问题描述

我正在尝试在以下问题上寻找一些线索，但无法在网上找到好的帮助.

I'm trying to find some clues on the following issues and not able to find good help online.

我在 Linux 机器上以无头模式运行 Xvfb(X 虚拟帧缓冲区)和 firefox.Xvfb 主服务已启动并运行，并设置了 DISPLAY 变量.

I'm running Xvfb (X virtual frame buffer), firefox on a Linux machine in headless mode. Xvfb main service is up and running and DISPLAY variable is set.

/usr/bin/Xvfb :99 -ac -screen 0 1600x1200x16

我有一些基于硒的自动化测试，我正在使用 Gradle (gradle test) 运行这些测试.他们成功运行，在 Jenkins 中我可以使用 Xvfb 插件来完成这项工作.JUnit 发布报告/结果信息和 Gradle 的报告/测试/索引.html 文件显示成功的测试运行.

I have some automated selenium based tests which I'm running using Gradle (gradle test). They run successfully and in Jenkins I'm able to get this working using Xvfb plugin. JUnit post publish report/result info and Gradle's reports/test/index.html file is showing successful test run.

我只是运行以下命令在 Gradle 中运行测试:gradle test -DsomePropConfigFileForEnv=SomeSourceConfigFilewithPathvalue

I just run the following to run tests in Gradle: gradle test -DsomePropConfigFileForEnv=SomeSourceConfigFilewithPathvalue

我的问题:
1.我怎样才能得到这个自动化测试/运行正在呈现的所有页面的屏幕截图(即登录页面，登录后的应用程序主页，用户在这里和那里点击主页(即打开/点击各种选项卡，链接、表格、按钮等)，最后退出页面.

My questions:
1. How can I get the screenshots of all the pages that this automated test/run is rendering (i.e. login page, application main page after login, user clicks on the main page here and there (i.e. opening/clicking on various tabs, links, tables, buttons etc) and finally log out page.

我能够从 Xvfb_screen<N> 文件中获取屏幕截图，该文件是在 -fbdir 文件夹下创建的(我们在运行 Xvfb 时通过Jenkins 作业)，但如果测试成功运行，屏幕截图是黑页(这可能是由于我在下面提到的第二个项目符号)——或者它是有效的单页图像屏幕截图(如果在测试运行期间遇到错误).

I'm able to get the screenshot from the Xvfb_screen<N> file, which is getting created under -fbdir folder (what we specify while running Xvfb via a Jenkins job) but the screenshot is a Black page if test runs successfully (this can be due to the 2nd bullet I mentioned below) --OR it's a valid single page image screenshot (if an error is encountered during the test run).

我正在尝试获取自动化 Selenium 测试正在呈现的所有页面(我作为 -D 参数传递给 Gradle 的配置文件中包含 URL/用户名/浏览器、版本等信息).PS:我尝试使用 Xvfb DISPLAY 虚拟帧缓冲区获取图像截图的不仅仅是一些随机 URL.

I'm trying to get all the pages which the automated Selenium tests are rendering (the config file I passed to Gradle as a -D parameter has URLs / user name / browser, version etc info in it). PS: It's not just for some random URL that I'm trying to get an image screenshot using Xvfb DISPLAY virtual frame buffer.

1. 在测试期间，我看到有一个有效的虚拟帧缓冲区文件，其大小有效.

例如:当 Jenkins 作业正在进行并运行 Gradle 测试任务并且 Xvfb 插件启动了一个新的 xvfb 实例时，我看到了:

For ex: While Jenkins job is in progress and running Gradle test task and Xvfb plugin has started a new xvfb instance, I see:

/production/JSlaves/kobaloki2_1/xvfb-2015-02-04_01-16-37-6170319257811815857.fbdir/Xvfb_screen0

但是一旦测试完成(或我们的错误)，这个文件就会从这个 xxxx.fbdir 文件夹中删除并且根本没有文件.

but as soon as the test is complete (or errors our), this file is getting deleted from this xxxx.fbdir folder and there's no file at all.

为什么这个文件会被删除.

如果它会保留在那里，那么我可以使用 xwd/xwud 命令和其他工具(imagemagick convert 等命令)创建图像文件作为 POST BUILD 操作，甚至在调用 Gradle"步骤之后的 BUILD 部分中.

If it'll remain there, then I can use xwd/xwud command and other tools (imagemagick convert etc commands) to create an image file as a POST BUILD action or even within the BUILD section after "Invoke Gradle" step.

以下命令将创建一个 .png 的 firefox 屏幕截图(只有一页屏幕截图)的图像文件，并假设 xvfb 在 DISPLAY=:107 上运行

The following command will create a .png image file of the firefox screenshot (only one page screenshot) and assuming xvfb is running on DISPLAY=:107

xwd -root -display :107 | convert xwd:- /tmp/capture2.png

以及下面的 xvfb 进程(仍在运行，其中包含一个有效的 Xvfb_screen**** 文件 - 由 Jenkins 作业创建，其中 Xvfb 插件配置为偏移基数 100，7 是节点/内部版本号因此，将 :107 作为 DISPLAY 编号).

and the following xvfb process (which is still running, containing a valid Xvfb_screen**** file in it - which was created by the Jenkins job where Xvfb plugin is configured with offset base 100 and 7 is the node/build number thus, making :107 as DISPLAY number).

u10002  30717 19950  1 01:16 ?        00:00:00 Xvfb :107 -screen 0 1024x768x8 -fbdir /production/JSlaves/kobaloki2_1/xvfb-2015-02-04_01-16-37-6170319257811815857.fbdir

1. 我没有运行 Xvfb/Imagemagick 等来获取 URL 的图像(例如:www.google.com)，而是尝试获取所有屏幕截图，测试在 Xvfb 内存虚拟帧缓冲区/文件后面呈现什么试运行.

是否有任何其他工具(简单到可以安装而不会弄乱 Linux 服务器)可以实现相同的效果(捕获测试在 Xvf/firefox/Linux 服务器后面以无头方式呈现的所有页面的屏幕截图)?

Are there any other tools (simple enough to install without messing up with the Linux server) which can achieve the same (capturing screenshots of all the pages that a test is rendering behind Xvf/firefox/Linux server in Headless way)?

我也尝试过 Selenium Grid 服务器，但 FF 在那里运行(由于某种原因)，因此我尝试使用 Jenkins、Gradle、Xvfb 插件在 Linux 服务器(无头模式)上使用 firefox 浏览器和计划有N号.执行者运行这些测试的多次运行并最终捕获每次运行的结果.

I also tried Selenium Grid server, but FF is acting up there (due to some reason) thus I'm trying to run these tests using Jenkins, Gradle, Xvfb plugin on a Linux server (Headless mode) using firefox browser and planning to have N no. of executors to run multiple runs of these tests and finally capturing the results per run.

我正在归档工件(如果有的话)并使用 Image Gallery 插件，但没有在 Xvfb/firefox 后面的 Selenium 中运行的所有渲染页面的图像.

I'm archiving the artifacts (if any) and using Image Gallery plugin as well, but don't have the images for all the rendered pages which ran in Selenium behind Xvfb/firefox.

非常感谢任何输入.

谢谢.

推荐答案

好的，这就是我所做的.这种方法不需要对项目的源代码进行任何更改.

OK, this is what I did. This approach doesn't require any change to the source code of the project.

1. 在 RHEL 上安装了 imagemagick (..ck)，即 yum install imagemagick.
   
2. 在目标服务器上创建了一个脚本，它现在可以工作了.我所做的只是，在 Jenkins 工作中，当我已经启动了 Xvfb 实例(在 Jenkins 中使用 Xvfb 插件)，然后在通过 Gradle(或任何构建工具)运行 Selenium GUI 测试之前一秒钟，我调用以下命令脚本并传递参数(其中 DISPLAY 变量值可用于 Jenkins 作业，因为我们在其中使用 Xvfb 插件).在测试结束时，脚本自动存在(因为 xwd 命令不再获得任何输入，因此它正常退出)最后我在 Jenkins 上发布图像和 .mp4(视频)文件(作为显示测试的侧栏链接结果/视频)并存档工件(使用Image Galary Plugin"的.png图像文件和.mp4文件).
   
3. 注意:这要求您的机器安装:imagemagick、xwd 和 ffmpeg.如果传递给任何命令的选项不同，则 acc.到您的操作系统机器，然后相应地调整它.ffmpeg 命令中的帧率值可以是分数，即 1/5 或 0.5 或 15 或任何你想要的(试试看你会得到什么).
   
4. 是否要归档如此大量的数据由您决定.如果您有足够的空间，并且您的 Jenkins 工作有更好的旧构建清洁保留政策，您可以这样做.

1. Installed imagemagick (..ck) i.e. yum install imagemagick on RHEL.
   
2. Created a script on the target server and it works now. All I do is, in the Jenkins job, when I have already started the Xvfb instance (using Xvfb plugin in Jenkins), then just a second before before running the Selenium GUI tests via Gradle (or any build tool), I call the following script and pass the parameters (where DISPLAY variable value is available to the Jenkins job as we are using Xvfb plugin in it). At the end of tests, the script exists automatically (as xwd command doesn't get any more input so it exits gracefully) and finally I publish the images and .mp4 (video) file on Jenkins (as a side bar link to show Test results / video) and archive the artifacts (.png image files using "Image Galary Plugin" and .mp4 file).
   
3. NOTE: This requires that your machine has: imagemagick, xwd and ffmpeg installed. If the options passed to any commands differs acc. to your OS machine, then tweak it accordingly. The framerate value in ffmpeg command can be a fraction i.e. 1/5 or 0.5 or 15 or anything you want (try it and see what you get).
   
4. It's up to you, if you want to ARCHIVE this big amount of data or not. You can do it if you have good space and if your Jenkins job have a better old build clean retention policies.

<小时>

#!bin/bash
##
## This script will capture Screenshot (every 0.1 seconds) of an automated GUI (for ex: Selenium tests) tests running behind a HEADLESS Xvfb display instance.
## Then, it'll create a mp4 format movie using the captured screenshots.
##
## Machine where you run this script, should have: Xvfb service running, a session started by Xvfb plugin via Jenkins, xwd,ffmpeg OS commands and imagemagick (utilities).
## - For ex, try this on RHEL to install imagemagick:  yum install imagemagick
##
## Variables
ws=$1;                                                  ## Workspace folder location
d=$2; d=$(echo $d | tr -d ':');                         ## Display number associated with the Xvfb instance started by Xvfb plugin from a Jenkins job
wscapdir=${ws}/capturebrowserss;                        ## Workspace capture browser's screen shot folder
if [[ -n $3 ]]; then wscapdir=${wscapdir}/$3; fi        ## If a user pass a 3rd parameter i.e. a Jenkins BUILD_NUMBER, then create a child directory with that name to archive that specific run.
i=1;
rm -fr ${wscapdir} 2>/dev/null || ( echo - Oh Oh.. Cant remove ${wscapdir} folder; echo -e "-- Still exiting gracefully! 
"; exit 0);
mkdir -p ${wscapdir}
while : ; do
 xwd -root -display :$d 2>/dev/null | convert xwd:- ${wscapdir}/capFile_${d}_dispId`printf "%08d" $i`.png 2>/dev/null;
 if [[ ${PIPESTATUS[0]} -gt 0 || ${PIPESTATUS[1]} -gt 0 ]]; then echo -e "
-- Something bad happened during xwd or imagemagick convert command, manually check it.
"; exit 0; fi
 ((i++)); sleep 0.1;
done
ffmpeg -r 5 -i ${wscapdir}/capFile_dispId_%08d.png ${wscapdir}/out_byRateOf5.mp4 2>/dev/null || echo -e "
-- Some error occurred (may be too many files opened), exiting gracefully!
";

这篇关于Xvfb、Jenkins、Selenium 测试 - 捕获所有页面的屏幕截图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！