Moving more code into shared (#571)

Continuation of [PRO-720](https://linear.app/replay/issue/PRO-720); follows up to #562 Moving much of the `replayio` utility-type code into the new `shared` package so that we can use those Node APIs for querying the list of recording and uploading or deleting them. Most of this was rote but I did make a couple of changes worth calling out explicitly: - I changed the value returned by `fetchAuthIdsFromGraphQL` from `{ userId: string | null; workspaceId: string | null }` to `{ id: string; type: "user" | "workspace" }` and updated the callers; this was easier to work with (from a types perspective) - Grafana still gets `userId` _or_ `workspaceId` though, just not both - `Logger` is now eagerly instantiated; the `initialize()` method will accept a name and version and pass them along to the Grafana instance. Logging before initialization (or in Jest tests) will be local-only. - Note that a version parameter is also supported now (so we can associate Grafana logs with specific releases) - Both name and version should probably be imported and passed directly from `package.json` (which is what I am currently doing for Puppeteer and replayio) - Note that I've replaced the previous "replayio" name prefix with whatever the passed package name is - Lots of `debug(...args)` logging has been changed to `logger.debug("...", {...args})` - I've moved `mixpanel` and `launch-darkly` code over to `shared` too, even though (for now) `replayio` is the only thing using this stuff - I also tidied up the `getRecordings` method to not create so many throw-away arrays; (I didn't just do this for performance, but TypeScript was complaining about the return array containing recordings _and_ `undefined` with the previous code structure) ## Next steps - Remove the `test-utils` dependency on `@replayio/replay` (and delete `@replayio/replay`) - Update `test-utils` to be a peer dependency so that it will get inlined as well (to resolve ambiguous logger ownership) - Audit `logger.debug` entries and decide which ones should be `info`, `log`, or even `error` - Address any added `TODO [PRO-720]` comments
replayio · Jun 28, 2024 · 33656ea · 33656ea
1 parent 6ce3100
commit 33656ea
Show file tree

Hide file tree

Showing 175 changed files with 1,178 additions and 951 deletions.
diff --git a/packages/cypress/src/index.ts b/packages/cypress/src/index.ts
@@ -1,8 +1,7 @@
 /// <reference types="cypress" />
 
-import { RecordingEntry } from "@replay-cli/shared/recording/types";
 import { getRuntimePath } from "@replay-cli/shared/runtime/getRuntimePath";
-import { initMetadataFile, warn } from "@replayio/test-utils";
+import { RecordingEntry, initMetadataFile, warn } from "@replayio/test-utils";
 import chalk from "chalk";
 import dbg from "debug";
 import path from "path";
@@ -16,6 +15,16 @@ import { createServer } from "./server";
 import type { StepEvent } from "./support";
 
 export type { PluginOptions } from "./reporter";
+export {
+  getMetadataFilePath,
+  onAfterRun,
+  onAfterSpec,
+  onBeforeBrowserLaunch,
+  onBeforeRun,
+  onBeforeSpec,
+  plugin,
+  cypressOnWrapper as wrapOn,
+};
 
 const debug = dbg("replay:cypress:plugin");
 const debugTask = debug.extend("task");
@@ -342,13 +351,3 @@ export function getCypressReporter() {
 }
 
 export default plugin;
-export {
-  getMetadataFilePath,
-  onAfterRun,
-  onAfterSpec,
-  onBeforeBrowserLaunch,
-  onBeforeRun,
-  onBeforeSpec,
-  plugin,
-  cypressOnWrapper as wrapOn,
-};
diff --git a/packages/cypress/src/junit.ts b/packages/cypress/src/junit.ts
@@ -1,5 +1,5 @@
-import { RecordingEntry } from "@replay-cli/shared/recording/types";
 import { warn } from "@replayio/test-utils";
+import { RecordingEntry } from "@replayio/test-utils";
 import dbg from "debug";
 import fs, { readFileSync, writeFileSync } from "fs";
 import path from "path";

diff --git a/packages/playwright/package.json b/packages/playwright/package.json
@@ -25,6 +25,7 @@
     "@replay-cli/pkg-build": "workspace:^",
     "@replay-cli/shared": "workspace:^",
     "@replay-cli/tsconfig": "workspace:^",
+    "@replayio/test-utils": "workspace:^",
     "@types/debug": "^4.1.8",
     "@types/node": "^20.11.27",
     "@types/stack-utils": "^2.0.3",

diff --git a/packages/puppeteer/src/install.ts b/packages/puppeteer/src/install.ts
@@ -1,13 +1,12 @@
 import { initLogger, logger } from "@replay-cli/shared/logger";
 import { installLatestRuntimeRelease } from "@replay-cli/shared/runtime/installLatestRuntimeRelease";
+import { name, version } from "../package.json";
 
-async function install() {
-  initLogger("puppeteer");
+export default async function install() {
+  initLogger(name, version);
   try {
     await installLatestRuntimeRelease();
   } finally {
     await logger.close();
   }
 }
-
-export default install;
diff --git a/packages/puppeteer/tsconfig.json b/packages/puppeteer/tsconfig.json
@@ -1,7 +1,8 @@
 {
   "extends": "@replay-cli/tsconfig/base.json",
   "compilerOptions": {
-    "lib": ["dom"]
+    "lib": ["dom"],
+    "resolveJsonModule": true
   },
   "include": ["src/**/*.ts"],
   "references": [

diff --git a/packages/replay/package.json b/packages/replay/package.json
@@ -35,6 +35,7 @@
   },
   "homepage": "https://github.com/replayio/replay-cli/blob/main/packages/replay/README.md",
   "dependencies": {
+    "@replay-cli/shared": "workspace:^",
     "@replayio/sourcemap-upload": "workspace:^",
     "@types/semver": "^7.5.6",
     "commander": "^12.0.0",
@@ -55,7 +56,6 @@
   },
   "devDependencies": {
     "@replay-cli/pkg-build": "workspace:^",
-    "@replay-cli/shared": "workspace:^",
     "@replay-cli/tsconfig": "workspace:^",
     "@types/debug": "^4.1.7",
     "@types/jest": "^28.1.5",

diff --git a/packages/replayio/package.json b/packages/replayio/package.json
@@ -57,6 +57,8 @@
     "table": "^6.8.2",
     "undici": "^5.28.4",
     "uuid": "^8.3.2",
+    "winston": "^3.13.0",
+    "winston-loki": "^6.1.2",
     "ws": "^7.5.0"
   },
   "devDependencies": {

diff --git a/packages/replayio/src/bin.ts b/packages/replayio/src/bin.ts
@@ -1,5 +1,7 @@
+import { exitProcess } from "@replay-cli/shared/process/exitProcess";
+import { setUserAgent } from "@replay-cli/shared/userAgent";
+import { name, version } from "../package.json";
 import { finalizeCommander } from "./utils/commander/finalizeCommander";
-import { exitProcess } from "./utils/exitProcess";
 
 // Commands self-register with "commander"
 import "./commands/info";
@@ -12,6 +14,11 @@ import "./commands/remove";
 import "./commands/update";
 import "./commands/upload";
 import "./commands/upload-source-maps";
+import { initLogger } from "@replay-cli/shared/logger";
+
+initLogger(name, version);
+
+setUserAgent(`${name}/${version}`);
 
 finalizeCommander();
 

diff --git a/packages/replayio/src/commands/info.ts b/packages/replayio/src/commands/info.ts
@@ -1,9 +1,9 @@
+import { exitProcess } from "@replay-cli/shared/process/exitProcess";
+import { parseBuildId } from "@replay-cli/shared/runtime/parseBuildId";
+import { highlight } from "@replay-cli/shared/theme";
 import { name as packageName, version as packageVersion } from "../../package.json";
 import { registerCommand } from "../utils/commander/registerCommand";
-import { exitProcess } from "../utils/exitProcess";
 import { getCurrentRuntimeMetadata } from "../utils/initialization/getCurrentRuntimeMetadata";
-import { parseBuildId } from "../utils/installation/parseBuildId";
-import { highlight } from "../utils/theme";
 
 registerCommand("info", {
   checkForNpmUpdate: false,

diff --git a/packages/replayio/src/commands/list.ts b/packages/replayio/src/commands/list.ts
@@ -1,7 +1,7 @@
+import { exitProcess } from "@replay-cli/shared/process/exitProcess";
+import { getRecordings } from "@replay-cli/shared/recording/getRecordings";
+import { printRecordings } from "@replay-cli/shared/recording/printRecordings";
 import { registerCommand } from "../utils/commander/registerCommand";
-import { exitProcess } from "../utils/exitProcess";
-import { getRecordings } from "../utils/recordings/getRecordings";
-import { printRecordings } from "../utils/recordings/printRecordings";
 
 registerCommand("list")
   .description("List all local recordings")

diff --git a/packages/replayio/src/commands/login.ts b/packages/replayio/src/commands/login.ts
@@ -1,7 +1,7 @@
+import { exitProcess } from "@replay-cli/shared/process/exitProcess";
+import { registerCommand } from "../utils/commander/registerCommand";
 import { checkAuthentication } from "../utils/initialization/checkAuthentication";
 import { promptForAuthentication } from "../utils/initialization/promptForAuthentication";
-import { registerCommand } from "../utils/commander/registerCommand";
-import { exitProcess } from "../utils/exitProcess";
 
 registerCommand("login").description("Log into your Replay account (or register)").action(login);
 

diff --git a/packages/replayio/src/commands/logout.ts b/packages/replayio/src/commands/logout.ts
@@ -1,8 +1,8 @@
-import { getAccessToken } from "../utils/authentication/getAccessToken";
-import { logoutIfAuthenticated } from "../utils/authentication/logoutIfAuthenticated";
+import { getAccessToken } from "@replay-cli/shared/authentication/getAccessToken";
+import { logoutIfAuthenticated } from "@replay-cli/shared/authentication/logoutIfAuthenticated";
+import { exitProcess } from "@replay-cli/shared/process/exitProcess";
+import { highlight } from "@replay-cli/shared/theme";
 import { registerCommand } from "../utils/commander/registerCommand";
-import { exitProcess } from "../utils/exitProcess";
-import { highlight } from "../utils/theme";
 
 registerCommand("logout").description("Log out of your Replay account").action(logout);
 

diff --git a/packages/replayio/src/commands/open.ts b/packages/replayio/src/commands/open.ts
@@ -1,7 +1,7 @@
+import { exitProcess } from "@replay-cli/shared/process/exitProcess";
 import { killBrowserIfRunning } from "../utils/browser/killBrowserIfRunning";
 import { launchBrowser } from "../utils/browser/launchBrowser";
 import { registerCommand } from "../utils/commander/registerCommand";
-import { exitProcess } from "../utils/exitProcess";
 
 registerCommand("open", { checkForRuntimeUpdate: true, requireAuthentication: true })
   .argument("[url]", `URL to open (default: "about:blank")`)

diff --git a/packages/replayio/src/commands/record.ts b/packages/replayio/src/commands/record.ts
@@ -1,21 +1,21 @@
+import { ProcessError } from "@replay-cli/shared/ProcessError";
+import { trackEvent } from "@replay-cli/shared/mixpanel/trackEvent";
+import { exitProcess } from "@replay-cli/shared/process/exitProcess";
+import { canUpload } from "@replay-cli/shared/recording/canUpload";
+import { getRecordings } from "@replay-cli/shared/recording/getRecordings";
+import { printRecordings } from "@replay-cli/shared/recording/printRecordings";
+import { selectRecordings } from "@replay-cli/shared/recording/selectRecordings";
+import { LocalRecording } from "@replay-cli/shared/recording/types";
+import { uploadRecordings } from "@replay-cli/shared/recording/upload/uploadRecordings";
+import { dim, statusFailed } from "@replay-cli/shared/theme";
 import debug from "debug";
 import { v4 as uuid } from "uuid";
-import { ProcessError } from "../utils/ProcessError";
 import { logAsyncOperation } from "../utils/async/logAsyncOperation";
 import { killBrowserIfRunning } from "../utils/browser/killBrowserIfRunning";
 import { launchBrowser } from "../utils/browser/launchBrowser";
 import { reportBrowserCrash } from "../utils/browser/reportBrowserCrash";
 import { registerCommand } from "../utils/commander/registerCommand";
 import { confirm } from "../utils/confirm";
-import { exitProcess } from "../utils/exitProcess";
-import { trackEvent } from "../utils/mixpanel/trackEvent";
-import { canUpload } from "../utils/recordings/canUpload";
-import { getRecordings } from "../utils/recordings/getRecordings";
-import { printRecordings } from "../utils/recordings/printRecordings";
-import { selectRecordings } from "../utils/recordings/selectRecordings";
-import { LocalRecording } from "../utils/recordings/types";
-import { uploadRecordings } from "../utils/recordings/upload/uploadRecordings";
-import { dim, statusFailed } from "../utils/theme";
 
 registerCommand("record", { checkForRuntimeUpdate: true, requireAuthentication: true })
   .argument("[url]", `URL to open (default: "about:blank")`)

diff --git a/packages/replayio/src/commands/remove.ts b/packages/replayio/src/commands/remove.ts
@@ -1,12 +1,12 @@
+import { exitProcess } from "@replay-cli/shared/process/exitProcess";
+import { findRecordingsWithShortIds } from "@replay-cli/shared/recording/findRecordingsWithShortIds";
+import { getRecordings } from "@replay-cli/shared/recording/getRecordings";
+import { printRecordings } from "@replay-cli/shared/recording/printRecordings";
+import { removeAllFromDisk, removeFromDisk } from "@replay-cli/shared/recording/removeFromDisk";
+import { selectRecordings } from "@replay-cli/shared/recording/selectRecordings";
+import { LocalRecording } from "@replay-cli/shared/recording/types";
+import { dim } from "@replay-cli/shared/theme";
 import { registerCommand } from "../utils/commander/registerCommand";
-import { exitProcess } from "../utils/exitProcess";
-import { findRecordingsWithShortIds } from "../utils/recordings/findRecordingsWithShortIds";
-import { getRecordings } from "../utils/recordings/getRecordings";
-import { printRecordings } from "../utils/recordings/printRecordings";
-import { removeAllFromDisk, removeFromDisk } from "../utils/recordings/removeFromDisk";
-import { selectRecordings } from "../utils/recordings/selectRecordings";
-import { LocalRecording } from "../utils/recordings/types";
-import { dim } from "../utils/theme";
 
 registerCommand("remove")
   .argument("[ids...]", `Recording ids ${dim("(comma-separated)")}`, value => value.split(","))

diff --git a/packages/replayio/src/commands/update.ts b/packages/replayio/src/commands/update.ts
@@ -1,10 +1,10 @@
+import { exitProcess } from "@replay-cli/shared/process/exitProcess";
+import { statusSuccess } from "@replay-cli/shared/theme";
 import { registerCommand } from "../utils/commander/registerCommand";
-import { exitProcess } from "../utils/exitProcess";
 import { checkForNpmUpdate } from "../utils/initialization/checkForNpmUpdate";
 import { checkForRuntimeUpdate } from "../utils/initialization/checkForRuntimeUpdate";
 import { promptForNpmUpdate } from "../utils/initialization/promptForNpmUpdate";
 import { installLatestRelease } from "../utils/installation/installLatestRelease";
-import { statusSuccess } from "../utils/theme";
 
 registerCommand("update", {
   checkForRuntimeUpdate: false,

diff --git a/packages/replayio/src/commands/upload-source-maps.ts b/packages/replayio/src/commands/upload-source-maps.ts
@@ -1,10 +1,10 @@
+import { getAccessToken } from "@replay-cli/shared/authentication/getAccessToken";
+import { exitProcess } from "@replay-cli/shared/process/exitProcess";
+import { dim } from "@replay-cli/shared/theme";
 import { uploadSourceMaps as uploadSourceMapsExternal } from "@replayio/sourcemap-upload";
 import { replayApiServer } from "../config";
-import { getAccessToken } from "../utils/authentication/getAccessToken";
-import { registerCommand } from "../utils/commander/registerCommand";
-import { exitProcess } from "../utils/exitProcess";
-import { dim } from "../utils/theme";
 import { logPromise } from "../utils/async/logPromise";
+import { registerCommand } from "../utils/commander/registerCommand";
 
 registerCommand("upload-source-maps <paths...>", { requireAuthentication: true })
   .description("Upload source-maps for a Workspace")

diff --git a/packages/replayio/src/commands/upload.ts b/packages/replayio/src/commands/upload.ts
@@ -1,13 +1,12 @@
+import { exitProcess } from "@replay-cli/shared/process/exitProcess";
 import { registerCommand } from "../utils/commander/registerCommand";
-import { exitProcess } from "../utils/exitProcess";
-import { canUpload } from "../utils/recordings/canUpload";
-import { findRecordingsWithShortIds } from "../utils/recordings/findRecordingsWithShortIds";
-import { getRecordings } from "../utils/recordings/getRecordings";
-import { printRecordings } from "../utils/recordings/printRecordings";
-import { selectRecordings } from "../utils/recordings/selectRecordings";
-import { LocalRecording } from "../utils/recordings/types";
-import { uploadRecordings } from "../utils/recordings/upload/uploadRecordings";
-import { dim } from "../utils/theme";
+import { findRecordingsWithShortIds } from "@replay-cli/shared/recording/findRecordingsWithShortIds";
+import { getRecordings } from "@replay-cli/shared/recording/getRecordings";
+import { printRecordings } from "@replay-cli/shared/recording/printRecordings";
+import { selectRecordings } from "@replay-cli/shared/recording/selectRecordings";
+import { LocalRecording } from "@replay-cli/shared/recording/types";
+import { uploadRecordings } from "@replay-cli/shared/recording/upload/uploadRecordings";
+import { dim } from "@replay-cli/shared/theme";
 
 registerCommand("upload", { requireAuthentication: true })
   .argument("[ids...]", `Recording ids ${dim("(comma-separated)")}`, value => value.split(","))

diff --git a/packages/replayio/src/config.ts b/packages/replayio/src/config.ts
@@ -1,3 +1,4 @@
+// TODO [PRO-720] Remove these in favor of values exported by "shared"
 export const replayApiServer = process.env.REPLAY_API_SERVER || "https://api.replay.io";
 export const replayAppHost = process.env.REPLAY_APP_SERVER || "https://app.replay.io";
 export const replayWsServer =

diff --git a/packages/replayio/src/utils/async/logAsyncOperation.ts b/packages/replayio/src/utils/async/logAsyncOperation.ts
@@ -4,10 +4,10 @@ import {
   STATUS_RESOLVED,
   Status,
 } from "@replay-cli/shared/async/createDeferred";
+import { statusFailed, statusPending, statusSuccess } from "@replay-cli/shared/theme";
 import { dots } from "cli-spinners";
+import { logUpdate } from "../../../../shared/src/logUpdate";
 import { disableAnimatedLog } from "../../config";
-import { logUpdate } from "../logUpdate";
-import { statusFailed, statusPending, statusSuccess } from "../theme";
 
 export type LogProgressOptions = { delayBeforeLoggingMs?: number };
 
@@ -21,7 +21,7 @@ export function logAsyncOperation(
   let displayedMessage = initialMessage;
 
   const print = () => {
-    let prefix: string;
+    let prefix: string = "";
     switch (status) {
       case STATUS_PENDING:
         if (!disableAnimatedLog && delayBeforeLoggingMs > 0 && Date.now() < logAfter) {

diff --git a/packages/replayio/src/utils/authentication/debug.ts b/packages/replayio/src/utils/authentication/debug.ts
diff --git a/packages/replayio/src/utils/browser/debug.ts b/packages/replayio/src/utils/browser/debug.ts
diff --git a/packages/replayio/src/utils/browser/getRunningProcess.ts b/packages/replayio/src/utils/browser/getRunningProcess.ts
@@ -1,6 +1,6 @@
+import { logger } from "@replay-cli/shared/logger";
+import { highlight } from "@replay-cli/shared/theme";
 import findProcess from "find-process";
-import { highlight } from "../theme";
-import { debug } from "./debug";
 import { getBrowserPath } from "./getBrowserPath";
 
 export async function getRunningProcess() {
@@ -10,7 +10,7 @@ export async function getRunningProcess() {
   if (processes.length > 0) {
     const match = processes[0];
 
-    debug(`Browser process already running at ${highlight(match.pid)}`);
+    logger.debug(`Browser process already running at ${highlight(match.pid)}`);
 
     return match;
   }

diff --git a/packages/replayio/src/utils/browser/killBrowserIfRunning.ts b/packages/replayio/src/utils/browser/killBrowserIfRunning.ts
@@ -1,6 +1,6 @@
+import { exitProcess } from "@replay-cli/shared/process/exitProcess";
+import { killProcess } from "@replay-cli/shared/process/killProcess";
 import { confirm } from "../confirm";
-import { exitProcess } from "../exitProcess";
-import { killProcess } from "../killProcess";
 import { getRunningProcess } from "./getRunningProcess";
 
 export async function killBrowserIfRunning() {

diff --git a/packages/replayio/src/utils/browser/launchBrowser.ts b/packages/replayio/src/utils/browser/launchBrowser.ts
@@ -1,11 +1,11 @@
+import { getReplayPath } from "@replay-cli/shared/getReplayPath";
+import { logger } from "@replay-cli/shared/logger";
+import { dim, stderrPrefix, stdoutPrefix } from "@replay-cli/shared/theme";
 import { ensureDirSync, existsSync } from "fs-extra";
 import { join } from "path";
-import { getReplayPath } from "@replay-cli/shared/getReplayPath";
+import { spawnProcess } from "../../../../shared/src/spawnProcess";
 import { runtimeMetadata, runtimePath } from "../installation/config";
 import { prompt } from "../prompt/prompt";
-import { spawnProcess } from "../spawnProcess";
-import { dim, stderrPrefix, stdoutPrefix } from "../theme";
-import { debug } from "./debug";
 import { getBrowserPath } from "./getBrowserPath";
 
 export async function launchBrowser(
@@ -39,16 +39,11 @@ export async function launchBrowser(
   };
 
   if (!existsSync(browserExecutablePath)) {
-    debug(`Replay browser not found at: ${browserExecutablePath}`);
+    logger.debug(`Replay browser not found at: ${browserExecutablePath}`);
     throw new Error(`Replay browser not found at: ${browserExecutablePath}`);
   }
 
-  debug(
-    `Launching browser: ${browserExecutablePath} with args:\n`,
-    args.join("\n"),
-    "\n",
-    processOptions
-  );
+  logger.debug("Launching browser", { args, browserExecutablePath, processOptions });
 
   // Wait until the user quits the browser process OR
   // until the user presses a key to continue (in which case, we will kill the process)
@@ -80,10 +75,10 @@ export async function launchBrowser(
       }
     },
     printStderr: (text: string) => {
-      debug(stderrPrefix("stderr"), text);
+      logger.debug(`${stderrPrefix("stderr")} ${text}`);
     },
     printStdout: (text: string) => {
-      debug(stdoutPrefix("stdout"), text);
+      logger.debug(`${stdoutPrefix("stdout")} ${text}`);
     },
   });