chore: reuse ConsoleMessage between browsers (#116)

src/chromium/ExecutionContext.ts

@@ -164,13 +164,13 @@ export class ExecutionContextDelegate implements js.ExecutionContextDelegate {
     return valueFromRemoteObject(remoteObject);
   }
 
-  handleToString(handle: js.JSHandle): string {
+  handleToString(handle: js.JSHandle, includeType: boolean): string {
     const object = toRemoteObject(handle);
     if (object.objectId) {
       const type =  object.subtype || object.type;
       return 'JSHandle@' + type;
     }
-    return 'JSHandle:' + valueFromRemoteObject(object);
+    return (includeType ? 'JSHandle:' : '') + valueFromRemoteObject(object);
   }
 }
 

src/chromium/Page.ts

@@ -32,10 +32,10 @@ import { PDF } from './features/pdf';
 import { Workers } from './features/workers';
 import { FrameManager, FrameManagerEvents } from './FrameManager';
 import { RawMouseImpl, RawKeyboardImpl } from './Input';
-import { toHandle, toRemoteObject } from './ExecutionContext';
+import { toHandle } from './ExecutionContext';
 import { NetworkManagerEvents } from './NetworkManager';
 import { Protocol } from './protocol';
-import { getExceptionMessage, releaseObject, valueFromRemoteObject } from './protocolHelper';
+import { getExceptionMessage, releaseObject } from './protocolHelper';
 import { Target } from './Target';
 import * as input from '../input';
 import * as types from '../types';
@@ -44,6 +44,7 @@ import * as frames from '../frames';
 import * as js from '../javascript';
 import * as network from '../network';
 import * as dialog from '../dialog';
+import * as console from '../console';
 import { DOMWorldDelegate } from './JSHandle';
 import { Screenshotter, ScreenshotOptions } from './Screenshotter';
 
@@ -199,7 +200,7 @@ export class Page extends EventEmitter {
     if (args)
       args.map(arg => releaseObject(this._client, arg));
     if (source !== 'worker')
-      this.emit(Events.Page.Console, new ConsoleMessage(level, text, [], {url, lineNumber}));
+      this.emit(Events.Page.Console, new console.ConsoleMessage(level, text, [], {url, lineNumber}));
   }
 
   mainFrame(): frames.Frame {
@@ -357,21 +358,12 @@ export class Page extends EventEmitter {
       args.forEach(arg => arg.dispose());
       return;
     }
-    const textTokens = [];
-    for (const arg of args) {
-      const remoteObject = toRemoteObject(arg);
-      if (remoteObject.objectId)
-        textTokens.push(arg.toString());
-      else
-        textTokens.push(valueFromRemoteObject(remoteObject));
-    }
     const location = stackTrace && stackTrace.callFrames.length ? {
       url: stackTrace.callFrames[0].url,
       lineNumber: stackTrace.callFrames[0].lineNumber,
       columnNumber: stackTrace.callFrames[0].columnNumber,
     } : {};
-    const message = new ConsoleMessage(type, textTokens.join(' '), args, location);
+    this.emit(Events.Page.Console, new console.ConsoleMessage(type, undefined, args, location));
-    this.emit(Events.Page.Console, message);
   }
 
   _onDialog(event : Protocol.Page.javascriptDialogOpeningPayload) {
@@ -601,42 +593,6 @@ type MediaFeature = {
   value: string
 }
 
-type ConsoleMessageLocation = {
-  url?: string,
-  lineNumber?: number,
-  columnNumber?: number
-};
-
-export class ConsoleMessage {
-  private _type: string;
-  private _text: string;
-  private _args: js.JSHandle[];
-  private _location: any;
-
-  constructor(type: string, text: string, args: js.JSHandle[], location: ConsoleMessageLocation = {}) {
-    this._type = type;
-    this._text = text;
-    this._args = args;
-    this._location = location;
-  }
-
-  type(): string {
-    return this._type;
-  }
-
-  text(): string {
-    return this._text;
-  }
-
-  args(): js.JSHandle[] {
-    return this._args;
-  }
-
-  location(): object {
-    return this._location;
-  }
-}
-
 type FileChooser = {
   element: dom.ElementHandle,
   multiple: boolean

src/chromium/api.ts

@@ -20,6 +20,7 @@ export { Worker, Workers } from './features/workers';
 export { Frame } from '../frames';
 export { Keyboard, Mouse } from '../input';
 export { Request, Response } from '../network';
-export { ConsoleMessage, Page } from './Page';
+export { Page } from './Page';
 export { Playwright } from './Playwright';
 export { Target } from './Target';
+export { ConsoleMessage } from '../console';

src/console.ts

@@ -0,0 +1,42 @@
+// Copyright (c) Microsoft Corporation.
+// Licensed under the MIT license.
+
+import * as js from './javascript';
+
+type ConsoleMessageLocation = {
+  url?: string,
+  lineNumber?: number,
+  columnNumber?: number,
+};
+
+export class ConsoleMessage {
+  private _type: string;
+  private _text?: string;
+  private _args: js.JSHandle[];
+  private _location: ConsoleMessageLocation;
+
+  constructor(type: string, text: string | undefined, args: js.JSHandle[], location?: ConsoleMessageLocation) {
+    this._type = type;
+    this._text = text;
+    this._args = args;
+    this._location = location || {};
+  }
+
+  type(): string {
+    return this._type;
+  }
+
+  text(): string {
+    if (this._text === undefined)
+      this._text = this._args.map(arg => arg.executionContext()._delegate.handleToString(arg, false /* includeType */)).join(' ');
+    return this._text;
+  }
+
+  args(): js.JSHandle[] {
+    return this._args;
+  }
+
+  location(): ConsoleMessageLocation {
+    return this._location;
+  }
+}

src/firefox/ExecutionContext.ts

@@ -145,11 +145,11 @@ export class ExecutionContextDelegate implements js.ExecutionContextDelegate {
     return deserializeValue(simpleValue.result);
   }
 
-  handleToString(handle: js.JSHandle): string {
+  handleToString(handle: js.JSHandle, includeType: boolean): string {
     const payload = toPayload(handle);
     if (payload.objectId)
       return 'JSHandle@' + (payload.subtype || payload.type);
-    return 'JSHandle:' + deserializeValue(payload);
+    return (includeType ? 'JSHandle:' : '') + deserializeValue(payload);
   }
 
   private _toProtocolValue(payload: any): any {

src/firefox/Page.ts

@@ -36,8 +36,9 @@ import * as dom from '../dom';
 import * as js from '../javascript';
 import * as network from '../network';
 import * as frames from '../frames';
-import { toHandle, toPayload, deserializeValue } from './ExecutionContext';
 import * as dialog from '../dialog';
+import { toHandle } from './ExecutionContext';
+import * as console from '../console';
 
 const writeFileAsync = helper.promisify(fs.writeFile);
 
@@ -552,7 +553,7 @@ export class Page extends EventEmitter {
 
   _onConsole({type, args, executionContextId, location}) {
     const context = this._frameManager.executionContextById(executionContextId);
-    this.emit(Events.Page.Console, new ConsoleMessage(type, args.map(arg => toHandle(context, arg)), location));
+    this.emit(Events.Page.Console, new console.ConsoleMessage(type, undefined, args.map(arg => toHandle(context, arg)), location));
   }
 
   isClosed(): boolean {
@@ -587,39 +588,6 @@ export class Page extends EventEmitter {
   }
 }
 
-export class ConsoleMessage {
-  private _type: string;
-  private _args: js.JSHandle[];
-  private _location: any;
-
-  constructor(type: string, args: Array<js.JSHandle>, location) {
-    this._type = type;
-    this._args = args;
-    this._location = location;
-  }
-
-  location() {
-    return this._location;
-  }
-
-  type(): string {
-    return this._type;
-  }
-
-  args(): Array<js.JSHandle> {
-    return this._args;
-  }
-
-  text(): string {
-    return this._args.map(arg => {
-      const payload = toPayload(arg);
-      if (payload.objectId)
-        return arg.toString();
-      return deserializeValue(payload);
-    }).join(' ');
-  }
-}
-
 function getScreenshotMimeType(options) {
   // options.type takes precedence over inferring the type from options.path
   // because it may be a 0-length file with no extension created beforehand (i.e. as a temp file).

src/firefox/api.ts

@@ -13,6 +13,6 @@ export { Permissions } from './features/permissions';
 export { Frame } from '../frames';
 export { ElementHandle } from '../dom';
 export { Request, Response } from '../network';
-export { ConsoleMessage, Page } from './Page';
+export { Page } from './Page';
 export { Playwright } from './Playwright';
-
+export { ConsoleMessage } from '../console';

src/javascript.ts

@@ -9,7 +9,7 @@ export interface ExecutionContextDelegate {
   evaluate(context: ExecutionContext, returnByValue: boolean, pageFunction: string | Function, ...args: any[]): Promise<any>;
   getProperties(handle: JSHandle): Promise<Map<string, JSHandle>>;
   releaseHandle(handle: JSHandle): Promise<void>;
-  handleToString(handle: JSHandle): string;
+  handleToString(handle: JSHandle, includeType: boolean): string;
   handleJSONValue(handle: JSHandle): Promise<any>;
 }
 
@@ -86,6 +86,6 @@ export class JSHandle {
   }
 
   toString(): string {
-    return this._context._delegate.handleToString(this);
+    return this._context._delegate.handleToString(this, true /* includeType */);
   }
 }

src/webkit/ExecutionContext.ts

@@ -303,7 +303,7 @@ export class ExecutionContextDelegate implements js.ExecutionContextDelegate {
     return valueFromRemoteObject(remoteObject);
   }
 
-  handleToString(handle: js.JSHandle): string {
+  handleToString(handle: js.JSHandle, includeType: boolean): string {
     const object = toRemoteObject(handle);
     if (object.objectId) {
       let type: string =  object.subtype || object.type;
@@ -312,7 +312,7 @@ export class ExecutionContextDelegate implements js.ExecutionContextDelegate {
         type = 'promise';
       return 'JSHandle@' + type;
     }
-    return 'JSHandle:' + valueFromRemoteObject(object);
+    return (includeType ? 'JSHandle:' : '') + valueFromRemoteObject(object);
   }
 
   private _convertArgument(arg: js.JSHandle | any) : Protocol.Runtime.CallArgument {

src/webkit/Page.ts

@@ -26,10 +26,9 @@ import { TargetSession, TargetSessionEvents } from './Connection';
 import { Events } from './events';
 import { FrameManager, FrameManagerEvents } from './FrameManager';
 import { RawKeyboardImpl, RawMouseImpl } from './Input';
-import { toHandle, toRemoteObject } from './ExecutionContext';
+import { toHandle } from './ExecutionContext';
 import { NetworkManagerEvents } from './NetworkManager';
 import { Protocol } from './protocol';
-import { valueFromRemoteObject } from './protocolHelper';
 import { Target } from './Target';
 import { TaskQueue } from './TaskQueue';
 import * as input from '../input';
@@ -39,6 +38,7 @@ import * as frames from '../frames';
 import * as js from '../javascript';
 import * as network from '../network';
 import * as dialog from '../dialog';
+import * as console from '../console';
 
 const writeFileAsync = helper.promisify(fs.writeFile);
 
@@ -179,17 +179,7 @@ export class Page extends EventEmitter {
       }
       return toHandle(context, p);
     });
-    const textTokens = [];
+    this.emit(Events.Page.Console, new console.ConsoleMessage(derivedType, handles.length ? undefined : text, handles, { url, lineNumber, columnNumber }));
-    for (const handle of handles) {
-      const remoteObject = toRemoteObject(handle);
-      if (remoteObject.objectId)
-        textTokens.push(handle.toString());
-      else
-        textTokens.push(valueFromRemoteObject(remoteObject));
-    }
-    const location = {url, lineNumber, columnNumber};
-    const formattedText = textTokens.length ? textTokens.join(' ') : text;
-    this.emit(Events.Page.Console, new ConsoleMessage(derivedType, formattedText, handles, location));
   }
 
   mainFrame(): frames.Frame {
@@ -549,42 +539,6 @@ type ScreenshotOptions = {
   encoding?: string,
 }
 
-type ConsoleMessageLocation = {
-  url?: string,
-  lineNumber?: number,
-  columnNumber?: number
-};
-
-export class ConsoleMessage {
-  private _type: string;
-  private _text: string;
-  private _args: js.JSHandle[];
-  private _location: any;
-
-  constructor(type: string, text: string, args: js.JSHandle[], location: ConsoleMessageLocation = {}) {
-    this._type = type;
-    this._text = text;
-    this._args = args;
-    this._location = location;
-  }
-
-  type(): string {
-    return this._type;
-  }
-
-  text(): string {
-    return this._text;
-  }
-
-  args(): js.JSHandle[] {
-    return this._args;
-  }
-
-  location(): object {
-    return this._location;
-  }
-}
-
 type FileChooser = {
   element: dom.ElementHandle,
   multiple: boolean

src/webkit/api.ts

@@ -9,7 +9,8 @@ export { Frame } from '../frames';
 export { Mouse, Keyboard } from '../input';
 export { ElementHandle } from '../dom';
 export { Request, Response } from '../network';
-export { ConsoleMessage, Page } from './Page';
+export { Page } from './Page';
 export { Playwright } from './Playwright';
 export { Target } from './Target';
 export { Dialog } from '../dialog';
+export { ConsoleMessage } from '../console';