PIL屏幕截图爬坑之旅

背景

对于做前端页面进行相关测试的同学来说，经常会手动输入链接，查看页面元素的展示情况。工程繁琐。最近在做前端页面相关的自动化测试，打算通过selenium自动打开页面，然后将利用PIL库中的相关方法结果截取下来保存图片，这样就在工具跑完后，直接查看结果就可以了。可以大大节省测试成本，提高测试效率。

PIL（PythonImageLibrary），是Python平台上图像处理的标准库。功能灰常强大，且简单易用。下面来详细介绍一下基于PIL的屏幕截取和图片切割实现，并把遇到的问题和解决方案分享给大家，共进共勉。

首先下载PIL库

直接pip install会报错。PIL库需要另行下载安装。windows系统，需要下载EXE文件，执行后安装。

屏幕截图

在实际测试过程中，有些项目是需要将整个浏览器的页面保存下来，看整体布局的；也有部分改进的需求，那么整浏览器截屏就显得元素过小，不易查验，此时则需要将指定的区域放大，仅截取此区域进行查验。

普通截图

调用PIL库里的ImageGrab类中的grab()方法，就可以实现图片的截取。方法如下：

滚动截图

如果只需要截取目前浏览的整个屏幕，上个方法就已足够；但我们工作过程中，还会用到浏览器的滚动截取。这就需要用selenium的webdriver来做此事。

图片切割

有时候，整个页面元素太多，为了定位问题/需求，我们还需要具体到浏览器中指定区域，那么我们就需要借助PIL库中的Image类中的corp()方法来对截取的图片进行切割。方法如下：

爬坑之路

初次尝试PIL的使用，遇到了各种各样的问题。在此分享一下，避免大家走到小弯道道上去。

问题1:报错The _imaging C module is not installed

解析：python没有找到_imaging文件。PIL库支持到2.7版本的Python。如果使用更高版本的Python版本，可以下载pillow。pillow可以支持到Python3.x。

解决方法：安装pillow模块代替PIL模块（原PIL模块可以不卸载）命令：pip install pillow

问题2:用带参数的grab截取的图片位置对不上,试过带参数的grab截取图片，但结果并不是自己想要的区域。示例如下：

解决方法:先用webdriver截取全屏，然后用Image模块的crop()方法对图片进行切割。

问题3:问题2的解决方法，在本地保存的图片，是一个全黑图片。

解析:坐标值选择正确。Locations的坐标需要是int类型。利用elem.location获取的结果是float类型的，所以需要进行类型转换。

解决方法:将坐标点转化为int型，如下：

小tip:可以利用show()方法，弹出图片，查看图片操作的结果，如：im.show()

完整样例代码：

是不是看的很手痒，快来试一把。

如有任何问题，请留言~

Qtest是360旗下的专业测试团队！

是WEB平台部测试技术平台化、效率化的先锋力量！