Add mimeType and stringifyStep to Recorder extension API

mimeType would be needed for syntax highlighting and file extension
generation. And stringifyStep for partial stringification.

Bug: 1325751
Change-Id: I2a8c7c55cf5c8ea299a5e133725ce59e6ea69dad
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/3683218
Commit-Queue: Alex Rudenko <alexrudenko@chromium.org>
Reviewed-by: Philip Pfaffe <pfaffe@chromium.org>

extension-api/ExtensionAPI.d.ts

@@ -172,7 +172,8 @@ export namespace Chrome {
     }
 
     export interface RecorderExtensionPlugin {
-      stringify(obj: Record<string, any>): Promise<string>;
+      stringify(recording: Record<string, any>): Promise<string>;
+      stringifyStep(step: Record<string, any>): Promise<string>;
     }
 
     export interface LanguageExtensionPlugin {
@@ -278,7 +279,8 @@ export namespace Chrome {
     }
 
     export interface RecorderExtensions {
-      registerRecorderExtensionPlugin(plugin: RecorderExtensionPlugin, pluginName: string): Promise<void>;
+      registerRecorderExtensionPlugin(plugin: RecorderExtensionPlugin, pluginName: string, mimeType: string):
+          Promise<void>;
       unregisterRecorderExtensionPlugin(plugin: RecorderExtensionPlugin): Promise<void>;
     }
 

front_end/models/extensions/ExtensionAPI.ts

@@ -132,6 +132,7 @@ export namespace PrivateAPI {
   type RegisterRecorderExtensionPluginRequest = {
     command: Commands.RegisterRecorderExtensionPlugin,
     pluginName: string,
+    mimeType: string,
     port: MessagePort,
   };
   type SubscribeRequest = {command: Commands.Subscribe, type: string};
@@ -705,8 +706,8 @@ self.injectedExtensionAPI = function(
   (RecorderServicesAPIImpl.prototype as
    Pick<APIImpl.RecorderExtensions, 'registerRecorderExtensionPlugin'|'unregisterRecorderExtensionPlugin'>) = {
     registerRecorderExtensionPlugin: async function(
-        this: APIImpl.RecorderExtensions, plugin: PublicAPI.Chrome.DevTools.RecorderExtensionPlugin,
-        pluginName: string): Promise<void> {
+        this: APIImpl.RecorderExtensions, plugin: PublicAPI.Chrome.DevTools.RecorderExtensionPlugin, pluginName: string,
+        mimeType: string): Promise<void> {
       if (this._plugins.has(plugin)) {
         throw new Error(`Tried to register plugin '${pluginName}' twice`);
       }
@@ -734,6 +735,7 @@ self.injectedExtensionAPI = function(
             {
               command: PrivateAPI.Commands.RegisterRecorderExtensionPlugin,
               pluginName,
+              mimeType,
               port: channel.port2,
             },
             () => resolve(), [channel.port2]);

front_end/models/extensions/ExtensionServer.ts

@@ -222,10 +222,10 @@ export class ExtensionServer extends Common.ObjectWrapper.ObjectWrapper<EventTyp
   private registerRecorderExtensionEndpoint(
       message: PrivateAPI.ExtensionServerRequestMessage, _shared_port: MessagePort): Record {
     if (message.command !== PrivateAPI.Commands.RegisterRecorderExtensionPlugin) {
-      return this.status.E_BADARG('command', `expected ${PrivateAPI.Commands.Subscribe}`);
+      return this.status.E_BADARG('command', `expected ${PrivateAPI.Commands.RegisterRecorderExtensionPlugin}`);
     }
-    const {pluginName, port} = message;
-    RecorderPluginManager.instance().addPlugin(new RecorderExtensionEndpoint(pluginName, port));
+    const {pluginName, mimeType, port} = message;
+    RecorderPluginManager.instance().addPlugin(new RecorderExtensionEndpoint(pluginName, mimeType, port));
     return this.status.OK();
   }
 

front_end/models/extensions/RecorderExtensionEndpoint.ts

@@ -8,16 +8,22 @@ import {RecorderPluginManager} from './RecorderPluginManager.js';
 
 export class RecorderExtensionEndpoint extends ExtensionEndpoint {
   private readonly name: string;
+  private readonly mimeType: string;
 
-  constructor(name: string, port: MessagePort) {
+  constructor(name: string, mimeType: string, port: MessagePort) {
     super(port);
     this.name = name;
+    this.mimeType = mimeType;
   }
 
   getName(): string {
     return this.name;
   }
 
+  getMimeType(): string {
+    return this.mimeType;
+  }
+
   protected handleEvent({event}: {event: string}): void {
     switch (event) {
       case PrivateAPI.RecorderExtensionPluginEvents.UnregisteredRecorderExtensionPlugin: {

test/unittests/front_end/models/extensions/ExtensionServer_test.ts

@@ -32,8 +32,11 @@ describe('Extensions', () => {
       async stringify(recording: object) {
         return JSON.stringify(recording);
       }
+      async stringifyStep(step: object) {
+        return JSON.stringify(step);
+      }
     }
-    await chrome.devtools?.recorder.registerRecorderExtensionPlugin(new RecorderPlugin(), 'Test');
+    await chrome.devtools?.recorder.registerRecorderExtensionPlugin(new RecorderPlugin(), 'Test', 'text/javascript');
 
     const manager = Extensions.RecorderPluginManager.RecorderPluginManager.instance();
     assert.strictEqual(manager.plugins().length, 1);
@@ -44,7 +47,14 @@ describe('Extensions', () => {
       steps: [],
     });
 
+    const stepResult = await plugin.stringify({
+      type: 'scroll',
+    });
+
     assert.strictEqual(manager.plugins().length, 1);
+    assert.strictEqual(manager.plugins()[0].getMimeType(), 'text/javascript');
+    assert.strictEqual(manager.plugins()[0].getName(), 'Test');
     assert.deepStrictEqual(result, '{"name":"test","steps":[]}');
+    assert.deepStrictEqual(stepResult, '{"type":"scroll"}');
   });
 });