automation_model 1.0.764-dev → 1.0.764-stage

package/lib/stable_browser.js

@@ -1,4 +1,5 @@
 // @ts-nocheck
+import { check_performance } from "./check_performance.js";
 import { expect } from "@playwright/test";
 import dayjs from "dayjs";
 import fs from "fs";
@@ -10,6 +11,7 @@ import { getDateTimeValue } from "./date_time.js";
 import drawRectangle from "./drawRect.js";
 //import { closeUnexpectedPopups } from "./popups.js";
 import { getTableCells, getTableData } from "./table_analyze.js";
+import errorStackParser from "error-stack-parser";
 import { _convertToRegexQuery, _copyContext, _fixLocatorUsingParams, _fixUsingParams, _getServerUrl, extractStepExampleParameters, KEYBOARD_EVENTS, maskValue, replaceWithLocalTestData, scrollPageToLoadLazyElements, unEscapeString, _getDataFile, testForRegex, performAction, _getTestData, } from "./utils.js";
 import csv from "csv-parser";
 import { Readable } from "node:stream";
@@ -19,13 +21,14 @@ import { getTestData } from "./auto_page.js";
 import { locate_element } from "./locate_element.js";
 import { randomUUID } from "crypto";
 import { _commandError, _commandFinally, _preCommand, _validateSelectors, _screenshot, _reportToWorld, } from "./command_common.js";
-import { registerDownloadEvent, registerNetworkEvents } from "./network.js";
+import { networkAfterStep, networkBeforeStep, registerDownloadEvent, registerNetworkEvents } from "./network.js";
 import { LocatorLog } from "./locator_log.js";
 import axios from "axios";
 import { _findCellArea, findElementsInArea } from "./table_helper.js";
 import { highlightSnapshot, snapshotValidation } from "./snapshot_validation.js";
 import { loadBrunoParams } from "./bruno.js";
 import { registerAfterStepRoutes, registerBeforeStepRoutes } from "./route.js";
