Introduce Page.waitForNavigation (#94)

This patch introduces Page.waitForNavigation which allows to wait
for render-initiated navigation.

This patch also does a nice refactoring, replacing Navigator with NavigatorWatcher which
is not a part of a page state.

References #89
This commit is contained in:
Pavel Feldman 2017-07-18 18:54:24 -07:00 committed by Andrey Lushnikov
parent bef9982687
commit 98c3894c84
5 changed files with 74 additions and 35 deletions

View File

@ -42,7 +42,7 @@
* [page.navigate(url, options)](#pagenavigateurl-options)
* [page.pdf(options)](#pagepdfoptions)
* [page.plainText()](#pageplaintext)
* [page.reload()](#pagereload)
* [page.reload(options)](#pagereloadoptions)
* [page.screenshot([options])](#pagescreenshotoptions)
* [page.setContent(html)](#pagesetcontenthtml)
* [page.setHTTPHeaders(headers)](#pagesethttpheadersheaders)
@ -57,6 +57,7 @@
* [page.userAgent()](#pageuseragent)
* [page.viewport()](#pageviewport)
* [page.waitFor(selector)](#pagewaitforselector)
* [page.waitForNavigation(options)](#pagewaitfornavigationoptions)
- [class: Keyboard](#class-keyboard)
* [keyboard.hold(key[, options])](#keyboardholdkey-options)
* [keyboard.modifiers()](#keyboardmodifiers)
@ -422,7 +423,8 @@ The `format` options are:
#### page.plainText()
- returns: <[Promise]<[string]>> Returns page's inner text.
#### page.reload()
#### page.reload(options)
- `options` <[Object]> Navigation parameters, same as in [page.navigate](#pagenavigateurl-options).
- returns: <[Promise]<[Response]>> Promise which resolves to the main resource response. In case of multiple redirects, the navigation will resolve with the response of the last redirect.
#### page.screenshot([options])
@ -535,6 +537,10 @@ This is a shortcut for [page.mainFrame().url()](#frameurl)
- `selector` <[string]> A query selector to wait for on the page.
- returns: <[Promise]> Promise which resolves when the element matching `selector` appears in the page.
#### page.waitForNavigation(options)
- `options` <[Object]> Navigation parameters, same as in [page.navigate](#pagenavigateurl-options).
- returns: <[Promise]<[Response]>> Promise which resolves to the main resource response. In case of multiple redirects, the navigation will resolve with the response of the last redirect.
Shortcut for [page.mainFrame().waitFor(selector)](#framewaitforselector).
### class: Keyboard

View File

@ -14,30 +14,31 @@
* limitations under the License.
*/
class Navigator {
const NetworkManager = require('./NetworkManager');
class NavigatorWatcher {
/**
* @param {!Connection} client
* @param {string} url
* @param {string=} referrer
* @param {!NetworkManager} networkManager
* @param {!Object=} options
*/
constructor(client, url, referrer, options = {}) {
constructor(client, networkManager, options = {}) {
this._client = client;
this._url = url;
this._referrer = referrer;
this._networkManager = networkManager;
this._maxTime = typeof options['maxTime'] === 'number' ? options['maxTime'] : 30000;
this._idleTime = typeof options['networkIdleTimeout'] === 'number' ? options['networkIdleTimeout'] : 1000;
this._idleInflight = typeof options['networkIdleInflight'] === 'number' ? options['networkIdleInflight'] : 2;
this._waitUntil = typeof options['waitUntil'] === 'string' ? options['waitUntil'] : 'load';
console.assert(this._waitUntil === 'load' || this._waitUntil === 'networkidle', 'Unknown value for options.waitUntil: ' + this._waitUntil);
}
/**
* @return {!Promise}
* @return {!Promise<!Map<string, !Response>>}
*/
async navigate() {
async waitForNavigation() {
this._init();
let certificateError = new Promise(fulfill => this._client.once('Security.certificateError', fulfill))
.then(error => new Error('SSL Certiciate error: ' + error.errorType));
let networkIdle = new Promise(fulfill => this._networkIdleCallback = fulfill).then(() => null);
@ -46,15 +47,19 @@ class Navigator {
try {
// Await for the command to throw exception in case of illegal arguments.
await this._client.send('Page.navigate', {url: this._url, referrer: this._referrer});
const error = await Promise.race([certificateError, watchdog, this._waitUntil === 'load' ? loadEventFired : networkIdle]);
if (error)
throw error;
return this._responses;
} finally {
this._cleanup();
}
}
cancel() {
this._cleanup();
}
/**
* @param {!Object} event
*/
@ -83,14 +88,18 @@ class Navigator {
_init() {
this._loadingStartedHandler = this._onLoadingStarted.bind(this);
this._loadingCompletedHandler = this._onLoadingCompleted.bind(this);
this._onResponseHandler = this._onResponse.bind(this);
this._client.on('Network.requestWillBeSent', this._loadingStartedHandler);
this._client.on('Network.loadingFinished', this._loadingCompletedHandler);
this._client.on('Network.loadingFailed', this._loadingCompletedHandler);
this._client.on('Network.webSocketCreated', this._loadingStartedHandler);
this._client.on('Network.webSocketClosed', this._loadingCompletedHandler);
this._networkManager.on(NetworkManager.Events.Response, this._onResponseHandler);
this._inflightRequests = 0;
this._requestIds = new Set();
/** @type {!Map<string, !Response>} */
this._responses = new Map();
}
_cleanup() {
@ -99,10 +108,19 @@ class Navigator {
this._client.removeListener('Network.loadingFailed', this._loadingCompletedHandler);
this._client.removeListener('Network.webSocketCreated', this._loadingStartedHandler);
this._client.removeListener('Network.webSocketClosed', this._loadingCompletedHandler);
this._networkManager.removeListener(NetworkManager.Events.Response, this._onResponseHandler);
clearTimeout(this._idleTimer);
clearTimeout(this._maximumTimer);
this._responses = new Map();
}
/**
* @param {!Response} response
*/
_onResponse(response) {
this._responses.set(response.url, response);
}
}
module.exports = Navigator;
module.exports = NavigatorWatcher;

View File

@ -18,7 +18,7 @@ let fs = require('fs');
let EventEmitter = require('events');
let mime = require('mime');
let NetworkManager = require('./NetworkManager');
let Navigator = require('./Navigator');
let NavigatorWatcher = require('./NavigatorWatcher');
let Dialog = require('./Dialog');
let EmulationManager = require('./EmulationManager');
let FrameManager = require('./FrameManager');
@ -267,32 +267,36 @@ class Page extends EventEmitter {
* @return {!Promise<!Response>}
*/
async navigate(url, options) {
const watcher = new NavigatorWatcher(this._client, this._networkManager, options);
const result = watcher.waitForNavigation();
const referrer = this._networkManager.httpHeaders()['referer'];
this._navigator = new Navigator(this._client, url, referrer, options);
return this.reload();
try {
await this._client.send('Page.navigate', {url, referrer});
} catch (e) {
watcher.cancel();
throw e;
}
const responses = await result;
return responses.get(this.mainFrame().url());
}
/**
* @return {!Promise<!Response>}
* @param {!Object=} options
* @return {!Promise<?Response>}
*/
async reload() {
if (!this._navigator)
return;
/** @type {!Map<string, !Response>} */
const responses = new Map();
const onResponse = response => responses.set(response.url, response);
this._networkManager.on(NetworkManager.Events.Response, onResponse);
try {
await this._navigator.navigate();
} finally {
this._networkManager.removeListener(NetworkManager.Events.Response, onResponse);
}
const response = responses.get(this.mainFrame().url());
console.assert(response);
async reload(options) {
this._client.send('Page.reload');
return this.waitForNavigation(options);
}
// Await for a single raf rountrip to ensure basic rasterization is complete.
await this.evaluate(() => new Promise(fulfill => requestAnimationFrame(fulfill)));
return response;
/**
* @param {!Object=} options
* @return {!Promise<?Response>}
*/
async waitForNavigation(options) {
const watcher = new NavigatorWatcher(this._client, this._networkManager, options);
const responses = await watcher.waitForNavigation();
return responses.get(this.mainFrame().url()) || null;
}
/**

View File

@ -427,6 +427,17 @@ describe('Puppeteer', function() {
}));
});
describe('Page.waitForNavigation', function() {
it('should work', SX(async function() {
await page.navigate(EMPTY_PAGE);
const result = page.waitForNavigation();
page.evaluate(url => window.location.href = url, PREFIX + '/grid.html');
const response = await result;
expect(response.ok).toBe(true);
expect(response.url).toContain('grid.html');
}));
});
describe('Page.setInPageCallback', function() {
it('should work', SX(async function() {
await page.setInPageCallback('callController', function(a, b) {

View File

@ -11,7 +11,7 @@ let EXCLUDE_CLASSES = new Set([
'EmulationManager',
'FrameManager',
'Helper',
'Navigator',
'NavigatorWatcher',
'NetworkManager',
'ProxyStream'
]);