CasperJS截屏仅为页面的一小部分。

Question

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

我找到了viewportSize。 我认为这就是我需要的，但是是否有任何代码可以将其设置为明智的默认值（例如100％）？

请注意：this.viewport('100%', '100%');会停滞不前，因此我认为它不支持%。

我是否必须注入代码以返回窗口的宽度和高度并将其传回以提取它，还是有更简单的方法？

- pilavdzice

Answer 1

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

请注意，PhantomJS具有默认的视口大小为400x300。某些页面无法正确调整大小，因此页面的一部分不可见。您需要将其设置为类似桌面的尺寸：

var casper = require('casper').create({
    viewportSize: {width: 1280, height: 800}
});

没有办法做到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();

- Artjom B.