feat: add JSONStringifyExtension with source map support (#393)

__snapshots__/JSONStringifyExtension.test.ts.js

@@ -0,0 +1,55 @@
+exports['JSONStringifyExtension should print the script for a click step 1'] = `
+{
+  "type": "click",
+  "target": "main",
+  "selectors": [
+    "aria/Test"
+  ],
+  "offsetX": 1,
+  "offsetY": 1,
+  "assertedEvents": [
+    {
+      "type": "navigation"
+    }
+  ]
+}
+
+`;
+
+exports['JSONStringifyExtension should print an entire script 1'] = `
+{
+  "title": "test",
+  "steps": [
+    {
+      "type": "click",
+      "target": "main",
+      "selectors": [
+        "aria/Test"
+      ],
+      "offsetX": 1,
+      "offsetY": 1,
+      "assertedEvents": [
+        {
+          "type": "navigation"
+        }
+      ]
+    },
+    {
+      "type": "click",
+      "target": "main",
+      "selectors": [
+        "aria/Test"
+      ],
+      "offsetX": 1,
+      "offsetY": 1,
+      "assertedEvents": [
+        {
+          "type": "navigation"
+        }
+      ]
+    }
+  ]
+}
+//# recorderSourceMap=BDORO
+
+`;

src/JSONStringifyExtension.ts

@@ -0,0 +1,60 @@
+/**
+    Copyright 2022 Google LLC
+
+    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
+
+        https://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.
+ */
+
+import type { LineWriter } from './LineWriter.js';
+import type { Step, UserFlow } from './Schema.js';
+import { StringifyExtension } from './StringifyExtension.js';
+
+/**
+ * Stringifies a user flow to JSON with source maps.
+ *
+ * You probably want to strip the source map because not all
+ * parsers support comments in JSON.
+ */
+export class JSONStringifyExtension extends StringifyExtension {
+  override async beforeAllSteps(out: LineWriter, flow: UserFlow) {
+    const copy = {
+      ...flow,
+      steps: undefined,
+    };
+    // Stringify top-level attributes.
+    const text = JSON.stringify(copy, null, out.getIndent());
+    const lines = text.split('\n');
+    lines.pop();
+    lines[lines.length - 1] += ',';
+    lines.push(out.getIndent() + `"steps": [`);
+    out.appendLine(lines.join('\n')).startBlock().startBlock();
+  }
+
+  override async afterAllSteps(out: LineWriter) {
+    out
+      .endBlock()
+      .endBlock()
+      .appendLine(out.getIndent() + `]`)
+      .appendLine('}');
+  }
+
+  override async stringifyStep(out: LineWriter, step: Step, flow?: UserFlow) {
+    const stepText = JSON.stringify(step, null, out.getIndent());
+    if (!flow) {
+      out.appendLine(stepText);
+      return;
+    }
+    const separator =
+      flow.steps.lastIndexOf(step) === flow.steps.length - 1 ? '' : ',';
+    out.appendLine(stepText + separator);
+  }
+}

src/main.ts

@@ -21,6 +21,7 @@ export * from './Schema.js';
 export * as Schema from './Schema.js';
 export * from './SchemaUtils.js';
 export { StringifyExtension } from './StringifyExtension.js';
+export { JSONStringifyExtension } from './JSONStringifyExtension.js';
 export {
   stringify,
   stringifyStep,

test/JSONStringifyExtension.test.ts

@@ -0,0 +1,68 @@
+/**
+    Copyright 2022 Google LLC
+
+    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
+
+        https://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.
+ */
+
+import snapshot from 'snap-shot-it';
+import { stringify } from '../src/stringify.js';
+import { InMemoryLineWriter } from '../src/InMemoryLineWriter.js';
+import { JSONStringifyExtension } from '../src/JSONStringifyExtension.js';
+import { StepType, AssertedEventType } from '../src/Schema.js';
+
+describe('JSONStringifyExtension', () => {
+  const ext = new JSONStringifyExtension();
+
+  it('should print the script for a click step', async () => {
+    const step = {
+      type: StepType.Click as const,
+      target: 'main',
+      selectors: ['aria/Test'],
+      offsetX: 1,
+      offsetY: 1,
+      assertedEvents: [{ type: AssertedEventType.Navigation as const }],
+    };
+    const writer = new InMemoryLineWriter('  ');
+    await ext.stringifyStep(writer, step);
+    snapshot(writer.toString());
+  });
+
+  it('should print an entire script', async () => {
+    const flow = {
+      title: 'test',
+      steps: [
+        {
+          type: StepType.Click as const,
+          target: 'main',
+          selectors: ['aria/Test'],
+          offsetX: 1,
+          offsetY: 1,
+          assertedEvents: [{ type: AssertedEventType.Navigation as const }],
+        },
+        {
+          type: StepType.Click as const,
+          target: 'main',
+          selectors: ['aria/Test'],
+          offsetX: 1,
+          offsetY: 1,
+          assertedEvents: [{ type: AssertedEventType.Navigation as const }],
+        },
+      ],
+    };
+    snapshot(
+      await stringify(flow, {
+        extension: ext,
+      })
+    );
+  });
+});