@dev-blinq/cucumber_client 1.0.1312-dev → 1.0.1313-dev

package/bin/assets/scripts/unique_locators.js

@@ -34,6 +34,11 @@ function cssEscapeCharacter(s, i) {
 		return s.charAt(i);
 	return "\\" + s.charAt(i);
 }
+function escapeRegexForSelector(re) {
+	if (re.unicode || re.unicodeSets)
+		return String(re);
+	return String(re).replace(/(^|[^\\])(\\\\)*(["'`])/g, "$1$2\\$3").replace(/>>/g, "\\>\\>");
+}
 class LocatorGenerator {
 	constructor(injectedScript, options = {}) {
 		this.locatorStrategies = {
@@ -356,8 +361,9 @@ class LocatorGenerator {
 					hasDigitsInText = digitsRegex.test(text);
 
 					let pattern = this.PW.stringUtils.escapeRegExp(text.substring(1, text.length - 2));
-					pattern = pattern.replace(digitsRegex, "\\d+");
-					finalSelector += `internal:text=/${pattern}/ >> `;
+					const re = new RegExp("^" + pattern + "$");
+
+					finalSelector += `internal:text=${escapeRegexForSelector(re)} >> `;
 				}
 				if (!hasDigitsInText) {
 					continue;

package/bin/client/code_gen/playwright_codeget.js

@@ -674,6 +674,22 @@ const _generateCodeFromCommand = (step, elements, userData) => {
   return { codeLines, elements: elementsChanged ? elements : null, elementIdentifier, allStrategyLocators };
 };
 
+/**
+ * Generates a report command based on the given position.
+ * @param {"start"|"end"} position
+ */
+const generateReportCommand = (position, cmdId) => {
+  const codeLines = [];
+  if (position === "start") {
+    const line = `await context.web.addCommandToReport("${cmdId}", "PASSED", '{"status":"start","cmdId":"${cmdId}"}', {type:"cmdReport"},this);`;
+    codeLines.push(line);
+  } else if (position === "end") {
+    const line = `await context.web.addCommandToReport("${cmdId}", "PASSED", '{"status":"end","cmdId":"${cmdId}"}', {type:"cmdReport"},this);`;
+    codeLines.push(line);
+  }
+  return codeLines;
+};
+
 const generateCode = (recording, codePage, userData, projectDir, methodName) => {
   const stepsDefinitions = new StepsDefinitions(projectDir);
   stepsDefinitions.load(false);
@@ -714,12 +730,15 @@ const generateCode = (recording, codePage, userData, projectDir, methodName) =>
     if (recordingStep.type === Types.COMPLETE) {
       return;
     }
-    // if (!recordingStep.element) {
-    //   logger.info(`Step ${recordingStep.type} doesn't have an element, ignoring`);
-    //   return;
-    // }
+
+    if (process.env.TEMP_RUN === "true") {
+      codeLines.push(...generateReportCommand("start", recordingStep.cmdId));
+    }
     const result = _generateCodeFromCommand(recordingStep, elements, userData);
     codeLines.push(...result.codeLines);
+    if (process.env.TEMP_RUN === "true") {
+      codeLines.push(...generateReportCommand("end", recordingStep.cmdId));
+    }
     if (result.elements) {
       elements = result.elements;
     }

package/bin/client/recorderv3/bvt_recorder.js

@@ -1,6 +1,6 @@
 // define the jsdoc type for the input
 import { closeContext, initContext, _getDataFile, resetTestData } from "automation_model";
-import { existsSync, readdirSync, readFileSync, rmSync } from "fs";
+import { existsSync, mkdir, mkdirSync, readdirSync, readFileSync, rmSync } from "fs";
 import path from "path";
 import url from "url";
 import { getImplementedSteps, getStepsAndCommandsForScenario } from "./implemented_steps.js";
@@ -15,6 +15,7 @@ import chokidar from "chokidar";
 import logger from "../../logger.js";
 import { unEscapeNonPrintables } from "../cucumber/utils.js";
 import { findAvailablePort } from "../utils/index.js";
+import NetworkMonitor from "./network.js";
 
 const __dirname = path.dirname(url.fileURLToPath(import.meta.url));
 
@@ -185,12 +186,33 @@ export class BVTRecorder {
     });
     this.stepRunner = new BVTStepRunner({
       projectDir: this.projectDir,
+      sendExecutionStatus: (data) => {
+        if (data && data.type) {
+          switch (data.type) {
+            case "cmdExecutionStart":
+              console.log("Sending cmdExecutionStart event for cmdId:", data.cmdId);
+              this.sendEvent(this.events.cmdExecutionStart, data.cmdId);
+              break;
+            case "cmdExecutionSuccess":
+              console.log("Sending cmdExecutionSuccess event for cmdId:", data.cmdId);
+              this.sendEvent(this.events.cmdExecutionSuccess, data.cmdId);
+              break;
+            case "cmdExecutionFailure":
+              console.log("Sending cmdExecutionFailure event for cmdId:", data.cmdId);
+              this.sendEvent(this.events.cmdExecutionFailure, data.cmdId);
+              break;
+            default:
+              console.warn("Unknown command execution status type:", data.type);
+              break;
+          }
+        }
+      },
     });
     this.pageSet = new Set();
-
+    this.networkMonitor = new NetworkMonitor();
     this.lastKnownUrlPath = "";
     // TODO: what is world?
-    this.world = { attach: () => { } };
+    this.world = { attach: () => {} };
     this.shouldTakeScreenshot = true;
     this.watcher = null;
   }
@@ -203,6 +225,9 @@ export class BVTRecorder {
     onStepDetails: "BVTRecorder.onStepDetails",
     getTestData: "BVTRecorder.getTestData",
     onGoto: "BVTRecorder.onGoto",
+    cmdExecutionStart: "BVTRecorder.cmdExecutionStart",
+    cmdExecutionSuccess: "BVTRecorder.cmdExecutionSuccess",
+    cmdExecutionFailure: "BVTRecorder.cmdExecutionFailure",
   };
   bindings = {
     __bvt_recordCommand: async ({ frame, page, context }, event) => {
@@ -294,7 +319,7 @@ export class BVTRecorder {
     process.env.CDP_LISTEN_PORT = this.#remoteDebuggerPort;
 
     this.stepRunner.setRemoteDebugPort(this.#remoteDebuggerPort);
-    this.world = { attach: () => { } };
+    this.world = { attach: () => {} };
 
     const ai_config_file = path.join(this.projectDir, "ai_config.json");
     let ai_config = {};
@@ -700,7 +725,7 @@ export class BVTRecorder {
   }
   async closeBrowser() {
     delete process.env.TEMP_RUN;
-    await this.watcher.close().then(() => { });
+    await this.watcher.close().then(() => {});
     this.watcher = null;
     this.previousIndex = null;
     this.previousHistoryLength = null;
@@ -789,30 +814,34 @@ export class BVTRecorder {
     }, 100);
     this.timerId = timerId;
   }
-  async runStep({ step, parametersMap, tags, isFirstStep }, options) {
+  async runStep({ step, parametersMap, tags, isFirstStep, listenNetwork }, options) {
     const _env = {
       TOKEN: this.TOKEN,
       TEMP_RUN: true,
       REPORT_FOLDER: this.bvtContext.reportFolder,
       BLINQ_ENV: this.envName,
+      STORE_DETAILED_NETWORK_DATA: listenNetwork ? "true" : "false",
+      CURRENT_STEP_ID: step.id,
     };
 
     this.bvtContext.navigate = true;
     for (const [key, value] of Object.entries(_env)) {
       process.env[key] = value;
     }
+
     if (this.timerId) {
       clearTimeout(this.timerId);
       this.timerId = null;
     }
     await this.setMode("running");
+
     try {
       const { result, info } = await this.stepRunner.runStep(
         {
           step,
           parametersMap,
           envPath: this.envName,
-          tags
+          tags,
         },
         this.bvtContext,
         options ? { ...options, skipBefore: !isFirstStep } : { skipBefore: !isFirstStep }

package/bin/client/recorderv3/index.js

@@ -51,6 +51,37 @@ class PromisifiedSocketServer {
   }
 }
 
+function memorySizeOf(obj) {
+  var bytes = 0;
+
+  function sizeOf(obj) {
+    if (obj !== null && obj !== undefined) {
+      switch (typeof obj) {
+        case "number":
+          bytes += 8;
+          break;
+        case "string":
+          bytes += obj.length * 2;
+          break;
+        case "boolean":
+          bytes += 4;
+          break;
+        case "object":
+          var objClass = Object.prototype.toString.call(obj).slice(8, -1);
+          if (objClass === "Object" || objClass === "Array") {
+            for (var key in obj) {
+              if (!obj.hasOwnProperty(key)) continue;
+              sizeOf(obj[key]);
+            }
+          } else bytes += obj.toString().length * 2;
+          break;
+      }
+    }
+    return bytes;
+  }
+  return sizeOf(obj);
+}
+
 const init = ({ envName, projectDir, roomId, TOKEN }) => {
   console.log("connecting to " + WS_URL);
   const socket = io(WS_URL);
@@ -66,8 +97,10 @@ const init = ({ envName, projectDir, roomId, TOKEN }) => {
     projectDir,
     TOKEN,
     sendEvent: (event, data) => {
+      console.log("Size of data", memorySizeOf(data), "bytes");
       console.log("----", event, data, "roomId", roomId);
       socket.emit(event, data, roomId);
+      console.log("Successfully sent event", event, "to room", roomId);
     },
   });
   recorder
@@ -77,7 +110,7 @@ const init = ({ envName, projectDir, roomId, TOKEN }) => {
       socket.emit("BVTRecorder.browserOpened", null, roomId);
     })
     .catch((e) => {
-      socket.emit("BVTRecorder.browserLaunchFailed", null, roomId);
+      socket.emit("BVTRecorder.browserLaunchFailed", e, roomId);
     });
   const timeOutForFunction = async (promise, timeout = 5000) => {
     const timeoutPromise = new Promise((resolve) => setTimeout(() => resolve(), timeout));
@@ -239,6 +272,9 @@ const init = ({ envName, projectDir, roomId, TOKEN }) => {
     "recorderWindow.getStepsAndCommandsForScenario": async (input) => {
       return await recorder.getStepsAndCommandsForScenario(input);
     },
+    "recorderWindow.getNetworkEvents": async (input) => {
+      return await recorder.getNetworkEvents(input);
+    },
   });
   socket.on("targetBrowser.command.event", async (input) => {
     return recorder.onAction(input);

package/bin/client/recorderv3/network.js

@@ -0,0 +1,299 @@
+/**
+ * @typedef {Object} NetworkEvent
+ * @property {import('playwright').Request} request
+ * @property {import('playwright').Response|null} response
+ * @property {string} id
+ * @property {number} timestamp
+ * @property {string} status - 'completed', 'failed'
+ */
+
+class NetworkMonitor {
+  constructor() {
+    this.networkId = 0;
+    /** @type {Map<string, NetworkEvent>} */
+    this.requestIdMap = new Map();
+    this.networkEvents = new Map();
+    /** @type {Map<import('playwright').Page, {responseListener: Function, requestFailedListener: Function}>} */
+    this.pageListeners = new Map();
+  }
+
+  /**
+   * Add network event listeners to a page
+   * @param {import('playwright').Page} page
+   */
+  addNetworkEventListener(page) {
+    // Create the listener functions
+    const responseListener = async (response) => {
+      const request = response.request();
+      let eventId = this.requestIdMap.get(request);
+
+      if (!eventId) {
+        this.networkId++;
+        eventId = this.networkId.toString();
+        this.requestIdMap.set(request, eventId);
+      }
+
+      const networkEvent = {
+        id: eventId,
+        request,
+        response,
+        timestamp: Date.now(),
+        status: "completed",
+      };
+
+      this.networkEvents.set(eventId, networkEvent);
+    };
+
+    const requestFailedListener = (request) => {
+      let eventId = this.requestIdMap.get(request);
+
+      if (!eventId) {
+        this.networkId++;
+        eventId = this.networkId.toString();
+        this.requestIdMap.set(request, eventId);
+      }
+
+      const networkEvent = {
+        id: eventId,
+        request,
+        response: null,
+        timestamp: Date.now(),
+        status: "failed",
+      };
+
+      this.networkEvents.set(eventId, networkEvent);
+    };
+    // Store the listeners for later removal
+    this.pageListeners.set(page, {
+      responseListener,
+      requestFailedListener,
+    });
+
+    // Add the listeners to the page
+    page.on("response", responseListener);
+    page.on("requestfailed", requestFailedListener);
+  }
+
+  /**
+   * Remove network event listeners from a specific page
+   * @param {import('playwright').Page} page
+   */
+  removeNetworkEventListener(page) {
+    const listeners = this.pageListeners.get(page);
+    if (listeners) {
+      page.off("response", listeners.responseListener);
+      page.off("requestfailed", listeners.requestFailedListener);
+      this.pageListeners.delete(page);
+      console.log("Network event listeners removed from page");
+    }
+  }
+
+  /**
+   * Remove network event listeners from all pages
+   */
+  removeAllNetworkEventListeners() {
+    for (const [page, listeners] of this.pageListeners) {
+      page.off("response", listeners.responseListener);
+      page.off("requestfailed", listeners.requestFailedListener);
+    }
+    this.pageListeners.clear();
+    console.log("All network event listeners removed");
+  }
+
+  /**
+   * Check if a page has active listeners
+   * @param {import('playwright').Page} page
+   * @returns {boolean}
+   */
+  hasListeners(page) {
+    return this.pageListeners.has(page);
+  }
+
+  /**
+   * Get the number of pages with active listeners
+   * @returns {number}
+   */
+  getActiveListenersCount() {
+    return this.pageListeners.size;
+  }
+
+  /**
+   * Get all network events until now
+   */
+  getAllNetworkEvents() {
+    return Array.from(this.networkEvents.values());
+  }
+
+  /**
+   * Get network events within a range
+   * @param {number} startId
+   * @param {number} endId
+   * @returns {NetworkEvent[]}
+   */
+  getNetworkEventsInRange(startId, endId) {
+    const events = [];
+    for (let i = startId; i <= endId; i++) {
+      const event = this.networkEvents.get(i.toString());
+      if (event) {
+        events.push(event);
+      }
+    }
+    return events;
+  }
+
+  /**
+   * Get network events since a specific ID
+   * @param {number} sinceId
+   * @returns {NetworkEvent[]}
+   */
+  getNetworkEventsSince(sinceId) {
+    return this.getNetworkEventsInRange(sinceId + 1, this.networkId);
+  }
+
+  /**
+   * Get events by status
+   * @param {string} status - 'completed', 'failed'
+   * @returns {NetworkEvent[]}
+   */
+  getEventsByStatus(status) {
+    return Array.from(this.networkEvents.values()).filter((event) => event.status === status);
+  }
+
+  /**
+   * Get current network ID (latest)
+   * @returns {number}
+   */
+  getCurrentNetworkId() {
+    return this.networkId;
+  }
+
+  getCurrentNetworkEventsLength() {
+    return this.networkEvents.size;
+  }
+
+  /**
+   * Get statistics about stored events
+   * @returns {Object}
+   */
+  getStats() {
+    const events = Array.from(this.networkEvents.values());
+    return {
+      total: events.length,
+      completed: events.filter((e) => e.status === "completed").length,
+      failed: events.filter((e) => e.status === "failed").length,
+      oldestTimestamp: events.length > 0 ? Math.min(...events.map((e) => e.timestamp)) : null,
+      newestTimestamp: events.length > 0 ? Math.max(...events.map((e) => e.timestamp)) : null,
+    };
+  }
+
+  /**
+   * Marshall network event for serialization
+   * @param {NetworkEvent} networkEvent
+   * @returns {Promise<Object>}
+   */
+  async marshallNetworkEvent(networkEvent) {
+    const { request, response } = networkEvent;
+
+    try {
+      const url = new URL(request.url());
+      const marshalledEvent = {
+        id: networkEvent.id,
+        timestamp: networkEvent.timestamp,
+        status: networkEvent.status,
+        url: url.href,
+        method: request.method(),
+        statusCode: response?.status() ?? null,
+        statusText: response?.statusText() ?? null,
+        queryParams: Object.fromEntries(url.searchParams.entries()),
+      };
+
+      // Try to get response body safely (only for successful responses)
+      if (response && networkEvent.status === "completed") {
+        try {
+          const isBinary =
+            !response.headers()["content-type"]?.includes("application/json") &&
+            !response.headers()["content-type"]?.includes("text");
+          let body;
+          if (isBinary) {
+            body = await response.body();
+          } else {
+            body = await response.text();
+          }
+          let json;
+          try {
+            if (typeof body === "string") {
+              json = JSON.parse(body); // Check if body is valid JSON
+            }
+          } catch (_) {
+            //Ignore
+          }
+          const responseBody = isBinary ? body : json ? JSON.stringify(json) : body;
+          marshalledEvent.contentType = isBinary ? "binary" : json ? "json" : "text";
+          marshalledEvent.responseBody = responseBody;
+        } catch (error) {
+          marshalledEvent.responseBody = `[Error reading response: ${error.message}]`;
+        }
+      } else if (networkEvent.status === "failed") {
+        marshalledEvent.failureReason = request.failure()?.errorText || "Unknown error";
+      }
+
+      console.log("Marshalled network event:", marshalledEvent);
+
+      return marshalledEvent;
+    } catch (error) {
+      console.error("Error marshalling network event:", error);
+      return {
+        id: networkEvent.id,
+        timestamp: networkEvent.timestamp,
+        status: networkEvent.status,
+        url: request.url(),
+        method: request.method(),
+        error: error.message,
+      };
+    }
+  }
+
+  /**
+   *@returns {Promise<Object[]>}
+   * Get all marshalled network events
+   * This is useful for sending to the server or saving to a file.
+   *   */
+  async getAllMarshalledNetworkEvents() {
+    const events = this.getAllNetworkEvents();
+    const marshalledEvents = await Promise.all(events.map((event) => this.marshallNetworkEvent(event)));
+    return marshalledEvents;
+  }
+
+  /**
+   * Get marshalled network events since this ID
+   * @returns {Promise<Object[]>}
+   * @param {number} sinceId
+   */
+  async getMarshalledNetworkEvents(sinceId) {
+    const events = this.getNetworkEventsSince(sinceId);
+    const marshalledEvents = await Promise.all(events.map((event) => this.marshallNetworkEvent(event)));
+    return marshalledEvents;
+  }
+
+  /**
+   * Get marshalled network events in a range
+   * @param {number} startId
+   * @param {number} endId
+   * @returns {Promise<Object[]>}
+   */
+  async getMarshalledNetworkEventsInRange(startId, endId) {
+    const events = this.getNetworkEventsInRange(startId, endId);
+    const marshalledEvents = await Promise.all(events.map((event) => this.marshallNetworkEvent(event)));
+    return marshalledEvents;
+  }
+
+  /**
+   * Clear all network events
+   */
+  clearNetworkEvents() {
+    this.networkEvents.clear();
+    this.networkId = 0;
+  }
+}
+
+export default NetworkMonitor;

package/bin/client/recorderv3/step_runner.js

@@ -33,8 +33,9 @@ async function withAbort(fn, signal) {
 export class BVTStepRunner {
   #currentStepController;
   #port;
-  constructor({ projectDir }) {
+  constructor({ projectDir, sendExecutionStatus }) {
     this.projectDir = projectDir;
+    this.sendExecutionStatus = sendExecutionStatus;
   }
   setRemoteDebugPort(port) {
     this.#port = port;
@@ -74,6 +75,119 @@ export class BVTStepRunner {
     writeFileSync(tFilePath, tFileContent);
     return tFilePath;
   }
+
+  executeStepRemote = async ({ feature_file_path, scenario, tempFolderPath, stepText }, options) => {
+    if (!options) {
+      options = {
+        skipAfter: true,
+      };
+    }
+    const environment = {
+      ...process.env,
+    };
+
+    try {
+      const { loadConfiguration, loadSupport, runCucumber } = await import("@dev-blinq/cucumber-js/api");
+      const { runConfiguration } = await loadConfiguration(
+        {
+          provided: {
+            name: [scenario],
+            paths: [feature_file_path],
+            import: [path.join(tempFolderPath, "step_definitions", "**", "*.mjs")],
+            // format: ["bvt"],
+          },
+        },
+        { cwd: process.cwd(), env: environment }
+      );
+      // const files = glob.sync(path.join(tempFolderPath, "step_definitions", "**", "*.mjs"));
+      // console.log("Files found:", files);
+      const support = await loadSupport(runConfiguration, { cwd: process.cwd(), env: environment });
+      // console.log("found ", support.stepDefinitions.length, "step definitions");
+      // support.stepDefinitions.map((step) => {
+      //   console.log("step", step.pattern);
+      // });
+
+      if (options.skipAfter) {
+        // ignore afterAll/after hooks
+        support.afterTestCaseHookDefinitions = [];
+        support.afterTestRunHookDefinitions = [];
+      }
+
+      let errorMesssage = null;
+      let info = null;
+      let errInfo = null;
+      const result = await runCucumber({ ...runConfiguration, support }, environment, (message) => {
+        if (message.testStepFinished) {
+          const { testStepFinished } = message;
+          const { testStepResult } = testStepFinished;
+          if (testStepResult.status === "FAILED" || testStepResult.status === "AMBIGUOUS") {
+            if (!errorMesssage) {
+              errorMesssage = testStepResult.message;
+              if (info) {
+                errInfo = info;
+              }
+            }
+          }
+          if (testStepResult.status === "UNDEFINED") {
+            if (!errorMesssage) {
+              errorMesssage = `step ${JSON.stringify(stepText)} is ${testStepResult.status}`;
+              if (info) {
+                errInfo = info;
+              }
+            }
+          }
+        }
+        if (message.attachment) {
+          const attachment = message.attachment;
+          if (attachment.mediaType === "application/json" && attachment.body) {
+            const body = JSON.parse(attachment.body);
+            info = body.info;
+
+            if (body && body.payload) {
+              const payload = body.payload;
+              const content = payload.content;
+              const type = payload.type;
+              if (type === "cmdReport") {
+                if (content) {
+                  const report = JSON.parse(content);
+                  switch (report.status) {
+                    case "start":
+                      this.sendExecutionStatus({
+                        type: "cmdExecutionStart",
+                        cmdId: report.cmdId,
+                      });
+                      break;
+                    case "end":
+                      this.sendExecutionStatus({
+                        type: "cmdExecutionSuccess",
+                        cmdId: report.cmdId,
+                      });
+                      break;
+                    default:
+                      console.warn("Unknown command report status:", report.status);
+                  }
+                }
+              }
+            }
+          }
+        }
+      });
+      if (errorMesssage) {
+        const bvtError = new Error(errorMesssage);
+        Object.assign(bvtError, { info: errInfo });
+        throw bvtError;
+      }
+
+      return {
+        result,
+        info,
+      };
+    } catch (error) {
+      console.error("Error running cucumber-js", error);
+      throw error;
+    }
+  };
+
   async runStep({ step, parametersMap, envPath, tags }, bvtContext, options) {
     let codePage; // = getCodePage();
     // const tempFolderPath = process.env.tempFeaturesFolderPath;
@@ -121,7 +235,7 @@ export class BVTStepRunner {
     const stepExecController = new AbortController();
     this.#currentStepController = stepExecController;
     const { result, info } = await withAbort(async () => {
-      return await stepsDefinitions.executeStepRemote(
+      return await this.executeStepRemote(
         {
           feature_file_path,
           tempFolderPath,