add tests for cli.ts

packages/rrvideo/jest.config.js

@@ -0,0 +1,6 @@
+// eslint-disable-next-line tsdoc/syntax
+/** @type {import('ts-jest/dist/types').InitialOptionsTsJest} */
+module.exports = {
+  preset: 'ts-jest',
+  testEnvironment: 'node',
+};

packages/rrvideo/package.json

@@ -13,14 +13,20 @@
   "scripts": {
     "install": "playwright install",
     "build": "tsc",
+    "test": "jest",
+    "check-types": "tsc -noEmit",
     "prepublish": "yarn build"
   },
   "author": "[email protected]",
   "license": "MIT",
   "devDependencies": {
     "@types/fs-extra": "11.0.1",
+    "@types/jest": "^27.4.1",
     "@types/minimist": "^1.2.1",
-    "@rrweb/types": "^2.0.0-alpha.7"
+    "@types/node": "^18.15.11",
+    "@rrweb/types": "^2.0.0-alpha.7",
+    "jest": "^27.5.1",
+    "ts-jest": "^27.1.3"
   },
   "dependencies": {
     "@open-tech-world/cli-progress-bar": "^2.0.2",

packages/rrvideo/test/cli.test.ts

@@ -0,0 +1,45 @@
+import { execSync } from 'child_process';
+import * as fs from 'fs-extra';
+import * as path from 'path';
+import exampleEvents from './events/example';
+
+describe('should be able to run cli', () => {
+  beforeAll(() => {
+    fs.mkdirSync(path.resolve(__dirname, './generated'));
+    fs.writeJsonSync(
+      path.resolve(__dirname, './generated/example.json'),
+      exampleEvents,
+      {
+        spaces: 2,
+      },
+    );
+  });
+  afterAll(async () => {
+    await fs.remove(path.resolve(__dirname, './generated'));
+  });
+
+  it('should throw error without input path', () => {
+    expect(() => {
+      execSync('node ./build/cli.js', { stdio: 'pipe' });
+    }).toThrowError(/.*please pass --input to your rrweb events file.*/);
+  });
+
+  it('should generate a video without output path', () => {
+    execSync('node ./build/cli.js --input ./test/generated/example.json', {
+      stdio: 'pipe',
+    });
+    const outputFile = path.resolve(__dirname, '../rrvideo-output.webm');
+    expect(fs.existsSync(outputFile)).toBe(true);
+    fs.removeSync(outputFile);
+  });
+
+  it('should generate a video with specific output path', () => {
+    const outputFile = path.resolve(__dirname, './generated/output.webm');
+    execSync(
+      `node ./build/cli.js --input ./test/generated/example.json --output ${outputFile}`,
+      { stdio: 'pipe' },
+    );
+    expect(fs.existsSync(outputFile)).toBe(true);
+    fs.removeSync(outputFile);
+  });
+});

packages/rrvideo/test/events/example.ts

@@ -0,0 +1,147 @@
+import { EventType, IncrementalSource } from '@rrweb/types';
+import type { eventWithTime } from '@rrweb/types';
+
+const now = Date.now();
+const events: eventWithTime[] = [
+  {
+    type: EventType.DomContentLoaded,
+    data: {},
+    timestamp: now,
+  },
+  {
+    type: EventType.Load,
+    data: {},
+    timestamp: now + 100,
+  },
+  {
+    type: EventType.Meta,
+    data: {
+      href: 'http://localhost',
+      width: 1000,
+      height: 800,
+    },
+    timestamp: now + 100,
+  },
+  // full snapshot:
+  {
+    data: {
+      node: {
+        id: 1,
+        type: 0,
+        childNodes: [
+          { id: 2, name: 'html', type: 1, publicId: '', systemId: '' },
+          {
+            id: 3,
+            type: 2,
+            tagName: 'html',
+            attributes: { lang: 'en' },
+            childNodes: [
+              {
+                id: 4,
+                type: 2,
+                tagName: 'head',
+                attributes: {},
+                childNodes: [],
+              },
+              {
+                id: 5,
+                type: 2,
+                tagName: 'body',
+                attributes: {},
+                childNodes: [],
+              },
+            ],
+          },
+        ],
+      },
+      initialOffset: { top: 0, left: 0 },
+    },
+    type: EventType.FullSnapshot,
+    timestamp: now + 100,
+  },
+  // mutation that adds select elements
+  {
+    type: EventType.IncrementalSnapshot,
+    data: {
+      source: IncrementalSource.Mutation,
+      texts: [],
+      attributes: [],
+      removes: [],
+      adds: [
+        {
+          parentId: 5,
+          nextId: null,
+          node: {
+            type: 2,
+            tagName: 'select',
+            childNodes: [],
+            attributes: {},
+            id: 26,
+          },
+        },
+        {
+          parentId: 26,
+          nextId: null,
+          node: {
+            type: 2,
+            tagName: 'option',
+            attributes: { value: 'valueC' },
+            childNodes: [],
+            id: 27,
+          },
+        },
+        {
+          parentId: 27,
+          nextId: null,
+          node: { type: 3, textContent: 'C', id: 28 },
+        },
+        {
+          parentId: 26,
+          nextId: 27,
+          node: {
+            type: 2,
+            tagName: 'option',
+            attributes: { value: 'valueB', selected: true },
+            childNodes: [],
+            id: 29,
+          },
+        },
+        {
+          parentId: 26,
+          nextId: 29,
+          node: {
+            type: 2,
+            tagName: 'option',
+            attributes: { value: 'valueA' },
+            childNodes: [],
+            id: 30,
+          },
+        },
+        {
+          parentId: 30,
+          nextId: null,
+          node: { type: 3, textContent: 'A', id: 31 },
+        },
+        {
+          parentId: 29,
+          nextId: null,
+          node: { type: 3, textContent: 'B', id: 32 },
+        },
+      ],
+    },
+    timestamp: now + 200,
+  },
+  // input event
+  {
+    type: EventType.IncrementalSnapshot,
+    data: {
+      source: IncrementalSource.Input,
+      text: 'valueA',
+      isChecked: false,
+      id: 26,
+    },
+    timestamp: now + 300,
+  },
+];
+
+export default events;

packages/rrvideo/test/tsconfig.json

@@ -0,0 +1,3 @@
+{
+  "compilerOptions": {}
+}

packages/rrweb/test/events/input.ts

@@ -74,6 +74,7 @@ const events: eventWithTime[] = [
           node: {
             type: 2,
             tagName: 'select',
+            attributes: {},
             childNodes: [],
             id: 26,
           },

yarn.lock

@@ -2965,6 +2965,11 @@
   resolved "https://registry.npmjs.org/@types/node/-/node-17.0.21.tgz"
   integrity sha512-DBZCJbhII3r90XbQxI8Y9IjjiiOGlZ0Hr32omXIZvwwZ7p4DMMXGrKXVyPfuoBOri9XNtL0UK69jYIBIsRX3QQ==
 
+"@types/node@^18.15.11":
+  version "18.15.11"
+  resolved "https://registry.yarnpkg.com/@types/node/-/node-18.15.11.tgz#b3b790f09cb1696cffcec605de025b088fa4225f"
+  integrity sha512-E5Kwq2n4SbMzQOn6wnmBjuK9ouqlURrcZDVfbo9ftDDTFt3nk7ZKK4GMOzoYgnpQJKcxwQw+lGaBvvlMo0qN/Q==
+
 "@types/normalize-package-data@^2.4.0":
   version "2.4.1"
   resolved "https://registry.npmjs.org/@types/normalize-package-data/-/normalize-package-data-2.4.1.tgz"