backstop样式回归测试
Posted 139199228-haicao
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了backstop样式回归测试相关的知识,希望对你有一定的参考价值。
使用backstop进行样式回归测试
//全局安装backstop
npm install backstop -g
//安装完成使用
backstop init
生成backstop.json配置如下
{ "id": "baidu",//项目的名字 "viewports": [{ "label": "iphone6",//测试的手机ipone6 "width": 375, "height": 667 }, { "label": "tablet", "width": 1024, "height": 768 } ], "onBeforeScript": "puppet/onBefore.js",//项目前的script在那 "onReadyScript": "puppet/onReady.js",//项目准备的script在哪 "scenarios": [{ "label": "BackstopJS Homepage",//首页的截图 "cookiePath": "backstop_data/engine_scripts/cookies.json",//cookie的json "url": "https://garris.github.io/BackstopJS/",//项目地址 "referenceUrl": "", "readyEvent": "", "readySelector": "", "delay": 0, "hideSelectors": [], "removeSelectors": [], "hoverSelector": "", "clickSelector": "", "postInteractionWait": 0, "selectors": [ ".class", "#id" ], "selectorExpansion": true, "misMatchThreshold": 0.1, "requireSameDimensions": true, }], "paths": { "bitmaps_reference": "backstop_data/bitmaps_reference",//图片的参考 "bitmaps_test": "backstop_data/bitmaps_test",//图片的测试 "engine_scripts": "backstop_data/engine_scripts",//引擎脚本 "html_report": "./docs/backstop_data/html_report",//html报表 "ci_report": "backstop_data/ci_report"//ci的报告 }, "report": ["browser"], "engine": "phantomjs", "engineFlags": [], "asyncCaptureLimit": 5, "asyncCompareLimit": 50, "debug": false, "debugWindow": false }
使用 bakstop reference 会生成要匹配的图片文件夹(bitmaps_reference)、以及图片
命名分别是测试名字_测试用例ID_选择器_屏幕尺寸
//使用进行回归测试
backstop test
以上是关于backstop样式回归测试的主要内容,如果未能解决你的问题,请参考以下文章
回归测试是什么?(基线版本基线测试包代码相依性回归测试包软件操作剖面)