美文网首页
backstop UI还原

backstop UI还原

作者: 云清淡雅 | 来源:发表于2017-11-01 22:02 被阅读27次

    前言:去官网或者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

    相关文章

      网友评论

          本文标题:backstop UI还原

          本文链接:https://www.haomeiwen.com/subject/dwdvpxtx.html