nightmare
nightmare copied to clipboard
Full page screenshot
Hi. I've been trying to reproduce full-page screenshots as in 328, but without success.
var Nightmare = require('nightmare'),
vo = require('vo');
function * run() {
var nightmare = new Nightmare({
show: false,
width: 515,
height: 768 });
var dimensions = yield nightmare.goto('http://localhost:3000/blocks/block-01.html')
.wait('body')
.evaluate(function() {
var body = document.querySelector('body');
return {
height: document.body.clientHeight,
width: document.body.clientWidth
}
});
console.dir(dimensions);
yield nightmare.viewport(dimensions.width, dimensions.height)
.wait(1000)
.screenshot('./screenshots/blocks/block-01.png');
console.dir(nightmare);
yield nightmare.end();
}
vo(run)(function() {
console.log('done');
});
If there any new solution of that issue? Thank you very much. Running Nightmare v. 3.0.1
Faced same issue, looks like the dimension of the screenshot is limited by the dimension of monitor, even set show = false.
After some digging, it's should be actually an issue from electron or chromium, and I found passing maxWidth & maxHeight can solve my case. Below is the sample code I've tested and it can generate a full page screenshot:
var Nightmare = require('nightmare'),
vo = require('vo');
function * run() {
var nightmare = new Nightmare({
show: false,
frame: false,
maxHeight:16384,
maxWidth:16384,
width: 1200,
height: 1024,
});
var dimensions = yield nightmare.goto('https://github.com/')
.wait('body')
.evaluate(function() {
var body = document.querySelector('body');
return {
width: body.scrollWidth,
height: body.scrollHeight
}
});
console.log(dimensions);
yield nightmare.viewport(dimensions.width, dimensions.height)
.wait(1000)
.screenshot('sample.png');
yield nightmare.end();
}
vo(run)(function() {
console.log('done');
});
The size of maxHeight & maxWidth are refer to #906
Thank you for the reply. I tried maxHeight and maxWidth, but in that case I obtained not only full page screenshot but lots of white space below.
In that case, you may try to use clientWidth & clientHeight, instead of scrollWidth & scrollHeight.
The steps outlined here and in #695 solved my screenshot height issues for all but one page that I'm testing.
We have one page with a ridiculous height of 16375px. My understanding from reading through #695 and #906 is that my issue is likely related to chromium's texture tile size limit.
I just wanted to ask (since the last activity on both of those issues is over a year old) if anyone has found a solution or workaround in the time since?
I use fullpage.js library but the screenshot has a problem in full screen