javascript - BackstopJS的高级方案

我正在尝试使用BackstopJS，但在弄清楚如何对悬停元素进行测试时遇到了麻烦。

backstop.json

{
  "id": "backstop_default",
  "viewports": [
    {
      "label": "phone",
      "width": 320,
      "height": 480
    },
    {
      "label": "tablet",
      "width": 1024,
      "height": 768
    }
  ],
  "onBeforeScript": "chromy/onBefore.js",
  "onReadyScript": "chromy/onReady.js",
  "scenarios": [
    {
      "label": "My Local Test",
      "url": "../../index.html",
      "hideSelectors": [],
      "removeSelectors": [
      ],
      "selectors": [
        "nav",
        ".jumbotron",
        "body .col-md-4:nth-of-type(1)",
        "body .col-md-4:nth-of-type(2)",
        "body .col-md-4:nth-of-type(3)",
        "footer",
        ".btn-default"
      ],
      "hoverSelector": [
        ".btn-default"
      ],
      "readyEvent": null,
      "delay": 0,
      "onReadyScript": null,
      "onBeforeScript": null
    }
  ],
  "paths": {
    "bitmaps_reference": "backstop_data/bitmaps_reference",
    "bitmaps_test": "backstop_data/bitmaps_test",
    "engine_scripts": "backstop_data/engine_scripts",
    "html_report": "backstop_data/html_report",
    "ci_report": "backstop_data/ci_report"
  },
  "report": ["browser"],
  "engine": "chrome",
  "engineFlags": [],
  "asyncCaptureLimit": 5,
  "asyncCompareLimit": 50,
  "debug": false,
  "debugWindow": false
}

btn-default是上面具有悬停的按钮元素。目前，我只能通过普通的btn-default按钮获得参考。 hoverSelector没有执行任何操作。

文档说：


  hoverSelector // //在截屏之前将指针移到指定的DOM元素上（默认onReadyScript提供）


我是否误解了hoverSelector的使用？

最佳答案

在我的backstop.json中hoverSelector不是数组
尝试改变

    "hoverSelector": [
    ".btn-default"
  ],

至

    "hoverSelector": ".btn-default",

如果您参考backstop.json文件的最新backstopjs文档，则hoverSelector不是数组。

https://github.com/garris/BackstopJS