PhantomCSS 不适用于此网站

Question

我正在努力让这个测试成功，但 PhantomCSS 似乎无法截取这个特定网站的屏幕截图。

/*
Require and initialise PhantomCSS module
Paths are relative to CasperJs directory
*/;
var phantomcss = require('./phantomcss.js');

casper.test.begin('Test', 5, function(test) {

phantomcss.init({
    screenshotRoot: './screenshots',
    failedComparisonsRoot: './screenshots',
    libraryRoot: '.',
});

casper.on("resource.error", function(msg, trace) {
    this.echo("[Resource Error]");
    this.echo("resource Error: " + dump(msg), "ERROR");
    this.echo("[/Resource Error]");
});
casper.on("page.error", function(msg, trace) {
    this.echo("[page.error]");
    this.echo("Page Error: " + msg, "ERROR");
    this.echo("[/page.error]");
});
casper.on("remote.message", function(msg, trace) {
    this.echo("[remote.message]");
    this.echo("Remote Message: " + msg, "ERROR");
    this.echo("[/remote.message]");
});
casper.on("casper.page.onResourceTimeout", function(msg, trace) {
    this.echo("[casper.page.onResourceTimeout]");
    this.echo("casper.page.onResourceTimeout: " + msg, "ERROR");
    this.echo("[/casper.page.onResourceTimeout]");
});

/*
    The test scenario
*/
casper.start();

casper.userAgent('Mozilla/5.0 (Windows NT 6.3; rv:36.0) Gecko/20100101 Firefox/36.0');

casper.open('http://www.publicmobile.ca');

casper.viewport(1024, 768);

casper.then(function(){
    phantomcss.screenshot('body', 'public');
});

casper.then( function now_check_the_screenshots(){
    // compare screenshots
    phantomcss.compareAll();
});

/*
Casper runs tests
*/
casper.run(function(){
    console.log('\nTHE END.');
    // phantomcss.getExitStatus() // pass or fail?
    casper.test.done();
});
});

function dump(obj) {
    var out = '';
    for (var i in obj) {
        out += i + ": " + obj[i] + "\n";
    }

    return out;
}

我收到这些错误消息：

[Resource Error]
resource Error: errorCode: 203
errorString: Error downloading http://www.googletagmanager.com/gtm.js?id=GTM-P4G685 - server replied: Not Found
id: 6
url: http://www.googletagmanager.com/gtm.js?id=GTM-P4G685
[/Resource Error]

[remote.message]
Remote Message: navigating to state: no-region from 
[/remote.message]
[remote.message]
Remote Message: navigating to state: site.home from no-region
[/remote.message]

同样的测试在其他网站上运行良好。

感谢帮助！

Answer 1

问题是第一个根 div 我的情况 <div ui-view="" class="wrapper ng-scope"> 的高度为 0px。所以截图的高度为0px，图片没有存储。

所以我有一点 javascript 来解决这个问题

casper.then(function(){
    casper.page.injectJs("/home/guillaume/Workspace/gozer/vendor/jquery-1.8.3.min.js");
    casper.evaluate(function() {
        return $('.wrapper').css("height", 3000);
    });
});

PhantomCSS 不适用于此网站

PhantomCSS not working with this website

phantomjs

casperjs

phantomcss