speed up the installation of dependencies

package.json

@@ -10,7 +10,7 @@
   "scripts": {
     "build": "tsc --build && npm run copy-static && npm run build-bundles",
     "copy-static": "copyfiles 'src/browser/client-scripts/*' build",
-    "build-node-bundle": "esbuild ./src/bundle/index.ts --outdir=./build/src/bundle --bundle --format=cjs --platform=node --target=ES2021",
+    "build-node-bundle": "esbuild ./src/bundle/cjs/index.ts --outdir=./build/src/bundle/cjs --bundle --format=cjs --platform=node --target=ES2021",
     "build-browser-bundle": "node ./src/browser/client-scripts/build.js",
     "build-bundles": "concurrently -c 'auto' 'npm:build-browser-bundle' 'npm:build-node-bundle --minify'",
     "check-types": "tsc --project tsconfig.spec.json",
@@ -55,14 +55,9 @@
     "@gemini-testing/commander": "2.15.4",
     "@jspm/core": "2.0.1",
     "@puppeteer/browsers": "2.4.0",
-    "@types/debug": "4.1.12",
-    "@types/yallist": "4.0.4",
     "@vitest/spy": "2.1.4",
-    "@wdio/globals": "8.39.0",
     "@wdio/protocols": "8.38.0",
-    "@wdio/types": "8.39.0",
     "@wdio/utils": "8.39.0",
-    "@wdio/utils-cjs": "npm:@wdio/[email protected]",
     "bluebird": "3.5.1",
     "chalk": "2.4.2",
     "clear-require": "1.0.1",
@@ -78,7 +73,6 @@
     "geckodriver": "4.5.0",
     "gemini-configparser": "1.4.1",
     "get-port": "5.1.1",
-    "glob-extra": "5.0.2",
     "import-meta-resolve": "4.0.0",
     "local-pkg": "0.4.3",
     "lodash": "4.17.21",
@@ -116,7 +110,7 @@
     "@commitlint/config-conventional": "^19.0.3",
     "@cspotcode/source-map-support": "0.8.0",
     "@sinonjs/fake-timers": "10.3.0",
-    "@swc/core": "1.3.40",
+    "@swc/core": "1.9.2",
     "@types/babel__code-frame": "7.0.6",
     "@types/babel__core": "7.20.5",
     "@types/bluebird": "3.5.38",
@@ -125,6 +119,7 @@
     "@types/chai-as-promised": "7.1.5",
     "@types/clear-require": "3.2.1",
     "@types/cli-progress": "3.11.6",
+    "@types/debug": "4.1.12",
     "@types/escape-string-regexp": "2.0.1",
     "@types/fs-extra": "11.0.4",
     "@types/lodash": "4.14.191",
@@ -137,8 +132,11 @@
     "@types/sinonjs__fake-timers": "8.1.2",
     "@types/urijs": "1.19.25",
     "@types/url-join": "4.0.3",
+    "@types/yallist": "4.0.4",
     "@typescript-eslint/eslint-plugin": "6.12.0",
     "@typescript-eslint/parser": "6.12.0",
+    "@wdio/types": "8.39.0",
+    "@wdio/utils-cjs": "npm:@wdio/[email protected]",
     "aliasify": "1.9.0",
     "app-module-path": "2.2.0",
     "browserify": "13.3.0",
@@ -151,6 +149,7 @@
     "eslint": "8.25.0",
     "eslint-config-gemini-testing": "2.8.0",
     "eslint-config-prettier": "8.7.0",
+    "glob-extra": "5.0.2",
     "husky": "0.11.4",
     "jsdom": "^24.0.0",
     "jsdom-global": "3.0.2",

src/browser/browser.ts

@@ -1,7 +1,5 @@
 import crypto from "crypto";
 import { RequestOptions } from "https";
-
-import { RemoteCapability } from "@wdio/types/build/Capabilities";
 import _ from "lodash";
 
 import { SAVE_HISTORY_MODE } from "../constants/config";
@@ -16,6 +14,8 @@ import { BrowserConfig } from "../config/browser-config";
 import Callstack from "./history/callstack";
 import type { WdProcess, WebdriverPool } from "../browser-pool/webdriver-pool";
 
+import type { Capabilities } from "@wdio/types";
+
 const CUSTOM_SESSION_OPTS = [
     "outputDir",
     "agent",
@@ -184,7 +184,7 @@ export class Browser {
         return this._state;
     }
 
-    get capabilities(): RemoteCapability {
+    get capabilities(): Capabilities.RemoteCapability {
         return this.publicAPI.capabilities;
     }
 

src/browser/existing-browser.js

@@ -5,7 +5,7 @@ const url = require("url");
 const Promise = require("bluebird");
 const _ = require("lodash");
 const webdriverio = require("webdriverio");
-const { sessionEnvironmentDetector } = require("@wdio/utils-cjs");
+const { sessionEnvironmentDetector } = require("../bundle/@wdio-utils");
 const { Browser } = require("./browser");
 const commandsList = require("./commands");
 const Camera = require("./camera");

src/bundle/@wdio-utils.ts

@@ -0,0 +1,5 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+const bundle = require("./cjs");
+
+export const sessionEnvironmentDetector: typeof import("@wdio/utils-cjs").sessionEnvironmentDetector =
+    bundle.wdioUtils.sessionEnvironmentDetector;

src/bundle/cjs/index.ts

@@ -0,0 +1,3 @@
+export * from "./test-transformer";
+export * from "./vendors/@wdio/utils-cjs";
+export * from "./vendors/glob-extra";

src/bundle/cjs/test-transformer.ts

@@ -0,0 +1,193 @@
+import * as nodePath from "node:path";
+import * as babel from "@babel/core";
+import { addHook } from "pirates";
+import { requireModuleSync } from "../../utils/module";
+
+import type { NodePath, PluginObj, TransformOptions } from "@babel/core";
+
+const STYLE_EXTESTION_RE = /\.(css|less|scss|sass|styl|stylus|pcss)$/;
+const IGNORE_STYLE_ERRORS = ["Unexpected token"];
+
+export const TRANSFORM_EXTENSIONS = [".jsx", ".cjsx", ".mjsx", ".tsx", ".ctsx", ".mtsx"];
+export const JS_EXTENSION_RE = /^\.([cm]?[tj]sx?|json)$/;
+
+export const setupTransformHook = (opts: { removeNonJsImports?: boolean } = {}): VoidFunction => {
+    const transformOptions: TransformOptions = {
+        browserslistConfigFile: false,
+        babelrc: false,
+        configFile: false,
+        compact: false,
+        presets: [require("@babel/preset-typescript")],
+        sourceMaps: "inline",
+        plugins: [
+            [
+                require("@babel/plugin-transform-react-jsx"),
+                {
+                    throwIfNamespace: false,
+                    runtime: "automatic",
+                },
+            ],
+            require("@babel/plugin-transform-modules-commonjs"),
+        ],
+    };
+
+    const customIgnoreImportsPlugin = ({ types: t }: { types: typeof babel.types }): PluginObj => ({
+        name: "ignore-imports",
+        visitor: {
+            ImportDeclaration(path: NodePath<babel.types.ImportDeclaration>): void {
+                const extname = nodePath.extname(path.node.source.value);
+
+                if (extname && !extname.match(JS_EXTENSION_RE)) {
+                    path.remove();
+                    return;
+                }
+
+                try {
+                    requireModuleSync(path.node.source.value);
+                } catch (err) {
+                    if (shouldIgnoreImportError(err as Error)) {
+                        path.remove();
+                        return;
+                    }
+
+                    if ((err as NodeJS.ErrnoException).code === "ERR_REQUIRE_ESM") {
+                        mockEsmModuleImport(t, path);
+                        return;
+                    }
+                }
+            },
+        },
+    });
+
+    if (opts.removeNonJsImports) {
+        transformOptions.plugins!.push([customIgnoreImportsPlugin]);
+    }
+
+    const revertTransformHook = addHook(
+        (originalCode, filename) => {
+            return babel.transform(originalCode, { filename, ...transformOptions })!.code as string;
+        },
+        { exts: TRANSFORM_EXTENSIONS },
+    );
+
+    return revertTransformHook;
+};
+
+function shouldIgnoreImportError(err: Error): boolean {
+    const shouldIgnoreImport = IGNORE_STYLE_ERRORS.some(ignoreImportErr => {
+        return (err as Error).message.startsWith(ignoreImportErr);
+    });
+
+    if (!shouldIgnoreImport) {
+        return false;
+    }
+
+    const firstStackFrame = (err as Error).stack?.split("\n")[0] || "";
+    const filePath = firstStackFrame.split(":")[0];
+    const isStyleFilePath = STYLE_EXTESTION_RE.test(filePath);
+
+    return isStyleFilePath;
+}
+
+/**
+ * Replace esm module import with a Proxy.
+ * Examples:
+ * 1) `import pkg from "package"` -> `const pkg = new Proxy({}, {get: ..., apply: ...})`
+ * 2) `import {a, b as c} from "package"` -> `const {a, c} = new Proxy({}, {get: ..., apply: ...})`
+ */
+function mockEsmModuleImport(t: typeof babel.types, path: NodePath<babel.types.ImportDeclaration>): void {
+    const variableKey = genVarDeclKey(t, path.node);
+    const variableValue = genProxy(t, [
+        t.objectExpression([]),
+        t.objectExpression([genProxyGetHandler(t), genProxyApplyHandler(t)]),
+    ]);
+
+    const variableDecl = t.variableDeclaration("const", [t.variableDeclarator(variableKey, variableValue)]);
+
+    path.replaceWith(variableDecl);
+}
+
+/**
+ * Generates the name of variables from the import declaration.
+ * Examples:
+ * 1) `import pkg from "package"` -> `pkg`
+ * 2) `import {a, b as c} from "package"` -> `const {a, с} `
+ */
+function genVarDeclKey(
+    t: typeof babel.types,
+    node: NodePath<babel.types.ImportDeclaration>["node"],
+): babel.types.Identifier | babel.types.ObjectPattern {
+    if (node.specifiers.length === 1) {
+        if (["ImportDefaultSpecifier", "ImportNamespaceSpecifier"].includes(node.specifiers[0].type)) {
+            return t.identifier(node.specifiers[0].local.name);
+        }
+
+        return t.objectPattern([
+            t.objectProperty(
+                t.identifier(node.specifiers[0].local.name),
+                t.identifier(node.specifiers[0].local.name),
+                false,
+                true,
+            ),
+        ]);
+    }
+
+    const objectProperties = node.specifiers.map(spec => {
+        return t.objectProperty(t.identifier(spec.local.name), t.identifier(spec.local.name), false, true);
+    });
+
+    return t.objectPattern(objectProperties);
+}
+
+// Generates Proxy expression with passed arguments: `new Proxy(args)`
+function genProxy(t: typeof babel.types, args: babel.types.Expression[]): babel.types.NewExpression {
+    return t.newExpression(t.identifier("Proxy"), args);
+}
+
+/**
+ * Generates "get" handler for Proxy:
+ *
+ * get: function (target, prop) {
+ *   return prop in target ? target[prop] : new Proxy(() => {}, this);
+ * }
+ */
+function genProxyGetHandler(t: typeof babel.types): babel.types.ObjectProperty {
+    return t.objectProperty(
+        t.identifier("get"),
+        t.functionExpression(
+            null,
+            [t.identifier("target"), t.identifier("prop")],
+            t.blockStatement([
+                t.returnStatement(
+                    t.conditionalExpression(
+                        t.binaryExpression("in", t.identifier("prop"), t.identifier("target")),
+                        t.memberExpression(t.identifier("target"), t.identifier("prop"), true),
+                        genProxy(t, [t.arrowFunctionExpression([], t.blockStatement([])), t.thisExpression()]),
+                    ),
+                ),
+            ]),
+        ),
+    );
+}
+
+/**
+ * Generates "apply" handler for Proxy:
+ *
+ * apply: function () {
+ *   return new Proxy(() => {}, this);
+ * }
+ */
+function genProxyApplyHandler(t: typeof babel.types): babel.types.ObjectProperty {
+    return t.objectProperty(
+        t.identifier("apply"),
+        t.functionExpression(
+            null,
+            [],
+            t.blockStatement([
+                t.returnStatement(
+                    genProxy(t, [t.arrowFunctionExpression([], t.blockStatement([])), t.thisExpression()]),
+                ),
+            ]),
+        ),
+    );
+}

src/bundle/cjs/vendors/@wdio/utils-cjs.ts

@@ -0,0 +1,2 @@
+import * as wdioUtilsFns from "@wdio/utils-cjs";
+export const wdioUtils = wdioUtilsFns;

src/bundle/cjs/vendors/glob-extra.ts

@@ -0,0 +1,2 @@
+import * as globExtraFns from "glob-extra";
+export const globExtra = globExtraFns;

src/bundle/glob-extra.ts

@@ -0,0 +1,6 @@
+/* eslint-disable @typescript-eslint/no-var-requires */
+const bundle = require("./cjs");
+
+export const expandPaths: typeof import("glob-extra").expandPaths = bundle.globExtra.expandPaths;
+export const isMask: typeof import("glob-extra").isMask = bundle.globExtra.isMask;
+export type { GlobOpts, ExpandOpts } from "glob-extra";