测试phantomCSS找不到ResembleJs容器

Question

我试图将可视化比较测试添加到我的布局中，但是我似乎没有正确地配置我的测试环境。

我在用：

• CasperJS
• PhantomJS
• PhantomCSS
• ResembleJS

这是我的测试JS文件：

var url, screenshotRoot, modules, phantomCSS, page;

url             = 'http://website.local';
screenshotRoot  = 'tests/screenshots';
modules         = '../node_modules';
phantomCSS      = require(modules + '/phantomcss/phantomcss.js');
page            = { width: 1024, height: 768 };

phantomCSS.init({
    screenshotRoot: screenshotRoot,
    failedComparisonsRoot: screenshotRoot + '/failures',
    libraryRoot: modules + '/phantomcss',
});

casper
.start(url)
.then(function() {
    phantomCSS.screenshot("body", "elements-cheatsheet");
})
.then(function() {
    phantomCSS.compareAll();
})
.run(function() {
    phantom.exit(phantomCSS.getExitStatus());
});

casper.viewport(page.width, page.height);

当我运行casperjs test tests/layout.js时，测试开始，创建屏幕截图并抛出一个错误：

[PhantomCSS] Can't find Resemble container. Perhaps the library root is mis configured. (../node_modules/phantomcss/ResembleJs/resemblejscontainer.html)

我检查了resemblejscontainer.html文件的位置，它正好在抛出的错误中列出的位置。

我哪里错了？

Answer 1

我想您希望能够在node_modules和lib或bower_components之间进行更改。

下列工作也应有效：

modules = 'node_modules';
phantomCSS = require('./../' + modules + '/phantomcss/phantomcss.js');
…
phantomCSS.init({
    …
    libraryRoot: './' + modules + '/phantomcss'
});

(这是基于PhantomJS食谱的食谱。)

Answer 2

使用绝对路径解决了我的问题：

modules = '/Users/username/path/node_modules';

Answer 3

我在PhantomCSS文件夹中做了“sudo安装类似it”的工作。也许这比更改根文件夹或像我这样的新手用户的任何其他文件更容易。