Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs(api.md): add notes on race condition in page.setViewport #4319

Merged
Merged
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
address comments
  • Loading branch information
aslushnikov committed Jun 11, 2019
commit ed3f7db2c1b37786a9401472df62ff613f7d2795
10 changes: 2 additions & 8 deletions docs/api.md
Original file line number Diff line number Diff line change
Expand Up @@ -1237,11 +1237,7 @@ Emulates given device metrics and user agent. This method is a shortcut for call

To aid emulation, puppeteer provides a list of device descriptors which can be obtained via the [`puppeteer.devices`](#puppeteerdevices).

To avoid race condition with page's logic that sniffs for viewport and user
agent properties, it is recommended to call `page.emulate` *before* navigating
page to the target URL.

Example of emulating an iPhone 6 in puppeteer:
`page.emulate` will resize the page. A lot of websites don't expect phones to change size, so you should emulate before navigating to the page.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is even easier. The user agent needs to be sent before the first navigation.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Fair! Keeping it as-is doesn't hurt.


```js
const puppeteer = require('puppeteer');
Expand Down Expand Up @@ -1804,9 +1800,7 @@ puppeteer.launch().then(async browser => {

In the case of multiple pages in a single browser, each page can have its own viewport size.

To avoid race condition with page's logic that sniffs for viewport properties,
it is recommended to call `page.setViewport` *before* navigating page to the target
URL.
`page.setViewport` will resize the page. A lot of websites don't expect phones to change size, so you should set the viewport before navigating to the page.

```js
const page = await browser.newPage();
Expand Down