test.success中的PhantomCSS未定义对象

Question

我正在用PhantomCSS编写一个测试脚本，但是我遇到了一个错误。我已经运行了我的脚本一次，并且我创建了基线截图。现在，当我再次尝试运行它时，它创建了.diff.png映像，但随后抛出了错误：

TypeError: 'undefined' is not an object (evaluating 'test.success')
/path/to/phantomcss.js:426
FAIL TypeError: 'undefined' is not an object (evaluating 'test.success')
#    type: error
#    file: visual.js
#    subject: false
#    error: "TypeError: 'undefined' is not an object (evaluating 'test.success')"
#    stack: in anonymous() in /path/to/phantomcss.js:426
FAIL 1 test executed in 4.035s, 0 passed, 1 failed, 0 dubious, 0 skipped.

我注释掉了大部分phantomcss.init()代码，但剩下的代码如下：

var phantomcss = require('/path/to/phantomcss.js');

phantomcss.init({
    failedComparisonRoot: './diffs'
});

casper.start(url);

casper.viewport(1024, 768);

casper.then(function() {
    casper.wait(2500, function() {
        phantomcss.screenshot('#app-bar', 'App_bar_initial');
        phantomcss.screenshot('.selected', 'Selected_Menu_Initial');

    });
});

casper.then(function() {
    phantomcss.compareAll();
})

casper.then(function() {
    casper.test.done();
})

casper.run(function() {
    phantom.exit(phantomcss.getExitStatus());
});

编辑:来自phantomcss.js的第426行是：

function waitForTests(tests){
casper.then(function(){
    casper.waitFor(function(){
        return tests.length === tests.reduce(function(count, test){
            if (test.success || test.fail || test.error) {
                return count + 1;
            } else {
                return count;
            }
        }, 0);
.....

Answer 1

找到了问题所在。如果您使用NPM安装了它，则必须指定libraryRoot

var phantomcss = require('../node_modules/phantomcss/phantomcss.js');

phantomcss.init({
  libraryRoot: 'node_modules/phantomcss',
});

Answer 2

实际上，我发现如果您的screenshots目录丢失，phantomCss会引发此异常。

这可以按如下方式指定：

phantomcss.init({
    screenshotRoot: './spec/phantomcss/screenshots',
    failedComparisonsRoot: './spec/phantomcss/failures',
    comparisonResultRoot: './spec/phantomcss/results'
});

Answer 3

此错误是由于phantomcss.turnOffAnimations()而生成的。我把它拿掉了。