feat(inspector): pause on page/context close (#5319)

Author: pavelfeldman

src/browserServerImpl.ts

@@ -171,7 +171,7 @@ class ConnectedBrowser extends BrowserDispatcher {
 
   async close(): Promise<void> {
     // Only close our own contexts.
-    await Promise.all(this._contexts.map(context => context.close()));
+    await Promise.all(this._contexts.map(context => context.close({}, internalCallMetadata())));
     this._didClose();
   }
 

src/dispatchers/browserContextDispatcher.ts

@@ -65,8 +65,8 @@ export class BrowserContextDispatcher extends Dispatcher<BrowserContext, channel
     });
   }
 
-  async newPage(): Promise<channels.BrowserContextNewPageResult> {
-    return { page: lookupDispatcher<PageDispatcher>(await this._context.newPage()) };
+  async newPage(params: channels.BrowserContextNewPageParams, metadata: CallMetadata): Promise<channels.BrowserContextNewPageResult> {
+    return { page: lookupDispatcher<PageDispatcher>(await this._context.newPage(metadata)) };
   }
 
   async cookies(params: channels.BrowserContextCookiesParams): Promise<channels.BrowserContextCookiesResult> {
@@ -123,8 +123,8 @@ export class BrowserContextDispatcher extends Dispatcher<BrowserContext, channel
     return await this._context.storageState(metadata);
   }
 
-  async close(): Promise<void> {
-    await this._context.close();
+  async close(params: channels.BrowserContextCloseParams, metadata: CallMetadata): Promise<void> {
+    await this._context.close(metadata);
   }
 
   async recorderSupplementEnable(params: channels.BrowserContextRecorderSupplementEnableParams): Promise<void> {

src/dispatchers/pageDispatcher.ts

@@ -146,7 +146,7 @@ export class PageDispatcher extends Dispatcher<Page, channels.PageInitializer> i
   }
 
   async close(params: channels.PageCloseParams, metadata: CallMetadata): Promise<void> {
-    await this._page.close(params);
+    await this._page.close(metadata, params);
   }
 
   async setFileChooserInterceptedNoReply(params: channels.PageSetFileChooserInterceptedNoReplyParams, metadata: CallMetadata): Promise<void> {

src/protocol/channels.ts

@@ -738,6 +738,7 @@ export type BrowserContextPauseResult = void;
 export type BrowserContextRecorderSupplementEnableParams = {
   language?: string,
   startRecording?: boolean,
+  pauseOnNextStatement?: boolean,
   launchOptions?: any,
   contextOptions?: any,
   device?: string,
@@ -747,6 +748,7 @@ export type BrowserContextRecorderSupplementEnableParams = {
 export type BrowserContextRecorderSupplementEnableOptions = {
   language?: string,
   startRecording?: boolean,
+  pauseOnNextStatement?: boolean,
   launchOptions?: any,
   contextOptions?: any,
   device?: string,

src/protocol/protocol.yml

@@ -648,6 +648,7 @@ BrowserContext:
       parameters:
         language: string?
         startRecording: boolean?
+        pauseOnNextStatement: boolean?
         launchOptions: json?
         contextOptions: json?
         device: string?

src/protocol/validator.ts

@@ -363,6 +363,7 @@ export function createScheme(tChannel: (name: string) => Validator): Scheme {
   scheme.BrowserContextRecorderSupplementEnableParams = tObject({
     language: tOptional(tString),
     startRecording: tOptional(tBoolean),
+    pauseOnNextStatement: tOptional(tBoolean),
     launchOptions: tOptional(tAny),
     contextOptions: tOptional(tAny),
     device: tOptional(tString),

src/server/browser.ts

@@ -72,13 +72,6 @@ export abstract class Browser extends SdkObject {
   abstract isConnected(): boolean;
   abstract version(): string;
 
-  async newPage(options: types.BrowserContextOptions): Promise<Page> {
-    const context = await this.newContext(options);
-    const page = await context.newPage();
-    page._ownedContext = context;
-    return page;
-  }
-
   _downloadCreated(page: Page, uuid: string, url: string, suggestedFilename?: string) {
     const download = new Download(page, this.options.downloadsPath || '', uuid, url, suggestedFilename);
     this._downloads.set(uuid, download);

src/server/browserContext.ts

@@ -27,7 +27,7 @@ import { Progress } from './progress';
 import { Selectors, serverSelectors } from './selectors';
 import * as types from './types';
 import path from 'path';
-import { CallMetadata, SdkObject } from './instrumentation';
+import { CallMetadata, internalCallMetadata, SdkObject } from './instrumentation';
 
 export class Video {
   readonly _videoId: string;
@@ -209,8 +209,8 @@ export abstract class BrowserContext extends SdkObject {
       // - chromium fails to change isMobile for existing page;
       // - webkit fails to change locale for existing page.
       const oldPage = pages[0];
-      await this.newPage();
-      await oldPage.close();
+      await this.newPage(progress.metadata);
+      await oldPage.close(progress.metadata);
     }
   }
 
@@ -245,7 +245,7 @@ export abstract class BrowserContext extends SdkObject {
     return this._closedStatus !== 'open';
   }
 
-  async close() {
+  async close(metadata: CallMetadata) {
     if (this._closedStatus === 'open') {
       this.emit(BrowserContext.Events.BeforeClose);
       this._closedStatus = 'closing';
@@ -255,7 +255,7 @@ export abstract class BrowserContext extends SdkObject {
       if (this._isPersistentContext) {
         // Close all the pages instead of the context,
         // because we cannot close the default context.
-        await Promise.all(this.pages().map(page => page.close()));
+        await Promise.all(this.pages().map(page => page.close(metadata)));
       } else {
         // Close the context.
         await this._doClose();
@@ -286,7 +286,7 @@ export abstract class BrowserContext extends SdkObject {
     await this._closePromise;
   }
 
-  async newPage(): Promise<Page> {
+  async newPage(metadata: CallMetadata): Promise<Page> {
     const pageDelegate = await this.newPageDelegate();
     const pageOrError = await pageDelegate.pageOrError();
     if (pageOrError instanceof Page) {
@@ -307,21 +307,22 @@ export abstract class BrowserContext extends SdkObject {
       origins: []
     };
     if (this._origins.size)  {
-      const page = await this.newPage();
+      const internalMetadata = internalCallMetadata();
+      const page = await this.newPage(internalMetadata);
       await page._setServerRequestInterceptor(handler => {
         handler.fulfill({ body: '<html></html>' }).catch(() => {});
       });
       for (const origin of this._origins) {
         const originStorage: types.OriginStorage = { origin, localStorage: [] };
         result.origins.push(originStorage);
         const frame = page.mainFrame();
-        await frame.goto(metadata, origin);
+        await frame.goto(internalMetadata, origin);
         const storage = await frame._evaluateExpression(`({
           localStorage: Object.keys(localStorage).map(name => ({ name, value: localStorage.getItem(name) })),
         })`, false, undefined, 'utility');
         originStorage.localStorage = storage.localStorage;
       }
-      await page.close();
+      await page.close(internalMetadata);
     }
     return result;
   }
@@ -330,7 +331,8 @@ export abstract class BrowserContext extends SdkObject {
     if (state.cookies)
       await this.addCookies(state.cookies);
     if (state.origins && state.origins.length)  {
-      const page = await this.newPage();
+      const internalMetadata = internalCallMetadata();
+      const page = await this.newPage(internalMetadata);
       await page._setServerRequestInterceptor(handler => {
         handler.fulfill({ body: '<html></html>' }).catch(() => {});
       });
@@ -343,7 +345,7 @@ export abstract class BrowserContext extends SdkObject {
               localStorage.setItem(name, value);
           }`, true, originState, 'utility');
       }
-      await page.close();
+      await page.close(internalMetadata);
     }
   }
 

src/server/page.ts

@@ -428,7 +428,7 @@ export class Page extends SdkObject {
         this._timeoutSettings.timeout(options));
   }
 
-  async close(options?: { runBeforeUnload?: boolean }) {
+  async close(metadata: CallMetadata, options?: { runBeforeUnload?: boolean }) {
     if (this._closedState === 'closed')
       return;
     const runBeforeUnload = !!options && !!options.runBeforeUnload;
@@ -442,7 +442,7 @@ export class Page extends SdkObject {
     if (!runBeforeUnload)
       await this._closedPromise;
     if (this._ownedContext)
-      await this._ownedContext.close();
+      await this._ownedContext.close(metadata);
   }
 
   private _setIsError() {

src/server/supplements/inspectorController.ts

@@ -25,7 +25,7 @@ export class InspectorController implements InstrumentationListener {
 
   async onContextCreated(context: BrowserContext): Promise<void> {
     if (isDebugMode())
-      RecorderSupplement.getOrCreate(context);
+      RecorderSupplement.getOrCreate(context, { pauseOnNextStatement: true });
   }
 
   async onBeforeCall(sdkObject: SdkObject, metadata: CallMetadata): Promise<void> {
@@ -52,12 +52,8 @@ export class InspectorController implements InstrumentationListener {
       }
     }
 
-    if (metadata.method === 'pause') {
-      // Force create recorder on pause.
-      if (!context._browser.options.headful && !isUnderTest())
-        return;
-      RecorderSupplement.getOrCreate(context);
-    }
+    if (shouldOpenInspector(sdkObject, metadata))
+      RecorderSupplement.getOrCreate(context, { pauseOnNextStatement: true });
 
     const recorder = await RecorderSupplement.getNoCreate(context);
     await recorder?.onBeforeCall(sdkObject, metadata);
@@ -104,3 +100,9 @@ export class InspectorController implements InstrumentationListener {
     await recorder?.updateCallLog([metadata]);
   }
 }
+
+function shouldOpenInspector(sdkObject: SdkObject, metadata: CallMetadata): boolean {
+  if (!sdkObject.attribution.browser?.options.headful && !isUnderTest())
+    return false;
+  return metadata.method === 'pause';
+}