backstop UI还原

前言:去官网或者npm官网找 backstopjs (https://www.npmjs.com/package/backstopjs).

1.安装:npm install -g backstopjs
2.backstop init 初始化
3.打开backstop.json 文件,将width、height改为ui制作的psd原图的长宽,并在 scenarios下找到url设置要测试页面路径。
4.执行命令:backstop test
5.在backstop_data目录下有个文件夹bitmaps_test,进去后看到测试工具已将页面截图保存下来。然后复制该页面的名称。(也可直接在backstop.json 修改要报存的名称)
6.在baskstop_data 目录下新建名称为 bitmaps_reference的文件夹。放入ui图,并将图名称修改为第5步复制好的名称。
7.执行命令:backstop test 进行测试。

还有另外一种UI还原的工具:phantomCSS

图片.png
图片.png
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,032评论 19 139
  • 音频 AudioBus:下一代 App 到 App 的实时音频路由。官网 AudioKit:一个强大的音频合成,处...
    voQuan阅读 5,163评论 5 63
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,802评论 25 709
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,262评论 4 61
  • 三年的大学生活让我倍感压力的存在,老是感觉有一股力量在压抑着我,无法前行。记得大三那一年,我和宿舍的同学兴冲冲地报...
    青果果说阅读 327评论 12 7