自动化测试用例失败自动截屏方案

不管是基于Web端还是移动端的UI自动化测试，当用例执行失败时，我们总希望人工回溯失败用例的时候有依有据，这时候除了测试执行的log，还需要有一个更直观的屏幕截图。那么对于UI自动化测试该如何去实现用例失败自动截图呢？

一、方案思路

1、截屏API：

对于这样的需求，一般我们选择的测试框架中都会有现成的截屏API，比如WebDriver有提供用于截图的TakesScreenshot类，Android自动化测试的UiAutomator框架也提供了UiDevice.takeScreenshot()截屏方法……所以利用这些已有的API来实现失败截屏并不难。但是有些时候利用框架的截屏API并不能很好的达到目的，那么我们还可以借助Java的Robot类来实现截屏。

2、图片管理：

截屏已经实现了，那么问题又来了，图片该怎么命名？新增的图片该放到哪里呢？怎么跟用例关联起来呢？一个个解答：
1>第一个问题：你可以按时间戳命名，也可以按用例名称命名；
2>第二个问题：有条件的可以搞一台服务器作为图片服务器，将图片放到图片服务器上，当然一般都没这么豪，找台主机搞个共享目录存放图片即可，对于移动端测试还可以将图片存放到测试机的SD卡中；
2>第三个问题，怎么和用例管理，如果你使用了某些有web界面的日志报告框架（比如extentReports、reportNG、以及我之前封装的Log4Reports等），可以直接将图片链接插入到log信息中，那么展示到界面的就是一条图片链接，点击就可以看到截屏的详情。如果是使用的类似于log4j这种纯文本的日志框架，那么只能将图片按用例名称和操作去分类和命名了。

二、关键代码

1、WebDriver截屏代码，返回一行html代码，插入到log信息中

public String snapshot(){   
    File scrFile = ((TakesScreenshot) driver).getScreenshotAs(OutputType.FILE);
    String file = snapshotFolder + getPngName();
        try {
            FileUtils.copyFile(scrFile, new File(file));         
            return "<br><a href=\"" + file + "\">截屏</a>";
        } catch (IOException e) {
            e.printStackTrace();
            return "";
        }         
}

2、UiAutomator截屏代码

public String takeScreenshot(UiDevice mDevice, String path) {
        try {
            File file = new File(path);
            mDevice.takeScreenshot(file);
            return "<br><a href=\"" + file + "\">截屏</a>";
        } catch (Exception e) {
            Log.w(testTag,"截屏失败：" + path);
            e.printStackTrace();
            return "";
        }
    }

3、Java的Robot类截屏代码

public String snapshotDesk(String file){
    try {
        Robot robot = new Robot();  
        Dimension d = new Dimension(Toolkit.getDefaultToolkit().getScreenSize());  
        int width = (int) d.getWidth();  
        int height = (int) d.getHeight();
        Image image = robot.createScreenCapture(new Rectangle(0, 0, width,  height));  
        BufferedImage bi = new BufferedImage(width, height,  BufferedImage.TYPE_INT_RGB);  
        Graphics g = bi.createGraphics();  
        g.drawImage(image, 0, 0, width, height, null);  
        //保存图片  
        try {
            ImageIO.write(bi, "jpg", new File(file));
                        return "<br><a href=\"" + file + "\">截屏</a>";
        } catch (IOException e) {
            e.printStackTrace();
        }
    } catch (Exception e) {
        e.printStackTrace();
    }
       return "";
}

三、实现效果

Paste_Image.png

Log4Reports框架地址：http://www.jianshu.com/p/2c3fd46e2357

PS: 更多原创技术好文和资料，请关注下方公众号：
“测试开发栈”公众号是由具有多年测试、开发经验的老兵们共同管理和运营，旨在分享原创测试、开发相关技术，包括但不限于：测试方向：Web自动化测试、移动端自动化测试、Web服务端测试、接口测试等；开发方向：Java开发、Android开发、前端开发等；期望我们的经验和技术分享能让你每天都成长和进步，早日成为技术大牛~
欢迎大家分享和转发我们的文章（分享转发请保留文章出处），以便让更多的朋友关注我们，同时也欢迎加入我们的QQ群交流和提问：427020613