/
PuppetMaster.js
98 lines (86 loc) · 3.27 KB
/
PuppetMaster.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
const puppeteer = require('puppeteer'); // https://github.com/GoogleChrome/puppeteer
class PuppetMaster {
// Viewport specs taken from Mozilla Firefox. Default viewports are the sizes required by App Store and Google Play for app submissions
viewports = [
{
'name': 'Pixel 2',
'filename': 'AndroidPhone',
'viewport': {width: 411, height: 731, dpr: 1}
},
{
'name': 'iPhone XS Max',
'filename': 'iPhone6_5inch',
'viewport': {width: 414, height: 896, dpr: 3}
},
{
'name': 'iPhone 6/7/8 Plus',
'filename': 'iPhone5_5inch',
'viewport': {width: 414, height: 736, dpr: 3}
},
{
'name': 'iPad 10.5',
'filename': 'AndroidTablet',
'viewport': {width: 834, height: 1112, dpr: 2}
},
{
'name': 'iPad 12.9',
'filename': 'iPadPro',
'viewport': {width: 1024, height: 1366, dpr: 2}
},
];
/*
Required parameters:
- URL of website to take screenshots [string],
- Delay before screenshot is taken to allow for website dependencies to load [int],
- Relative file path of this script for screenshots to be saved [string]
*/
constructor(url, delayMs, relativeFilePath) {
if (url && delay_ms && relativeFilePath) {
this.url = url;
this.delay = delayMs;
this.filePath = relativeFilePath;
this.runPuppeteer()
.then(() => {
this.browser.close();
console.log(this.url + ' screenshots completed');
})
.catch(err => {
console.log("Could not generate screenshots for " + this.url + ". " + err);
});
}
else {
console.log("Unable to generate screenshots for this page. Please verify all required parameters have been provided.");
}
}
sleep(ms) {
return new Promise(resolve => {
setTimeout(resolve, ms);
});
}
async runPuppeteer() {
return await new Promise(async (resolve) => {
this.browser = await puppeteer.launch();
console.log('Generating screenshots for ' + this.url + '...');
for (let i = 0; i < this.viewports.length; i++) {
const page = await this.browser.newPage();
await page.setViewport({
width: this.viewports[i].viewport.width,
height: this.viewports[i].viewport.height,
deviceScaleFactor: this.viewports[i].viewport.dpr,
isMobile: true,
isLandscape: false
});
await page.goto(this.url, {waitUntil: 'networkidle2'});
await this.sleep(this.delay); // Pause before taking screenshot to allow website dependencies to load
await page.screenshot({
path: this.filePath + '/' + this.viewports[i].filename + '.png',
type: "png"
})
.then(() => {
console.log(this.viewports[i].filename + " screenshot generated");
});
}
resolve();
});
}
}