运行木偶剧脚本时的屏幕截图位置

Question

我创建了一个在offline中运行的木偶脚本，我得到了下面的代码来截取屏幕截图。从命令提示符运行offline-login-check.js脚本时，有人可以建议屏幕截图的添加位置吗？

const puppeteer = require("puppeteer");
(async() => {
const browser = await puppeteer.launch({
headless: true,
chromeWebSecurity: false, 
args: ['--no-sandbox']
});
try {
// Create a new page
const page = await browser.newPage()
// Connect to Chrome DevTools
const client = await page.target().createCDPSession()
// Navigate and take a screenshot
await page.waitFor(3000);
await page.goto('https://sometestsite.net/home',{waitUntil: 'networkidle0'})
//await page.goto(url, {waitUntil: 'networkidle0'});
await page.evaluate('navigator.serviceWorker.ready');
console.log('Going offline');
await page.setOfflineMode(true);
// Does === true for the main page but the fallback content isn't being served.
page.on('response', r => console.log(r.fromServiceWorker()));
await page.reload({waitUntil: 'networkidle0'});
await page.waitFor(5000);
await page.screenshot({path: 'screenshot.png',fullPage: true})
await page.waitForSelector('mat-card[id="route-tile-card]');
await page.click('mat-card[id="route-tile-card]');
await page.waitFor(3000);
} catch(e) {
// handle initialization error
console.log ("Timeout or other error: ", e)
}
await browser.close();
})();

Answer 1

const puppeteer = require('puppeteer');
(async() => {
const browser = await puppeteer.launch({
headless: false,
chromeWebSecurity: false,
args: ['--no-sandbox']
});
try {
// Create a new page
const page = await browser.newPage();
// Connect to Chrome DevTools
const client = await page.target().createCDPSession();
// Navigate and take a screenshot
await page.goto('https://example.com', {waitUntil: 'networkidle0'});
// await page.evaluate('navigator.serviceWorker.ready');
console.log('Going offline');
await page.setOfflineMode(true);
// Does === true for the main page but the fallback content isn't being served.
page.on('response', r => console.log(r.fromServiceWorker()));
await page.reload({waitUntil: 'networkidle0'});
await page.screenshot({path: 'screenshot2.png',fullPage: true})
// await page.waitForSelector('mat-card[id="route-tile-card]');
// await page.click('mat-card[id="route-tile-card]');
} catch(e) {
// handle initialization error
console.log ("Timeout or other error: ", e)
}
await browser.close();
})();

然后在命令行中运行ls | GREP .png，您应该在那里看到屏幕截图。请注意，我删除了可能指定到您的网站await page.evaluate('navigator.serviceWorker.ready');

Answer 2

你的脚本是完美的。没有问题！

屏幕截图.png应位于运行node offline-login-check.js命令的目录中。

如果它不存在，也许您在page.screenshot命令运行之前遇到一些错误/超时。由于脚本正常，这可能是由网络问题或页面问题引起的。例如，如果您的页面具有永无止境的连接(如 WebSocket(，请将"networkidle0"更改为"networkidle2"或"load"，否则第一个page.goto将被卡住。

同样，您的脚本是完美的。您不必更改它。