diff --git a/lighthouse-cli/test/fixtures/oopif.html b/lighthouse-cli/test/fixtures/oopif.html new file mode 100644 index 000000000000..b27db2d3c848 --- /dev/null +++ b/lighthouse-cli/test/fixtures/oopif.html @@ -0,0 +1,10 @@ + + + + Where is my iframe? + + +

Hello frames

+ + + diff --git a/lighthouse-cli/test/smokehouse/oopif-config.js b/lighthouse-cli/test/smokehouse/oopif-config.js new file mode 100644 index 000000000000..ebc5fa22bfe6 --- /dev/null +++ b/lighthouse-cli/test/smokehouse/oopif-config.js @@ -0,0 +1,18 @@ +/** + * @license Copyright 2019 Google Inc. All Rights Reserved. + * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0 + * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License. + */ +'use strict'; + +/** + * Config file for running the OOPIF tests + */ +module.exports = { + extends: 'lighthouse:default', + settings: { + onlyAudits: [ + 'network-requests', + ], + }, +}; diff --git a/lighthouse-cli/test/smokehouse/oopif-expectations.js b/lighthouse-cli/test/smokehouse/oopif-expectations.js new file mode 100644 index 000000000000..94eac432dc3c --- /dev/null +++ b/lighthouse-cli/test/smokehouse/oopif-expectations.js @@ -0,0 +1,28 @@ +/** + * @license Copyright 2019 Google Inc. All Rights Reserved. + * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0 + * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License. + */ +'use strict'; + +/** + * Expected Lighthouse audit values for sites with OOPIFS. + */ +module.exports = [ + { + requestedUrl: 'http://localhost:10200/oopif.html', + finalUrl: 'http://localhost:10200/oopif.html', + audits: { + 'network-requests': { + details: { + items: { + // The page itself only makes a few requests. + // We want to make sure we are finding the iframe's requests (airhorner) while being flexible enough + // to allow changes to the live site. + length: '>10', + }, + }, + }, + }, + }, +]; diff --git a/lighthouse-cli/test/smokehouse/run-smoke.js b/lighthouse-cli/test/smokehouse/run-smoke.js index fd891c093679..5399eb77b053 100644 --- a/lighthouse-cli/test/smokehouse/run-smoke.js +++ b/lighthouse-cli/test/smokehouse/run-smoke.js @@ -35,6 +35,11 @@ const SMOKETESTS = [{ expectations: smokehouseDir + 'error-expectations.js', config: smokehouseDir + 'error-config.js', batch: 'errors', +}, { + id: 'oopif', + expectations: smokehouseDir + 'oopif-expectations.js', + config: smokehouseDir + 'oopif-config.js', + batch: 'parallel-first', }, { id: 'pwa', expectations: smokehouseDir + 'pwa-expectations.js', diff --git a/lighthouse-core/gather/driver.js b/lighthouse-core/gather/driver.js index bcb475ced925..b3e593d29c86 100644 --- a/lighthouse-core/gather/driver.js +++ b/lighthouse-core/gather/driver.js @@ -47,8 +47,8 @@ class Driver { */ this._eventEmitter = /** @type {CrdpEventEmitter} */ (new EventEmitter()); this._connection = connection; - // currently only used by WPT where just Page and Network are needed - this._devtoolsLog = new DevtoolsLog(/^(Page|Network)\./); + // Used to save network and lifecycle protocol traffic. Just Page, Network, and Target are needed. + this._devtoolsLog = new DevtoolsLog(/^(Page|Network|Target)\./); this.online = true; /** @type {Map} */ this._domainEnabledCounts = new Map(); @@ -69,6 +69,20 @@ class Driver { */ this._monitoredUrl = null; + let targetProxyMessageId = 0; + this.on('Target.attachedToTarget', event => { + targetProxyMessageId++; + // We're only interested in network requests from iframes for now as those are "part of the page". + if (event.targetInfo.type !== 'iframe') return; + + // We want to receive information about network requests from iframes, so enable the Network domain. + // Network events from subtargets will be stringified and sent back on `Target.receivedMessageFromTarget`. + this.sendCommand('Target.sendMessageToTarget', { + message: JSON.stringify({id: targetProxyMessageId, method: 'Network.enable'}), + sessionId: event.sessionId, + }); + }); + connection.on('protocolevent', event => { this._devtoolsLog.record(event); if (this._networkStatusMonitor) { @@ -1015,6 +1029,12 @@ class Driver { await this._beginNetworkStatusMonitoring(url); await this._clearIsolatedContextId(); + // Enable auto-attaching to subtargets so we receive iframe information + await this.sendCommand('Target.setAutoAttach', { + autoAttach: true, + waitForDebuggerOnStart: false, + }); + await this.sendCommand('Page.enable'); await this.sendCommand('Page.setLifecycleEventsEnabled', {enabled: true}); await this.sendCommand('Emulation.setScriptExecutionDisabled', {value: disableJS}); diff --git a/lighthouse-core/lib/network-recorder.js b/lighthouse-core/lib/network-recorder.js index 4264e34eb219..ed38a3498b27 100644 --- a/lighthouse-core/lib/network-recorder.js +++ b/lighthouse-core/lib/network-recorder.js @@ -303,15 +303,26 @@ class NetworkRecorder extends EventEmitter { request.onResourceChangedPriority(data); } + /** + * Events from targets other than the main frame are proxied through `Target.receivedMessageFromTarget`. + * Their payloads are JSON-stringified into the `.message` property + * @param {LH.Crdp.Target.ReceivedMessageFromTargetEvent} data + */ + onReceivedMessageFromTarget(data) { + /** @type {LH.Protocol.RawMessage} */ + const protocolMessage = JSON.parse(data.message); + + // Message was a response to some command, not an event, so we'll ignore it. + if ('id' in protocolMessage) return; + // Message was an event, replay it through our normal dispatch process. + this.dispatch(protocolMessage); + } + /** * Routes network events to their handlers, so we can construct networkRecords * @param {LH.Protocol.RawEventMessage} event */ dispatch(event) { - if (!event.method.startsWith('Network.')) { - return; - } - switch (event.method) { case 'Network.requestWillBeSent': return this.onRequestWillBeSent(event.params); case 'Network.requestServedFromCache': return this.onRequestServedFromCache(event.params); @@ -320,6 +331,7 @@ class NetworkRecorder extends EventEmitter { case 'Network.loadingFinished': return this.onLoadingFinished(event.params); case 'Network.loadingFailed': return this.onLoadingFailed(event.params); case 'Network.resourceChangedPriority': return this.onResourceChangedPriority(event.params); + case 'Target.receivedMessageFromTarget': return this.onReceivedMessageFromTarget(event.params); // eslint-disable-line max-len default: return; } } diff --git a/lighthouse-core/test/gather/driver-test.js b/lighthouse-core/test/gather/driver-test.js index 5befd18dd8b7..b69ff4ddc3cc 100644 --- a/lighthouse-core/test/gather/driver-test.js +++ b/lighthouse-core/test/gather/driver-test.js @@ -487,6 +487,7 @@ describe('.gotoURL', () => { .mockResponse('Page.setLifecycleEventsEnabled', {}) .mockResponse('Emulation.setScriptExecutionDisabled', {}) .mockResponse('Page.navigate', {}) + .mockResponse('Target.setAutoAttach', {}) .mockResponse('Runtime.evaluate', {}); }); @@ -930,3 +931,36 @@ describe('.goOnline', () => { }); }); }); + +describe('Multi-target management', () => { + it('enables the Network domain for iframes', async () => { + connectionStub.sendCommand = createMockSendCommandFn() + .mockResponse('Target.sendMessageToTarget', {}); + + driver._eventEmitter.emit('Target.attachedToTarget', { + sessionId: 123, + targetInfo: {type: 'iframe'}, + }); + await flushAllTimersAndMicrotasks(); + + const sendMessageArgs = connectionStub.sendCommand + .findInvocation('Target.sendMessageToTarget'); + expect(sendMessageArgs).toEqual({ + message: '{"id":1,"method":"Network.enable"}', + sessionId: 123, + }); + }); + + it('ignores other target types', async () => { + connectionStub.sendCommand = createMockSendCommandFn() + .mockResponse('Target.sendMessageToTarget', {}); + + driver._eventEmitter.emit('Target.attachedToTarget', { + sessionId: 123, + targetInfo: {type: 'service_worker'}, + }); + await flushAllTimersAndMicrotasks(); + + expect(connectionStub.sendCommand).not.toHaveBeenCalled(); + }); +});