record-with-chromium

record-with-chromium

#!/usr/bin/env node

const { spawn } = require("child_process");
const util = require("node:util");

const exec = util.promisify(require("node:child_process").exec);

async function main() {
  let { REPLAY_CHROME, RECORD_REPLAY_API_KEY } = process.env;
  if (!REPLAY_CHROME || !RECORD_REPLAY_API_KEY) {
    console.error(
      "Script requires REPLAY_CHROME and RECORD_REPLAY_API_KEY environment variables"
    );
    process.exit(1);
  }

  let [_, __, url] = process.argv;
  if (!url) {
    console.error("Usage: record-with-chromium <url>");
    process.exit(1);
  } else {
    url = url.trim();
  }

  try {
    await record(REPLAY_CHROME, url);
    const recordingId = await findRecordingId(url);
    await upload(recordingId);
    await openRecording(recordingId);

    process.exit(0);
  } catch (error) {
    console.error(error);
    process.exit(1);
  }
}

async function findRecordingId(url) {
  const { host } = new URL(url);

  const { stdout } = await exec("replay ls");
  const text = stdout.toString();
  const lines = text.split("\n");
  for (let index = 1; index < lines.length; index++) {
    const line = lines[index];
    const [id, status, title, date] = line.split(/\s{2,}/);

    if (title === `Replay of ${host}`) {
      return id;
    }
  }

  throw Error(`Could not find recording for ${url}`);
}

async function openRecording(recordingId) {
  const url = `https://app.replay.io/recording/${recordingId}`;
  const openCommand =
    process.platform == "darwin"
      ? "open"
      : process.platform == "win32"
      ? "start"
      : "xdg-open";
  await exec(`${openCommand} ${url}`);
}

async function record(chromePath, url) {
  return new Promise((resolve, reject) => {
    console.log(`Recording ${url}...`);

    let replayProcess = spawn(`${chromePath}`, [`${url}`]);
    replayProcess.stderr.on("data", (data) => {
      console.error(data);
    });
    replayProcess.on("close", (code) => {
      console.log("exited with code", code);

      if (code === 0) {
        resolve();
      } else {
        reject(`Process exited with code ${code}`);
      }
    });
  });
}

async function upload(recordingId) {
  console.log(`Uploading recording ${recordingId}...`);

  await exec(`replay upload ${recordingId}`, {
    env: process.env,
  });
}

main();

Btw: replay ls has a --json flag (ref), and there is now also the launch command.
Other than that, this script is still needed, since there is still no "record and replay it" in one swoop type of command in the CLI. Much appreciated!