CasperJS截图只是页面的一小部分

pil*_*ice 4 javascript casperjs

CasperJS文档captureSelector()没有说明如何设置屏幕截图的大小.默认情况下(至少在我的系统上使用webkit,Windows 8)似乎是截取页面左上角的一个小屏幕截图.

我在找错了地方吗?

我找到了viewportSize.我认为这是我需要的,但有没有人有代码可以将其设置为合理的默认值(如100%)?

仅供参考this.viewport('100%', '100%');,我认为不需要%.

我是否必须注入将窗口宽度和高度返回到页面中的代码并将其传回以提取它或者是否有更简单的方法?

Art*_* B. 7

casper.captureSelector()应该截取您选择的元素的屏幕截图.如果您想截取您需要使用的整个页面的屏幕截图casper.capture().

请注意,PhantomJS的默认viewportSize为400x300.某些页面未正确调整大小,因此页面的一部分不可见.你需要将它设置为类似于桌面的东西:

var casper = require('casper').create({
    viewportSize: {width: 1280, height: 800}
});
Run Code Online (Sandbox Code Playgroud)

没有办法让它100%.您可以做的是读出页面正文的宽度并相应地设置视口casper.viewport().

var width = 1280;
casper.start(url, function(){
    width = this.evaluate(function(){
        return document.body.clientWidth;
    });
}).viewport(width, 800).then(function(){
    this.capture("screenshot.png");
}).run();
Run Code Online (Sandbox Code Playgroud)