puppeteer調試

調試

• puppeteer並非只有headless模式，打開puppeteer的ui界面：puppeteer.launch({headless: false),再放慢puppeteer執行的動做puppeteer.launch({headless: false, slowMo: 250})，就能夠輕鬆調試。
• ‘打call？’ page.on('console', msg => console.log('PAGE LOG:', msg.text())); 事件監聽輕鬆打出頁面的log。

await page.waitFor(2000);

請求攔截/模擬請求

puppeteer比testcafe好的一點就是支持請求攔截，記得當初用testcafe測試請求是否被髮出用了不少黑科技，提過issue。。

const puppeteer = require('puppeteer');
 
puppeteer.launch({headless: false, slowMo: 250}).then(async browser => {
const page = await browser.newPage();
await page.setRequestInterception(true);
page.on('console', msg => console.log('PAGE LOG:', msg.text()));
page.on('request', interceptedRequest => {
if (interceptedRequest.url().endsWith('.png') || interceptedRequest.url().endsWith('.jpg'))
interceptedRequest.abort();
else
interceptedRequest.continue();
});
await page.goto('https://open.toutiao.com');// await browser.close();});

提供了request，response事件，能夠攔截請求，首先須要打開這個開關await page.setRequestInterception(true);。

這裏的例子就是停掉全部的png和jpg請求。

攔截能作的東西有不少，好比一些爬蟲能夠經過攔截請求捕獲一些數據，來處理一些東西。

 

修改環境

puppeteer能夠經過page.setViewport,page.setUserAgent來修改訪問的環境。

await page.setViewport({
width: 1920,
height: 1080});

 

await page.setUserAgent('Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/61.0.3163.100 Safari/537.36');

 

puppeteer/DeviceDescriptors還給咱們封裝好了一些環境，好比：

const puppeteer = require('puppeteer');const devices = require('puppeteer/DeviceDescriptors');const iPhone = devices['iPhone 6'];

 

puppeteer.launch().then(async browser => {
const page = await browser.newPage();
await page.emulate(iPhone); // emulate的配置有Viewport，UserAgent等等。以前的setUserAgent等方法是它的語法糖。
await page.goto('https://www.google.com');
// other actions...
await browser.close();});

 

性能測試

能夠生成一個trace.json的文件，供chrome控制檯解析，await page.metrics()還能夠給出一些性能測試的數據。

const puppeteer = require('puppeteer');
(async () => {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.tracing.start({path: 'trace.json'})
await page.goto('https://open.toutiao.com')
await page.tracing.stop()
const metrics = await page.metrics()
console.log(metrics)
await browser.close();})();// output{ Timestamp: 27888.820538,
Documents: 2,
Frames: 1,
JSEventListeners: 58,
Nodes: 171,
LayoutCount: 20,
RecalcStyleCount: 26,
LayoutDuration: 0.042335,
RecalcStyleDuration: 0.010091,
ScriptDuration: 0.124838,
TaskDuration: 0.000039,
JSHeapUsedSize: 6388448,
JSHeapTotalSize: 10334208 }