doc: fix some nits in code examples from api.md (#407)

* Replace let with const in examples when appropriate.
* Unify spacing.
* Fix possible copy-paste artifacts.
* Eliminate one unhandled promise rejection ('Target closed').
This commit is contained in:
Vse Mozhet Byt 2017-08-21 00:50:24 +03:00 committed by Andrey Lushnikov
parent 3b03fdd2d0
commit 6581416897

View File

@ -133,8 +133,9 @@ Puppeteer module provides a method to launch a Chromium instance.
The following is a typical example of using a Puppeteer to drive automation: The following is a typical example of using a Puppeteer to drive automation:
```js ```js
const puppeteer = require('puppeteer'); const puppeteer = require('puppeteer');
puppeteer.launch().then(async browser => { puppeteer.launch().then(async browser => {
let page = await browser.newPage(); const page = await browser.newPage();
await page.goto('https://www.google.com'); await page.goto('https://www.google.com');
// other actions... // other actions...
browser.close(); browser.close();
@ -172,7 +173,7 @@ An example of using a [Browser] to create a [Page]:
const puppeteer = require('puppeteer'); const puppeteer = require('puppeteer');
puppeteer.launch().then(async browser => { puppeteer.launch().then(async browser => {
let page = await browser.newPage(); const page = await browser.newPage();
await page.goto('https://example.com'); await page.goto('https://example.com');
browser.close(); browser.close();
}); });
@ -205,7 +206,7 @@ This example creates a page, navigates it to a URL, and then saves a screenshot:
const puppeteer = require('puppeteer'); const puppeteer = require('puppeteer');
puppeteer.launch().then(async browser => { puppeteer.launch().then(async browser => {
let page = await browser.newPage(); const page = await browser.newPage();
await page.goto('https://example.com'); await page.goto('https://example.com');
await page.screenshot({path: 'screenshot.png'}); await page.screenshot({path: 'screenshot.png'});
browser.close(); browser.close();
@ -339,7 +340,7 @@ const devices = require('puppeteer/DeviceDescriptors');
const iPhone = devices['iPhone 6']; const iPhone = devices['iPhone 6'];
puppeteer.launch().then(async browser => { puppeteer.launch().then(async browser => {
let page = await browser.newPage(); const page = await browser.newPage();
await page.emulate(iPhone); await page.emulate(iPhone);
await page.goto('https://www.google.com'); await page.goto('https://www.google.com');
// other actions... // other actions...
@ -362,8 +363,9 @@ If the function, passed to the `page.evaluate`, returns a [Promise], then `page.
```js ```js
const puppeteer = require('puppeteer'); const puppeteer = require('puppeteer');
puppeteer.launch().then(async browser => { puppeteer.launch().then(async browser => {
let page = await browser.newPage(); const page = await browser.newPage();
const result = await page.evaluate(() => { const result = await page.evaluate(() => {
return Promise.resolve(8 * 7); return Promise.resolve(8 * 7);
}); });
@ -409,15 +411,15 @@ const puppeteer = require('puppeteer');
const crypto = require('crypto'); const crypto = require('crypto');
puppeteer.launch().then(async browser => { puppeteer.launch().then(async browser => {
let page = await browser.newPage(); const page = await browser.newPage();
page.on('console', console.log); page.on('console', console.log);
await page.exposeFunction('md5', text => await page.exposeFunction('md5', text =>
crypto.createHash('md5').update(text).digest('hex') crypto.createHash('md5').update(text).digest('hex')
); );
await page.evaluate(async () => { await page.evaluate(async () => {
// use window.md5 to compute hashes // use window.md5 to compute hashes
let myString = 'PUPPETEER'; const myString = 'PUPPETEER';
let myHash = await window.md5(myString); const myHash = await window.md5(myString);
console.log(`md5 of ${myString} is ${myHash}`); console.log(`md5 of ${myString} is ${myHash}`);
}); });
browser.close(); browser.close();
@ -431,7 +433,7 @@ const puppeteer = require('puppeteer');
const fs = require('fs'); const fs = require('fs');
puppeteer.launch().then(async browser => { puppeteer.launch().then(async browser => {
let page = await browser.newPage(); const page = await browser.newPage();
page.on('console', console.log); page.on('console', console.log);
await page.exposeFunction('readfile', async filePath => { await page.exposeFunction('readfile', async filePath => {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
@ -445,7 +447,7 @@ puppeteer.launch().then(async browser => {
}); });
await page.evaluate(async () => { await page.evaluate(async () => {
// use window.readfile to read contents of a file // use window.readfile to read contents of a file
let content = await window.readfile('/etc/hosts'); const content = await window.readfile('/etc/hosts');
console.log(content); console.log(content);
}); });
browser.close(); browser.close();
@ -644,8 +646,9 @@ Activating request interception enables `request.abort` and `request.continue`.
An example of a naïve request interceptor which aborts all image requests: An example of a naïve request interceptor which aborts all image requests:
```js ```js
const puppeteer = require('puppeteer'); const puppeteer = require('puppeteer');
puppeteer.launch().then(async browser => { puppeteer.launch().then(async browser => {
let page = await browser.newPage(); const page = await browser.newPage();
await page.setRequestInterceptionEnabled(true); await page.setRequestInterceptionEnabled(true);
page.on('request', interceptedRequest => { page.on('request', interceptedRequest => {
if (interceptedRequest.url.endsWith('.png') || interceptedRequest.url.endsWith('.jpg')) if (interceptedRequest.url.endsWith('.png') || interceptedRequest.url.endsWith('.jpg'))
@ -739,8 +742,9 @@ Shortcut for [page.mainFrame().waitFor(selectorOrFunctionOrTimeout[, options])](
The `waitForFunction` could be used to observe viewport size change: The `waitForFunction` could be used to observe viewport size change:
```js ```js
const puppeteer = require('puppeteer'); const puppeteer = require('puppeteer');
puppeteer.launch().then(async browser => { puppeteer.launch().then(async browser => {
let page = await browser.newPage(); const page = await browser.newPage();
const watchDog = page.waitForFunction('window.innerWidth < 100'); const watchDog = page.waitForFunction('window.innerWidth < 100');
page.setViewport({width: 50, height: 50}); page.setViewport({width: 50, height: 50});
await watchDog; await watchDog;
@ -773,8 +777,9 @@ immediately. If the selector doesn't appear after the `timeout` milliseconds of
This method works across navigations: This method works across navigations:
```js ```js
const puppeteer = require('puppeteer'); const puppeteer = require('puppeteer');
puppeteer.launch().then(async browser => { puppeteer.launch().then(async browser => {
let page = await browser.newPage(); const page = await browser.newPage();
let currentURL; let currentURL;
page page
.waitForSelector('img') .waitForSelector('img')
@ -902,10 +907,10 @@ An example of using `Dialog` class:
const puppeteer = require('puppeteer'); const puppeteer = require('puppeteer');
puppeteer.launch().then(async browser => { puppeteer.launch().then(async browser => {
let page = await browser.newPage(); const page = await browser.newPage();
page.on('dialog', dialog => { page.on('dialog', async dialog => {
console.log(dialog.message()); console.log(dialog.message());
dialog.dismiss(); await dialog.dismiss();
browser.close(); browser.close();
}); });
page.evaluate(() => alert('1')); page.evaluate(() => alert('1'));
@ -945,7 +950,7 @@ An example of dumping frame tree:
const puppeteer = require('puppeteer'); const puppeteer = require('puppeteer');
puppeteer.launch().then(async browser => { puppeteer.launch().then(async browser => {
let page = await browser.newPage(); const page = await browser.newPage();
await page.goto('https://www.google.com/chrome/browser/canary.html'); await page.goto('https://www.google.com/chrome/browser/canary.html');
dumpFrameTree(page.mainFrame(), ''); dumpFrameTree(page.mainFrame(), '');
browser.close(); browser.close();
@ -985,8 +990,8 @@ If the function, passed to the `page.evaluate`, returns a [Promise], then `page.
const puppeteer = require('puppeteer'); const puppeteer = require('puppeteer');
puppeteer.launch().then(async browser => { puppeteer.launch().then(async browser => {
let page = await browser.newPage(); const page = await browser.newPage();
const result = await page.evaluate(() => { const result = await page.mainFrame().evaluate(() => {
return Promise.resolve(8 * 7); return Promise.resolve(8 * 7);
}); });
console.log(result); // prints "56" console.log(result); // prints "56"
@ -997,7 +1002,7 @@ puppeteer.launch().then(async browser => {
A string can also be passed in instead of a function. A string can also be passed in instead of a function.
```js ```js
console.log(await page.evaluate('1 + 2')); // prints "3" console.log(await page.mainFrame().evaluate('1 + 2')); // prints "3"
``` ```
#### frame.injectFile(filePath) #### frame.injectFile(filePath)
@ -1056,8 +1061,8 @@ The `waitForFunction` could be used to observe viewport size change:
const puppeteer = require('puppeteer'); const puppeteer = require('puppeteer');
puppeteer.launch().then(async browser => { puppeteer.launch().then(async browser => {
let page = await browser.newPage(); const page = await browser.newPage();
const watchDog = page.waitForFunction('window.innerWidth < 100'); const watchDog = page.mainFrame().waitForFunction('window.innerWidth < 100');
page.setViewport({width: 50, height: 50}); page.setViewport({width: 50, height: 50});
await watchDog; await watchDog;
browser.close(); browser.close();
@ -1080,9 +1085,9 @@ This method works across navigations:
const puppeteer = require('puppeteer'); const puppeteer = require('puppeteer');
puppeteer.launch().then(async browser => { puppeteer.launch().then(async browser => {
let page = await browser.newPage(); const page = await browser.newPage();
let currentURL; let currentURL;
page page.mainFrame()
.waitForSelector('img') .waitForSelector('img')
.then(() => console.log('First URL with image: ' + currentURL)); .then(() => console.log('First URL with image: ' + currentURL));
for (currentURL of ['https://example.com', 'https://google.com', 'https://bbc.com']) for (currentURL of ['https://example.com', 'https://google.com', 'https://bbc.com'])
@ -1097,10 +1102,11 @@ ElementHandle represents an in-page DOM element. ElementHandles could be created
```js ```js
const puppeteer = require('puppeteer'); const puppeteer = require('puppeteer');
puppeteer.launch().then(async browser => { puppeteer.launch().then(async browser => {
let page = await browser.newPage(); const page = await browser.newPage();
await page.goto('https://google.com'); await page.goto('https://google.com');
let inputElement = await page.$('input[type=submit]'); const inputElement = await page.$('input[type=submit]');
await inputElement.click(); await inputElement.click();
// ... // ...
}); });