+import { existsSync } from "node:fs";
 export const Types = {
     CLICK: "click_element",
     WAIT_ELEMENT: "wait_element",
@@ -44,6 +47,7 @@ export const Types = {
     VERIFY_PAGE_CONTAINS_NO_TEXT: "verify_page_contains_no_text",
     ANALYZE_TABLE: "analyze_table",
     SELECT: "select_combobox", //
+    VERIFY_PROPERTY: "verify_element_property",
     VERIFY_PAGE_PATH: "verify_page_path",
     VERIFY_PAGE_TITLE: "verify_page_title",
     TYPE_PRESS: "type_press",
@@ -62,12 +66,11 @@ export const Types = {
     SET_INPUT: "set_input",
     WAIT_FOR_TEXT_TO_DISAPPEAR: "wait_for_text_to_disappear",
     VERIFY_ATTRIBUTE: "verify_element_attribute",
-    VERIFY_PROPERTY: "verify_element_property",
     VERIFY_TEXT_WITH_RELATION: "verify_text_with_relation",
     BRUNO: "bruno",
-    SNAPSHOT_VALIDATION: "snapshot_validation",
     VERIFY_FILE_EXISTS: "verify_file_exists",
     SET_INPUT_FILES: "set_input_files",
+    SNAPSHOT_VALIDATION: "snapshot_validation",
     REPORT_COMMAND: "report_command",
     STEP_COMPLETE: "step_complete",
     SLEEP: "sleep",
@@ -84,6 +87,7 @@ class StableBrowser {
     context;
     world;
     fastMode;
+    stepTags;
     project_path = null;
     webLogFile = null;
     networkLogger = null;
@@ -92,13 +96,15 @@ class StableBrowser {
     tags = null;
     isRecording = false;
     initSnapshotTaken = false;
-    constructor(browser, page, logger = null, context = null, world = null, fastMode = false) {
+    onlyFailuresScreenshot = process.env.SCREENSHOT_ON_FAILURE_ONLY === "true";
+    constructor(browser, page, logger = null, context = null, world = null, fastMode = false, stepTags = []) {
         this.browser = browser;
         this.page = page;
         this.logger = logger;
         this.context = context;
         this.world = world;
         this.fastMode = fastMode;
+        this.stepTags = stepTags;
         if (!this.logger) {
             this.logger = console;
         }
@@ -131,6 +137,7 @@ class StableBrowser {
             this.fastMode = true;
         }
         if (process.env.FAST_MODE === "true") {
+            // console.log("Fast mode enabled from environment variable");
             this.fastMode = true;
         }
         if (process.env.FAST_MODE === "false") {
@@ -173,6 +180,7 @@ class StableBrowser {
             registerNetworkEvents(this.world, this, context, this.page);
             registerDownloadEvent(this.page, this.world, context);
             page.on("close", async () => {
+                // return if browser context is already closed
                 if (this.context && this.context.pages && this.context.pages.length > 1) {
                     this.context.pages.pop();
                     this.page = this.context.pages[this.context.pages.length - 1];
@@ -182,7 +190,12 @@ class StableBrowser {
                         console.log("Switched to page " + title);
                     }
                     catch (error) {
-                        console.error("Error on page close", error);
+                        if (error?.message?.includes("Target page, context or browser has been closed")) {
+                            // Ignore this error
+                        }
+                        else {
+                            console.error("Error on page close", error);
+                        }
                     }
                 }
             });
@@ -191,7 +204,12 @@ class StableBrowser {
                 console.log("Switch page: " + (await page.title()));
             }
             catch (e) {
-                this.logger.error("error on page load " + e);
+                if (e?.message?.includes("Target page, context or browser has been closed")) {
+                    // Ignore this error
+                }
+                else {
+                    this.logger.error("error on page load " + e);
+                }
             }
             context.pageLoading.status = false;
         }.bind(this));
@@ -219,7 +237,7 @@ class StableBrowser {
         if (newContextCreated) {
             this.registerEventListeners(this.context);
             await this.goto(this.context.environment.baseUrl);
-            if (!this.fastMode) {
+            if (!this.fastMode && !this.stepTags.includes("fast-mode")) {
                 await this.waitForPageLoad();
             }
         }
@@ -503,12 +521,6 @@ class StableBrowser {
                 if (!el.setAttribute) {
                     el = el.parentElement;
                 }
-                // remove any attributes start with data-blinq-id
-                // for (let i = 0; i < el.attributes.length; i++) {
-                //   if (el.attributes[i].name.startsWith("data-blinq-id")) {
-                //     el.removeAttribute(el.attributes[i].name);
-                //   }
-                // }
                 el.setAttribute("data-blinq-id-" + randomToken, "");
                 return true;
             }, [tag1, randomToken]))) {
@@ -678,40 +690,186 @@ class StableBrowser {
         }
         return { rerun: false };
     }
+    getFilePath() {
+        const stackFrames = errorStackParser.parse(new Error());
+        const stackFrame = stackFrames.findLast((frame) => frame.fileName && frame.fileName.endsWith(".mjs"));
+        // return stackFrame?.fileName || null;
+        const filepath = stackFrame?.fileName;
+        if (filepath) {
+            let jsonFilePath = filepath.replace(".mjs", ".json");
+            if (existsSync(jsonFilePath)) {
+                return jsonFilePath;
+            }
+            const config = this.configuration ?? {};
+            if (!config?.locatorsMetadataDir) {
+                config.locatorsMetadataDir = "features/step_definitions/locators";
+            }
+            if (config && config.locatorsMetadataDir) {
+                jsonFilePath = path.join(config.locatorsMetadataDir, path.basename(jsonFilePath));
+            }
+            if (existsSync(jsonFilePath)) {
+                return jsonFilePath;
+            }
+            return null;
+        }
+        return null;
+    }
+    getFullElementLocators(selectors, filePath) {
+        if (!filePath || !existsSync(filePath)) {
+            return null;
+        }
+        const content = fs.readFileSync(filePath, "utf8");
+        try {
+            const allElements = JSON.parse(content);
+            const element_key = selectors?.element_key;
+            if (element_key && allElements[element_key]) {
+                return allElements[element_key];
+            }
+            for (const elementKey in allElements) {
+                const element = allElements[elementKey];
+                let foundStrategy = null;
+                for (const key in element) {
+                    if (key === "strategy") {
+                        continue;
+                    }
+                    const locators = element[key];
+                    if (!locators || !locators.length) {
+                        continue;
+                    }
+                    for (const locator of locators) {
+                        delete locator.score;
+                    }
+                    if (JSON.stringify(locators) === JSON.stringify(selectors.locators)) {
+                        foundStrategy = key;
+                        break;
+                    }
+                }
+                if (foundStrategy) {
+                    return element;
+                }
+            }
+        }
+        catch (error) {
+            console.error("Error parsing locators from file: " + filePath, error);
+        }
+        return null;
+    }
     async _locate(selectors, info, _params, timeout, allowDisabled = false) {
         if (!timeout) {
             timeout = 30000;
         }
+        let element = null;
+        let allStrategyLocators = null;
+        let selectedStrategy = null;
+        if (this.tryAllStrategies) {
+            allStrategyLocators = this.getFullElementLocators(selectors, this.getFilePath());
+            selectedStrategy = allStrategyLocators?.strategy;
+        }
         for (let i = 0; i < 3; i++) {
             info.log += "attempt " + i + ": total locators " + selectors.locators.length + "\n";
             for (let j = 0; j < selectors.locators.length; j++) {
                 let selector = selectors.locators[j];
                 info.log += "searching for locator " + j + ":" + JSON.stringify(selector) + "\n";
             }
-            let element = await this._locate_internal(selectors, info, _params, timeout, allowDisabled);
+            if (this.tryAllStrategies && selectedStrategy) {
+                const strategyLocators = allStrategyLocators[selectedStrategy];
+                let err;
+                if (strategyLocators && strategyLocators.length) {
+                    try {
+                        selectors.locators = strategyLocators;
+                        element = await this._locate_internal(selectors, info, _params, 10_000, allowDisabled);
+                        info.selectedStrategy = selectedStrategy;
+                        info.log += "element found using strategy " + selectedStrategy + "\n";
+                    }
+                    catch (error) {
+                        err = error;
+                    }
+                }
+                if (!element) {
+                    for (const key in allStrategyLocators) {
+                        if (key === "strategy" || key === selectedStrategy) {
+                            continue;
+                        }
+                        const strategyLocators = allStrategyLocators[key];
+                        if (strategyLocators && strategyLocators.length) {
+                            try {
+                                info.log += "using strategy " + key + " with locators " + JSON.stringify(strategyLocators) + "\n";
+                                selectors.locators = strategyLocators;
+                                element = await this._locate_internal(selectors, info, _params, 10_000, allowDisabled);
+                                err = null;
+                                info.selectedStrategy = key;
+                                info.log += "element found using strategy " + key + "\n";
+                                break;
+                            }
+                            catch (error) {
+                                err = error;
+                            }
+                        }
+                    }
+                }
+                if (err) {
+                    throw err;
+                }
+            }
+            else {
+                element = await this._locate_internal(selectors, info, _params, timeout, allowDisabled);
+            }
             if (!element.rerun) {
-                const randomToken = Math.random().toString(36).substring(7);
-                await element.evaluate((el, randomToken) => {
-                    el.setAttribute("data-blinq-id-" + randomToken, "");
-                }, randomToken);
-                // if (element._frame) {
-                //   return element;
-                // }
+                let newElementSelector = "";
+                if (this.configuration && this.configuration.stableLocatorStrategy === "csschain") {
+                    const cssSelector = await element.evaluate((el) => {
+                        function getCssSelector(el) {
+                            if (!el || el.nodeType !== 1 || el === document.body)
+                                return el.tagName.toLowerCase();
+                            const parent = el.parentElement;
+                            const tag = el.tagName.toLowerCase();
+                            // Find the index of the element among its siblings of the same tag
+                            let index = 1;
+                            for (let sibling = el.previousElementSibling; sibling; sibling = sibling.previousElementSibling) {
+                                if (sibling.tagName === el.tagName) {
+                                    index++;
+                                }
+                            }
+                            // Use nth-child if necessary (i.e., if there's more than one of the same tag)
+                            const siblings = Array.from(parent.children).filter((child) => child.tagName === el.tagName);
+                            const needsNthChild = siblings.length > 1;
+                            const selector = needsNthChild ? `${tag}:nth-child(${[...parent.children].indexOf(el) + 1})` : tag;
+                            return getCssSelector(parent) + " > " + selector;
+                        }
+                        const cssSelector = getCssSelector(el);
+                        return cssSelector;
+                    });
+                    newElementSelector = cssSelector;
+                }
+                else {
+                    const randomToken = "blinq_" + Math.random().toString(36).substring(7);
+                    if (this.configuration && this.configuration.stableLocatorStrategy === "data-attribute") {
+                        const dataAttribute = "data-blinq-id";
+                        await element.evaluate((el, [dataAttribute, randomToken]) => {
+                            el.setAttribute(dataAttribute, randomToken);
+                        }, [dataAttribute, randomToken]);
+                        newElementSelector = `[${dataAttribute}="${randomToken}"]`;
+                    }
+                    else {
+                        // the default case just return the located element
+                        // will not work for click and type if the locator is placeholder and the placeholder change due to the click event
+                        return element;
+                    }
+                }
                 const scope = element._frame ?? element.page();
-                let newElementSelector = "[data-blinq-id-" + randomToken + "]";
                 let prefixSelector = "";
                 const frameControlSelector = " >> internal:control=enter-frame";
                 const frameSelectorIndex = element._selector.lastIndexOf(frameControlSelector);
                 if (frameSelectorIndex !== -1) {
                     // remove everything after the >> internal:control=enter-frame
                     const frameSelector = element._selector.substring(0, frameSelectorIndex);
-                    prefixSelector = frameSelector + " >> internal:control=enter-frame >>";
+                    prefixSelector = frameSelector + " >> internal:control=enter-frame >> ";
                 }
                 // if (element?._frame?._selector) {
                 //   prefixSelector = element._frame._selector + " >> " + prefixSelector;
                 // }
                 const newSelector = prefixSelector + newElementSelector;
-                return scope.locator(newSelector);
+                return scope.locator(newSelector).first();
             }
         }
         throw new Error("unable to locate element " + JSON.stringify(selectors));
@@ -732,7 +890,7 @@ class StableBrowser {
                 for (let i = 0; i < frame.selectors.length; i++) {
                     let frameLocator = frame.selectors[i];
                     if (frameLocator.css) {
-                        let testframescope = framescope.frameLocator(frameLocator.css);
+                        let testframescope = framescope.frameLocator(`${frameLocator.css} >> visible=true`);
                         if (frameLocator.index) {
                             testframescope = framescope.nth(frameLocator.index);
                         }
@@ -744,7 +902,7 @@ class StableBrowser {
                             break;
                         }
                         catch (error) {
-                            console.error("frame not found " + frameLocator.css);
+                            // console.error("frame not found " + frameLocator.css);
                         }
                     }
                 }
@@ -810,6 +968,15 @@ class StableBrowser {
         });
     }
     async _locate_internal(selectors, info, _params, timeout = 30000, allowDisabled = false) {
+        if (selectors.locators && Array.isArray(selectors.locators)) {
+            selectors.locators.forEach((locator) => {
+                locator.index = locator.index ?? 0;
+                locator.visible = locator.visible ?? true;
+                if (locator.visible && locator.css && !locator.css.endsWith(">> visible=true")) {
+                    locator.css = locator.css + " >> visible=true";
+                }
+            });
+        }
         if (!info) {
             info = {};
             info.failCause = {};
@@ -822,7 +989,6 @@ class StableBrowser {
         let locatorsCount = 0;
         let lazy_scroll = false;
         //let arrayMode = Array.isArray(selectors);
-        let scope = await this._findFrameScope(selectors, timeout, info);
         let selectorsLocators = null;
         selectorsLocators = selectors.locators;
         // group selectors by priority
@@ -850,6 +1016,7 @@ class StableBrowser {
         let highPriorityOnly = true;
         let visibleOnly = true;
         while (true) {
+            let scope = await this._findFrameScope(selectors, timeout, info);
             locatorsCount = 0;
             let result = [];
             let popupResult = await this.closeUnexpectedPopups(info, _params);
@@ -965,9 +1132,13 @@ class StableBrowser {
                 }
             }
             if (foundLocators.length === 1) {
+                let box = null;
+                if (!this.onlyFailuresScreenshot) {
+                    box = await foundLocators[0].boundingBox();
+                }
                 result.foundElements.push({
                     locator: foundLocators[0],
-                    box: await foundLocators[0].boundingBox(),
+                    box: box,
                     unique: true,
                 });
                 result.locatorIndex = i;
@@ -1122,11 +1293,22 @@ class StableBrowser {
             operation: "click",
             log: "***** click on " + selectors.element_name + " *****\n",
         };
+        check_performance("click_all ***", this.context, true);
+        let stepFastMode = this.stepTags.includes("fast-mode");
+        if (stepFastMode) {
+            state.onlyFailuresScreenshot = true;
+            state.scroll = false;
+            state.highlight = false;
+        }
         try {
+            check_performance("click_preCommand", this.context, true);
             await _preCommand(state, this);
+            check_performance("click_preCommand", this.context, false);
             await performAction("click", state.element, options, this, state, _params);
-            if (!this.fastMode) {
-                await this.waitForPageLoad();
+            if (!this.fastMode && !this.stepTags.includes("fast-mode")) {
+                check_performance("click_waitForPageLoad", this.context, true);
+                await this.waitForPageLoad({ noSleep: true });
+                check_performance("click_waitForPageLoad", this.context, false);
             }
             return state.info;
         }
@@ -1134,7 +1316,13 @@ class StableBrowser {
             await _commandError(state, e, this);
         }
         finally {
+            check_performance("click_commandFinally", this.context, true);
             await _commandFinally(state, this);
+            check_performance("click_commandFinally", this.context, false);
+            check_performance("click_all ***", this.context, false);
+            if (this.context.profile) {
+                console.log(JSON.stringify(this.context.profile, null, 2));
+            }
         }
     }
     async waitForElement(selectors, _params, options = {}, world = null) {
@@ -1226,7 +1414,7 @@ class StableBrowser {
                     }
                 }
             }
-            await this.waitForPageLoad();
+            //await this.waitForPageLoad();
             return state.info;
         }
         catch (e) {
@@ -1252,7 +1440,7 @@ class StableBrowser {
             await _preCommand(state, this);
             await performAction("hover", state.element, options, this, state, _params);
             await _screenshot(state, this);
-            await this.waitForPageLoad();
+            //await this.waitForPageLoad();
             return state.info;
         }
         catch (e) {
@@ -1288,7 +1476,7 @@ class StableBrowser {
                 state.info.log += "selectOption failed, will try force" + "\n";
                 await state.element.selectOption(values, { timeout: 10000, force: true });
             }
-            await this.waitForPageLoad();
+            //await this.waitForPageLoad();
             return state.info;
         }
         catch (e) {
@@ -1474,6 +1662,14 @@ class StableBrowser {
         }
         try {
             await _preCommand(state, this);
+            const randomToken = "blinq_" + Math.random().toString(36).substring(7);
+            // tag the element
+            let newElementSelector = await state.element.evaluate((el, token) => {
+                // use attribute and not id
+                const attrName = `data-blinq-id-${token}`;
+                el.setAttribute(attrName, "");
+                return `[${attrName}]`;
+            }, randomToken);
             state.info.value = _value;
             if (!options.press) {
                 try {
@@ -1499,6 +1695,25 @@ class StableBrowser {
                 }
             }
             await new Promise((resolve) => setTimeout(resolve, 500));
+            // check if the element exist after the click (no wait)
+            const count = await state.element.count({ timeout: 0 });
+            if (count === 0) {
+                // the locator changed after the click (placeholder) we need to locate the element using the data-blinq-id
+                const scope = state.element._frame ?? element.page();
+                let prefixSelector = "";
+                const frameControlSelector = " >> internal:control=enter-frame";
+                const frameSelectorIndex = state.element._selector.lastIndexOf(frameControlSelector);
+                if (frameSelectorIndex !== -1) {
+                    // remove everything after the >> internal:control=enter-frame
+                    const frameSelector = state.element._selector.substring(0, frameSelectorIndex);
+                    prefixSelector = frameSelector + " >> internal:control=enter-frame >> ";
+                }
+                // if (element?._frame?._selector) {
+                //   prefixSelector = element._frame._selector + " >> " + prefixSelector;
+                // }
+                const newSelector = prefixSelector + newElementSelector;
+                state.element = scope.locator(newSelector).first();
+            }
             const valueSegment = state.value.split("&&");
             for (let i = 0; i < valueSegment.length; i++) {
                 if (i > 0) {
@@ -1570,8 +1785,8 @@ class StableBrowser {
             if (enter) {
                 await new Promise((resolve) => setTimeout(resolve, 2000));
                 await this.page.keyboard.press("Enter");
+                await this.waitForPageLoad();
             }
-            await this.waitForPageLoad();
             return state.info;
         }
         catch (e) {
@@ -2437,7 +2652,7 @@ class StableBrowser {
         let expectedValue;
         try {
             await _preCommand(state, this);
-            expectedValue = await replaceWithLocalTestData(state.value, world);
+            expectedValue = await this._replaceWithLocalData(value, world);
             state.info.expectedValue = expectedValue;
             switch (property) {
                 case "innerText":
@@ -2485,47 +2700,54 @@ class StableBrowser {
             }
             state.info.value = val;
             let regex;
-            if (expectedValue.startsWith("/") && expectedValue.endsWith("/")) {
-                const patternBody = expectedValue.slice(1, -1);
-                const processedPattern = patternBody.replace(/\n/g, ".*");
-                regex = new RegExp(processedPattern, "gs");
-                state.info.regex = true;
-            }
-            else {
-                const escapedPattern = expectedValue.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
-                regex = new RegExp(escapedPattern, "g");
-            }
-            if (property === "innerText") {
-                if (state.info.regex) {
-                    if (!regex.test(val)) {
-                        let errorMessage = `The ${property} property has a value of "${val}", but the expected value is "${expectedValue}"`;
-                        state.info.failCause.assertionFailed = true;
-                        state.info.failCause.lastError = errorMessage;
-                        throw new Error(errorMessage);
-                    }
+            state.info.value = val;
+            const isRegex = expectedValue.startsWith("regex:");
+            const isContains = expectedValue.startsWith("contains:");
+            const isExact = expectedValue.startsWith("exact:");
+            let matchPassed = false;
+            if (isRegex) {
+                const rawPattern = expectedValue.slice(6); // remove "regex:"
+                const lastSlashIndex = rawPattern.lastIndexOf("/");
+                if (rawPattern.startsWith("/") && lastSlashIndex > 0) {
+                    const patternBody = rawPattern.slice(1, lastSlashIndex).replace(/\n/g, ".*");
+                    const flags = rawPattern.slice(lastSlashIndex + 1) || "gs";
+                    const regex = new RegExp(patternBody, flags);
+                    state.info.regex = true;
+                    matchPassed = regex.test(val);
                 }
                 else {
-                    // Fix: Replace escaped newlines with actual newlines before splitting
-                    const normalizedExpectedValue = expectedValue.replace(/\\n/g, "\n");
-                    const valLines = val.split("\n");
-                    const expectedLines = normalizedExpectedValue.split("\n");
-                    // Check if all expected lines are present in the actual lines
-                    const isPart = expectedLines.every((expectedLine) => valLines.some((valLine) => valLine.trim() === expectedLine.trim()));
-                    if (!isPart) {
-                        let errorMessage = `The ${property} property has a value of "${val}", but the expected value is "${expectedValue}"`;
-                        state.info.failCause.assertionFailed = true;
-                        state.info.failCause.lastError = errorMessage;
-                        throw new Error(errorMessage);
-                    }
+                    // Fallback: treat as literal
+                    const escapedPattern = rawPattern.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+                    const regex = new RegExp(escapedPattern, "g");
+                    matchPassed = regex.test(val);
                 }
             }
+            else if (isContains) {
+                const containsValue = expectedValue.slice(9); // remove "contains:"
+                matchPassed = val.includes(containsValue);
+            }
+            else if (isExact) {
+                const exactValue = expectedValue.slice(6); // remove "exact:"
+                matchPassed = val === exactValue;
+            }
+            else if (property === "innerText") {
+                // Default innerText logic
+                const normalizedExpectedValue = expectedValue.replace(/\\n/g, "\n");
+                const valLines = val.split("\n");
+                const expectedLines = normalizedExpectedValue.split("\n");
+                matchPassed = expectedLines.every((expectedLine) => valLines.some((valLine) => valLine.trim() === expectedLine.trim()));
+            }
             else {
-                if (!val.match(regex)) {
-                    let errorMessage = `The ${property} property has a value of "${val}", but the expected value is "${expectedValue}"`;
-                    state.info.failCause.assertionFailed = true;
-                    state.info.failCause.lastError = errorMessage;
-                    throw new Error(errorMessage);
-                }
+                // Fallback exact or loose match
+                const escapedPattern = expectedValue.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+                const regex = new RegExp(escapedPattern, "g");
+                matchPassed = regex.test(val);
+            }
+            if (!matchPassed) {
+                let errorMessage = `The ${property} property has a value of "${val}", but the expected value is "${expectedValue}"`;
+                state.info.failCause.assertionFailed = true;
+                state.info.failCause.lastError = errorMessage;
+                throw new Error(errorMessage);
             }
             return state.info;
         }
@@ -2556,81 +2778,112 @@ class StableBrowser {
             allowDisabled: true,
             info: {},
         };
-        try {
-            await _preCommand(state, this);
-            const startTime = Date.now();
-            let conditionMet = false;
-            let currentValue = null;
-            const checkCondition = async () => {
-                try {
-                    switch (condition.toLowerCase()) {
-                        case "checked":
-                            currentValue = await state.element.isChecked();
-                            return currentValue === true;
-                        case "unchecked":
-                            currentValue = await state.element.isChecked();
-                            return currentValue === false;
-                        case "visible":
-                            currentValue = await state.element.isVisible();
-                            return currentValue === true;
-                        case "hidden":
-                            currentValue = await state.element.isVisible();
-                            return currentValue === false;
-                        case "enabled":
-                            currentValue = await state.element.isDisabled();
-                            return currentValue === false;
-                        case "disabled":
-                            currentValue = await state.element.isDisabled();
-                            return currentValue === true;
-                        case "editable":
-                            currentValue = await String(await state.element.evaluate((element, prop) => element[prop], "isContentEditable"));
-                            return currentValue === true;
-                        default:
-                            state.info.message = `Unsupported condition: '${condition}'. Supported conditions are: checked, unchecked, visible, hidden, enabled, disabled, editable.`;
-                            state.info.success = false;
-                            return false;
+        state.options ??= { timeout: timeoutMs };
+        // Initialize startTime outside try block to ensure it's always accessible
+        const startTime = Date.now();
+        let conditionMet = false;
+        let currentValue = null;
+        let lastError = null;
+        // Main retry loop - continues until timeout or condition is met
+        while (Date.now() - startTime < timeoutMs) {
+            const elapsedTime = Date.now() - startTime;
+            const remainingTime = timeoutMs - elapsedTime;
+            try {
+                // Try to execute _preCommand (element location)
+                await _preCommand(state, this);
+                // If _preCommand succeeds, start condition checking
+                const checkCondition = async () => {
+                    try {
+                        switch (condition.toLowerCase()) {
+                            case "checked":
+                                currentValue = await state.element.isChecked();
+                                return currentValue === true;
+                            case "unchecked":
+                                currentValue = await state.element.isChecked();
+                                return currentValue === false;
+                            case "visible":
+                                currentValue = await state.element.isVisible();
+                                return currentValue === true;
+                            case "hidden":
+                                currentValue = await state.element.isVisible();
+                                return currentValue === false;
+                            case "enabled":
+                                currentValue = await state.element.isDisabled();
+                                return currentValue === false;
+                            case "disabled":
+                                currentValue = await state.element.isDisabled();
+                                return currentValue === true;
+                            case "editable":
+                                // currentValue = await String(await state.element.evaluate((element, prop) => element[prop], "isContentEditable"));
+                                currentValue = await state.element.isContentEditable();
+                                return currentValue === true;
+                            default:
+                                state.info.message = `Unsupported condition: '${condition}'. Supported conditions are: checked, unchecked, visible, hidden, enabled, disabled, editable.`;
+                                state.info.success = false;
+                                return false;
+                        }
+                    }
+                    catch (error) {
+                        // Don't throw here, just return false to continue retrying
+                        return false;
+                    }
+                };
+                // Inner loop for condition checking (once element is located)
+                while (Date.now() - startTime < timeoutMs) {
+                    const currentElapsedTime = Date.now() - startTime;
+                    conditionMet = await checkCondition();
+                    if (conditionMet) {
+                        break;
+                    }
+                    // Check if we still have time for another attempt
+                    if (Date.now() - startTime + 50 < timeoutMs) {
+                        await new Promise((res) => setTimeout(res, 50));
+                    }
+                    else {
+                        break;
                     }
                 }
-                catch {
-                    return false;
+                // If we got here and condition is met, break out of main loop
+                if (conditionMet) {
+                    break;
                 }
-            };
-            while (Date.now() - startTime < timeoutMs) {
-                // Use milliseconds for comparison
-                conditionMet = await checkCondition();
-                if (conditionMet)
+                // If condition not met but no exception, we've timed out
+                break;
+            }
+            catch (e) {
+                lastError = e;
+                const currentElapsedTime = Date.now() - startTime;
+                const timeLeft = timeoutMs - currentElapsedTime;
+                // Check if we have enough time left to retry
+                if (timeLeft > 100) {
+                    await new Promise((resolve) => setTimeout(resolve, 50));
+                }
+                else {
                     break;
-                await new Promise((res) => setTimeout(res, 50));
-            }
-            const actualWaitTime = Date.now() - startTime;
-            state.info = {
-                success: conditionMet,
-                conditionMet,
-                actualWaitTime,
-                currentValue,
-                message: conditionMet
-                    ? `Condition '${condition}' met after ${(actualWaitTime / 1000).toFixed(2)}s`
-                    : `Condition '${condition}' not met within ${timeout}s timeout`, // Use original seconds value
-            };
-            state.log += state.info.message + "\n";
-            return state.info;
+                }
+            }
         }
-        catch (e) {
-            state.info = {
-                success: false,
-                conditionMet: false,
-                actualWaitTime: timeoutMs, // Store as milliseconds
-                currentValue: null,
-                error: e.message,
-                message: `Error during conditional wait: ${e.message}`,
-            };
-            state.log += `Error during conditional wait: ${e.message}\n`;
-            await new Promise((resolve) => setTimeout(resolve, timeoutMs)); // Use milliseconds
-            return state.info;
+        const actualWaitTime = Date.now() - startTime;
+        state.info = {
+            success: conditionMet,
+            conditionMet,
+            actualWaitTime,
+            currentValue,
+            lastError: lastError?.message || null,
+            message: conditionMet
+                ? `Condition '${condition}' met after ${(actualWaitTime / 1000).toFixed(2)}s`
+                : `Condition '${condition}' not met within ${timeout}s timeout`,
+        };
+        if (lastError) {
+            state.log += `Last error: ${lastError.message}\n`;
         }
-        finally {
+        try {
             await _commandFinally(state, this);
         }
+        catch (finallyError) {
+            state.log += `Error in _commandFinally: ${finallyError.message}\n`;
+        }
+        return state.info;
     }
     async extractEmailData(emailAddress, options, world) {
         if (!emailAddress) {
@@ -3101,7 +3354,15 @@ class StableBrowser {
             text = text.replace(/\\"/g, '"');
         }
         const timeout = this._getFindElementTimeout(options);
-        await new Promise((resolve) => setTimeout(resolve, 2000));
+        //if (!this.fastMode && !this.stepTags.includes("fast-mode")) {
+        if (!this.stepTags.includes("fast-mode")) {
+            if (!this.fastMode) {
+                await new Promise((resolve) => setTimeout(resolve, 2000));
+            }
+            else {
+                await new Promise((resolve) => setTimeout(resolve, 500));
+            }
+        }
         const newValue = await this._replaceWithLocalData(text, world);
         if (newValue !== text) {
             this.logger.info(text + "=" + newValue);
@@ -3228,6 +3489,8 @@ class StableBrowser {
             operation: "verify_text_with_relation",
             log: "***** search for " + textAnchor + " climb " + climb + " and verify " + textToVerify + " found *****\n",
         };
+        const cmdStartTime = Date.now();
+        let cmdEndTime = null;
         const timeout = this._getFindElementTimeout(options);
         await new Promise((resolve) => setTimeout(resolve, 2000));
         let newValue = await this._replaceWithLocalData(textAnchor, world);
@@ -3263,6 +3526,17 @@ class StableBrowser {
                     await new Promise((resolve) => setTimeout(resolve, 1000));
                     continue;
                 }
+                else {
+                    cmdEndTime = Date.now();
+                    if (cmdEndTime - cmdStartTime > 55000) {
+                        if (foundAncore) {
+                            throw new Error(`Text ${textToVerify} not found in page`);
+                        }
+                        else {
+                            throw new Error(`Text ${textAnchor} not found in page`);
+                        }
+                    }
+                }
                 try {
                     for (let i = 0; i < resultWithElementsFound.length; i++) {
                         foundAncore = true;
@@ -3401,7 +3675,7 @@ class StableBrowser {
             Object.assign(e, { info: info });
             error = e;
             // throw e;
-            await _commandError({ text: "visualVerification", operation: "visualVerification", text, info }, e, this);
+            await _commandError({ text: "visualVerification", operation: "visualVerification", info }, e, this);
         }
         finally {
             const endTime = Date.now();
@@ -3750,6 +4024,22 @@ class StableBrowser {
         }
     }
     async waitForPageLoad(options = {}, world = null) {
+        // try {
+        //   let currentPagePath = null;
+        //   currentPagePath = new URL(this.page.url()).pathname;
+        //   if (this.latestPagePath) {
+        //     // get the currect page path and compare with the latest page path
+        //     if (this.latestPagePath === currentPagePath) {
+        //       // if the page path is the same, do not wait for page load
+        //       console.log("No page change: " + currentPagePath);
+        //       return;
+        //     }
+        //   }
+        //   this.latestPagePath = currentPagePath;
+        // } catch (e) {
+        //   console.debug("Error getting current page path: ", e);
+        // }
+        //console.log("Waiting for page load");
         let timeout = this._getLoadTimeout(options);
         const promiseArray = [];
         // let waitForNetworkIdle = true;
@@ -3784,7 +4074,10 @@ class StableBrowser {
             }
         }
         finally {
-            await new Promise((resolve) => setTimeout(resolve, 2000));
+            await new Promise((resolve) => setTimeout(resolve, 500));
+            if (options && !options.noSleep) {
+                await new Promise((resolve) => setTimeout(resolve, 1500));
+            }
             ({ screenshotId, screenshotPath } = await this._screenShot(options, world));
             const endTime = Date.now();
             _reportToWorld(world, {
@@ -3838,7 +4131,7 @@ class StableBrowser {
         }
         operation = options.operation;
         // validate operation is one of the supported operations
-        if (operation != "click" && operation != "hover+click") {
+        if (operation != "click" && operation != "hover+click" && operation != "hover") {
             throw new Error("operation is not supported");
         }
         const state = {
@@ -3907,6 +4200,17 @@ class StableBrowser {
                     state.element = results[0];
                     await performAction("hover+click", state.element, options, this, state, _params);
                     break;
+                case "hover":
+                    if (!options.css) {
+                        throw new Error("css is not defined");
+                    }
+                    const result1 = await findElementsInArea(options.css, cellArea, this, options);
+                    if (result1.length === 0) {
+                        throw new Error(`Element not found in cell area`);
+                    }
+                    state.element = result1[0];
+                    await performAction("hover", state.element, options, this, state, _params);
+                    break;
                 default:
                     throw new Error("operation is not supported");
             }
@@ -4022,6 +4326,7 @@ class StableBrowser {
         if (world && world.attach) {
             world.attach(this.context.reportFolder, { mediaType: "text/plain" });
         }
+        this.context.loadedRoutes = null;
         this.beforeScenarioCalled = true;
         if (scenario && scenario.pickle && scenario.pickle.name) {
             this.scenarioName = scenario.pickle.name;
@@ -4051,8 +4356,10 @@ class StableBrowser {
     }
     async afterScenario(world, scenario) { }
     async beforeStep(world, step) {
+        this.stepTags = [];
         if (!this.beforeScenarioCalled) {
             this.beforeScenario(world, step);
+            this.context.loadedRoutes = null;
         }
         if (this.stepIndex === undefined) {
             this.stepIndex = 0;
@@ -4062,7 +4369,12 @@ class StableBrowser {
         }
         if (step && step.pickleStep && step.pickleStep.text) {
             this.stepName = step.pickleStep.text;
-            this.logger.info("step: " + this.stepName);
+            let printableStepName = this.stepName;
+            // take the printableStepName and replace quated value with \x1b[33m and \x1b[0m
+            printableStepName = printableStepName.replace(/"([^"]*)"/g, (match, p1) => {
+                return `\x1b[33m"${p1}"\x1b[0m`;
+            });
+            this.logger.info("\x1b[38;5;208mstep:\x1b[0m " + printableStepName);
         }
         else if (step && step.text) {
             this.stepName = step.text;
@@ -4077,7 +4389,10 @@ class StableBrowser {
         }
         if (this.initSnapshotTaken === false) {
             this.initSnapshotTaken = true;
-            if (world && world.attach && !process.env.DISABLE_SNAPSHOT && !this.fastMode) {
+            if (world &&
+                world.attach &&
+                !process.env.DISABLE_SNAPSHOT &&
+                (!this.fastMode || this.stepTags.includes("fast-mode"))) {
                 const snapshot = await this.getAriaSnapshot();
                 if (snapshot) {
                     await world.attach(JSON.stringify(snapshot), "application/json+snapshot-before");
@@ -4085,7 +4400,12 @@ class StableBrowser {
             }
         }
         this.context.routeResults = null;
-        await registerBeforeStepRoutes(this.context, this.stepName);
+        this.context.loadedRoutes = null;
+        await registerBeforeStepRoutes(this.context, this.stepName, world);
+        networkBeforeStep(this.stepName, this.context);
+    }
+    setStepTags(tags) {
+        this.stepTags = tags;
     }
     async getAriaSnapshot() {
         try {
@@ -4105,12 +4425,18 @@ class StableBrowser {
                 try {
                     // Ensure frame is attached and has body
                     const body = frame.locator("body");
-                    await body.waitFor({ timeout: 200 }); // wait explicitly
+                    //await body.waitFor({ timeout: 2000 }); // wait explicitly
                     const snapshot = await body.ariaSnapshot({ timeout });
+                    if (!snapshot) {
+                        continue;
+                    }
                     content.push(`- frame: ${i}`);
                     content.push(snapshot);
                 }
-                catch (innerErr) { }
+                catch (innerErr) {
+                    console.warn(`Frame ${i} snapshot failed:`, innerErr);
+                    content.push(`- frame: ${i} - error: ${innerErr.message}`);
+                }
             }
             return content.join("\n");
         }
@@ -4182,7 +4508,11 @@ class StableBrowser {
         if (this.context) {
             this.context.examplesRow = null;
         }
-        if (world && world.attach && !process.env.DISABLE_SNAPSHOT) {
+        if (world &&
+            world.attach &&
+            !process.env.DISABLE_SNAPSHOT &&
+            !this.fastMode &&
+            !this.stepTags.includes("fast-mode")) {
             const snapshot = await this.getAriaSnapshot();
             if (snapshot) {
                 const obj = {};
@@ -4190,6 +4520,11 @@ class StableBrowser {
             }
         }
         this.context.routeResults = await registerAfterStepRoutes(this.context, world);
+        if (this.context.routeResults) {
+            if (world && world.attach) {
+                await world.attach(JSON.stringify(this.context.routeResults), "application/json+intercept-results");
+            }
+        }
         if (!process.env.TEMP_RUN) {
             const state = {
                 world,
@@ -4213,6 +4548,13 @@ class StableBrowser {
                 await _commandFinally(state, this);
             }
         }
+        networkAfterStep(this.stepName, this.context);
+        if (process.env.TEMP_RUN === "true") {
+            // Put a sleep for some time to allow the browser to finish processing
+            if (!this.stepTags.includes("fast-mode")) {
+                await new Promise((resolve) => setTimeout(resolve, 3000));
+            }
+        }
     }
 }
 function createTimedPromise(promise, label) {