automation_model 1.0.565-dev → 1.0.565-stage

package/lib/stable_browser.js

@@ -10,18 +10,21 @@ import { getDateTimeValue } from "./date_time.js";
 import drawRectangle from "./drawRect.js";
 //import { closeUnexpectedPopups } from "./popups.js";
 import { getTableCells, getTableData } from "./table_analyze.js";
-import { _copyContext, _fixLocatorUsingParams, _fixUsingParams, _getServerUrl, KEYBOARD_EVENTS, maskValue, replaceWithLocalTestData, scrollPageToLoadLazyElements, unEscapeString, } from "./utils.js";
+import { _convertToRegexQuery, _copyContext, _fixLocatorUsingParams, _fixUsingParams, _getServerUrl, extractStepExampleParameters, KEYBOARD_EVENTS, maskValue, replaceWithLocalTestData, scrollPageToLoadLazyElements, unEscapeString, _getDataFile, testForRegex, performAction, } from "./utils.js";
 import csv from "csv-parser";
 import { Readable } from "node:stream";
 import readline from "readline";
-import { getContext } from "./init_browser.js";
+import { getContext, refreshBrowser } from "./init_browser.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 { LocatorLog } from "./locator_log.js";
+import axios from "axios";
+import { _findCellArea, findElementsInArea } from "./table_helper.js";
 export const Types = {
     CLICK: "click_element",
+    WAIT_ELEMENT: "wait_element",
     NAVIGATE: "navigate",
     FILL: "fill_element",
     EXECUTE: "execute_page_method",
@@ -43,6 +46,7 @@ export const Types = {
     UNCHECK: "uncheck_element",
     EXTRACT: "extract_attribute",
     CLOSE_PAGE: "close_page",
+    TABLE_OPERATION: "table_operation",
     SET_DATE_TIME: "set_date_time",
     SET_VIEWPORT: "set_viewport",
     VERIFY_VISUAL: "verify_visual",
@@ -53,6 +57,9 @@ export const Types = {
     VERIFY_TEXT_WITH_RELATION: "verify_text_with_relation",
 };
 export const apps = {};
+const formatElementName = (elementName) => {
+    return elementName ? JSON.stringify(elementName) : "element";
+};
 class StableBrowser {
     browser;
     page;
@@ -66,6 +73,7 @@ class StableBrowser {
     appName = "main";
     tags = null;
     isRecording = false;
+    initSnapshotTaken = false;
     constructor(browser, page, logger = null, context = null, world = null) {
         this.browser = browser;
         this.page = page;
@@ -235,16 +243,51 @@ class StableBrowser {
     // async closeUnexpectedPopups() {
     //   await closeUnexpectedPopups(this.page);
     // }
-    async goto(url) {
+    async goto(url, world = null) {
+        if (!url) {
+            throw new Error("url is null, verify that the environment file is correct");
+        }
         if (!url.startsWith("http")) {
             url = "https://" + url;
         }
-        await this.page.goto(url, {
-            timeout: 60000,
-        });
+        const state = {
+            value: url,
+            world: world,
+            type: Types.NAVIGATE,
+            text: `Navigate Page to: ${url}`,
+            operation: "goto",
+            log: "***** navigate page to " + url + " *****\n",
+            info: {},
+            locate: false,
+            scroll: false,
+            screenshot: false,
+            highlight: false,
+        };
+        try {
+            await _preCommand(state, this);
+            await this.page.goto(url, {
+                timeout: 60000,
+            });
+            await _screenshot(state, this);
+        }
+        catch (error) {
+            console.error("Error on goto", error);
+            _commandError(state, error, this);
+        }
+        finally {
+            _commandFinally(state, this);
+        }
     }
-    _getLocator(locator, scope, _params) {
+    async _getLocator(locator, scope, _params) {
         locator = _fixLocatorUsingParams(locator, _params);
+        // locator = await this._replaceWithLocalData(locator);
+        for (let key in locator) {
+            if (typeof locator[key] !== "string")
+                continue;
+            if (locator[key].includes("{{") && locator[key].includes("}}")) {
+                locator[key] = await this._replaceWithLocalData(locator[key], this.world);
+            }
+        }
         let locatorReturn;
         if (locator.role) {
             if (locator.role[1].nameReg) {
@@ -295,52 +338,60 @@ class StableBrowser {
         if (css && css.locator) {
             css = css.locator;
         }
-        let result = await this._locateElementByText(scope, _fixUsingParams(text, _params), "*:not(script, style, head)", false, false, _params);
+        let result = await this._locateElementByText(scope, _fixUsingParams(text, _params), "*:not(script, style, head)", false, false, true, _params);
         if (result.elementCount === 0) {
             return;
         }
-        let textElementCss = "[data-blinq-id='blinq-id-" + result.randomToken + "']";
+        let textElementCss = "[data-blinq-id-" + result.randomToken + "]";
         // css climb to parent element
         const climbArray = [];
         for (let i = 0; i < climb; i++) {
             climbArray.push("..");
         }
         let climbXpath = "xpath=" + climbArray.join("/");
-        return textElementCss + " >> " + climbXpath + " >> " + css;
-    }
-    async _locateElementByText(scope, text1, tag1, regex1 = false, partial1, _params) {
-        //const stringifyText = JSON.stringify(text);
-        return await scope.locator(":root").evaluate((_node, [text, tag, regex, partial]) => {
-            const options = {
-                innerText: true,
-            };
-            if (regex) {
-                options.singleRegex = true;
-            }
-            if (tag) {
-                options.tag = tag;
-            }
-            if (!(partial === true)) {
-                options.exactMatch = true;
-            }
-            const elements = window.findMatchingElements(text, options);
-            let randomToken = null;
-            const foundElements = [];
-            let elementCount = 0;
-            if (elements.length > 0) {
-                for (let i = 0; i < elements.length; i++) {
-                    if (randomToken === null) {
-                        randomToken = Math.random().toString(36).substring(7);
+        let resultCss = textElementCss + " >> " + climbXpath;
+        if (css) {
+            resultCss = resultCss + " >> " + css;
+        }
+        return resultCss;
+    }
+    async _locateElementByText(scope, text1, tag1, regex1 = false, partial1, ignoreCase = true, _params) {
+        const query = `${_convertToRegexQuery(text1, regex1, !partial1, ignoreCase)}`;
+        const locator = scope.locator(query);
+        const count = await locator.count();
+        if (!tag1) {
+            tag1 = "*";
+        }
+        const randomToken = Math.random().toString(36).substring(7);
+        let tagCount = 0;
+        for (let i = 0; i < count; i++) {
+            const element = locator.nth(i);
+            // check if the tag matches
+            if (!(await element.evaluate((el, [tag, randomToken]) => {
+                if (!tag.startsWith("*")) {
+                    if (el.tagName.toLowerCase() !== tag) {
+                        return false;
                     }
-                    let element = elements[i];
-                    element.setAttribute("data-blinq-id", "blinq-id-" + randomToken);
-                    elementCount++;
                 }
+                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]))) {
+                continue;
             }
-            return { elementCount: elementCount, randomToken: randomToken };
-        }, [text1, tag1, regex1, partial1]);
+            tagCount++;
+        }
+        return { elementCount: tagCount, randomToken };
     }
-    async _collectLocatorInformation(selectorHierarchy, index = 0, scope, foundLocators, _params, info, visibleOnly = true) {
+    async _collectLocatorInformation(selectorHierarchy, index = 0, scope, foundLocators, _params, info, visibleOnly = true, allowDisabled = false, element_name = null) {
         if (!info) {
             info = {};
         }
@@ -363,30 +414,31 @@ class StableBrowser {
         //info.log += "searching for locator " + JSON.stringify(locatorSearch) + "\n";
         let locator = null;
         if (locatorSearch.climb && locatorSearch.climb >= 0) {
-            let locatorString = await this._locateElmentByTextClimbCss(scope, locatorSearch.text, locatorSearch.climb, locatorSearch.css, _params);
+            const replacedText = await this._replaceWithLocalData(locatorSearch.text, this.world);
+            let locatorString = await this._locateElmentByTextClimbCss(scope, replacedText, locatorSearch.climb, locatorSearch.css, _params);
             if (!locatorString) {
                 info.failCause.textNotFound = true;
-                info.failCause.lastError = "failed to locate element by text: " + locatorSearch.text;
+                info.failCause.lastError = `failed to locate ${formatElementName(element_name)} by text: ${locatorSearch.text}`;
                 return;
             }
-            locator = this._getLocator({ css: locatorString }, scope, _params);
+            locator = await this._getLocator({ css: locatorString }, scope, _params);
         }
         else if (locatorSearch.text) {
             let text = _fixUsingParams(locatorSearch.text, _params);
-            let result = await this._locateElementByText(scope, text, locatorSearch.tag, false, locatorSearch.partial === true, _params);
+            let result = await this._locateElementByText(scope, text, locatorSearch.tag, false, locatorSearch.partial === true, true, _params);
             if (result.elementCount === 0) {
                 info.failCause.textNotFound = true;
-                info.failCause.lastError = "failed to locate element by text: " + text;
+                info.failCause.lastError = `failed to locate ${formatElementName(element_name)} by text: ${text}`;
                 return;
             }
-            locatorSearch.css = "[data-blinq-id='blinq-id-" + result.randomToken + "']";
+            locatorSearch.css = "[data-blinq-id-" + result.randomToken + "]";
             if (locatorSearch.childCss) {
                 locatorSearch.css = locatorSearch.css + " " + locatorSearch.childCss;
             }
-            locator = this._getLocator(locatorSearch, scope, _params);
+            locator = await this._getLocator(locatorSearch, scope, _params);
         }
         else {
-            locator = this._getLocator(locatorSearch, scope, _params);
+            locator = await this._getLocator(locatorSearch, scope, _params);
         }
         // let cssHref = false;
         // if (locatorSearch.css && locatorSearch.css.includes("href=")) {
@@ -415,7 +467,7 @@ class StableBrowser {
             if (!visibleOnly) {
                 visible = true;
             }
-            if (visible && enabled) {
+            if (visible && (allowDisabled || enabled)) {
                 foundLocators.push(locator.nth(j));
                 if (info.locatorLog) {
                     info.locatorLog.setLocatorSearchStatus(originalLocatorSearch, "FOUND");
@@ -428,9 +480,11 @@ class StableBrowser {
                     info.printMessages = {};
                 }
                 if (info.locatorLog && !visible) {
+                    info.failCause.lastError = `${formatElementName(element_name)} is not visible, searching for ${originalLocatorSearch}`;
                     info.locatorLog.setLocatorSearchStatus(originalLocatorSearch, "FOUND_NOT_VISIBLE");
                 }
                 if (info.locatorLog && !enabled) {
+                    info.failCause.lastError = `${formatElementName(element_name)} is disabled, searching for ${originalLocatorSearch}`;
                     info.locatorLog.setLocatorSearchStatus(originalLocatorSearch, "FOUND_NOT_ENABLED");
                 }
                 if (!info.printMessages[j.toString()]) {
@@ -498,7 +552,7 @@ class StableBrowser {
         }
         return { rerun: false };
     }
-    async _locate(selectors, info, _params, timeout) {
+    async _locate(selectors, info, _params, timeout, allowDisabled = false) {
         if (!timeout) {
             timeout = 30000;
         }
@@ -508,9 +562,30 @@ class StableBrowser {
                 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);
+            let element = await this._locate_internal(selectors, info, _params, timeout, allowDisabled);
             if (!element.rerun) {
-                return element;
+                const randomToken = Math.random().toString(36).substring(7);
+                element.evaluate((el, randomToken) => {
+                    el.setAttribute("data-blinq-id-" + randomToken, "");
+                }, randomToken);
+                // if (element._frame) {
+                //   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";
+                }
+                // if (element?._frame?._selector) {
+                //   prefixSelector = element._frame._selector + " >> " + prefixSelector;
+                // }
+                const newSelector = prefixSelector + newElementSelector;
+                return scope.locator(newSelector);
             }
         }
         throw new Error("unable to locate element " + JSON.stringify(selectors));
@@ -583,7 +658,7 @@ class StableBrowser {
                     //info.log += "unable to locate iframe " + selectors.iframe_src + "\n";
                     if (Date.now() - startTime > timeout) {
                         info.failCause.iframeNotFound = true;
-                        info.failCause.lastError = "unable to locate iframe " + selectors.iframe_src;
+                        info.failCause.lastError = `unable to locate iframe "${selectors.iframe_src}"`;
                         throw new Error("unable to locate iframe " + selectors.iframe_src);
                     }
                     await new Promise((resolve) => setTimeout(resolve, 1000));
@@ -608,7 +683,7 @@ class StableBrowser {
             return bodyContent;
         });
     }
-    async _locate_internal(selectors, info, _params, timeout = 30000) {
+    async _locate_internal(selectors, info, _params, timeout = 30000, allowDisabled = false) {
         if (!info) {
             info = {};
             info.failCause = {};
@@ -657,17 +732,17 @@ class StableBrowser {
             }
             // info.log += "scanning locators in priority 1" + "\n";
             let onlyPriority3 = selectorsLocators[0].priority === 3;
-            result = await this._scanLocatorsGroup(locatorsByPriority["1"], scope, _params, info, visibleOnly);
+            result = await this._scanLocatorsGroup(locatorsByPriority["1"], scope, _params, info, visibleOnly, allowDisabled, selectors?.element_name);
             if (result.foundElements.length === 0) {
                 // info.log += "scanning locators in priority 2" + "\n";
-                result = await this._scanLocatorsGroup(locatorsByPriority["2"], scope, _params, info, visibleOnly);
+                result = await this._scanLocatorsGroup(locatorsByPriority["2"], scope, _params, info, visibleOnly, allowDisabled, selectors?.element_name);
             }
             if (result.foundElements.length === 0 && onlyPriority3) {
-                result = await this._scanLocatorsGroup(locatorsByPriority["3"], scope, _params, info, visibleOnly);
+                result = await this._scanLocatorsGroup(locatorsByPriority["3"], scope, _params, info, visibleOnly, allowDisabled, selectors?.element_name);
             }
             else {
                 if (result.foundElements.length === 0 && !highPriorityOnly) {
-                    result = await this._scanLocatorsGroup(locatorsByPriority["3"], scope, _params, info, visibleOnly);
+                    result = await this._scanLocatorsGroup(locatorsByPriority["3"], scope, _params, info, visibleOnly, allowDisabled, selectors?.element_name);
                 }
             }
             let foundElements = result.foundElements;
@@ -712,7 +787,7 @@ class StableBrowser {
                 break;
             }
             if (Date.now() - startTime > highPriorityTimeout) {
-                info.log += "high priority timeout, will try all elements" + "\n";
+                //info.log += "high priority timeout, will try all elements" + "\n";
                 highPriorityOnly = false;
                 if (this.configuration && this.configuration.load_all_lazy === true && !lazy_scroll) {
                     lazy_scroll = true;
@@ -720,7 +795,7 @@ class StableBrowser {
                 }
             }
             if (Date.now() - startTime > visibleOnlyTimeout) {
-                info.log += "visible only timeout, will try all elements" + "\n";
+                //info.log += "visible only timeout, will try all elements" + "\n";
                 visibleOnly = false;
             }
             await new Promise((resolve) => setTimeout(resolve, 1000));
@@ -734,10 +809,12 @@ class StableBrowser {
         // }
         //info.log += "failed to locate unique element, total elements found " + locatorsCount + "\n";
         info.failCause.locatorNotFound = true;
-        info.failCause.lastError = "failed to locate unique element";
+        if (!info?.failCause?.lastError) {
+            info.failCause.lastError = `failed to locate ${formatElementName(selectors.element_name)}, ${locatorsCount > 0 ? `${locatorsCount} matching elements found` : "no matching elements found"}`;
+        }
         throw new Error("failed to locate first element no elements found, " + info.log);
     }
-    async _scanLocatorsGroup(locatorsGroup, scope, _params, info, visibleOnly) {
+    async _scanLocatorsGroup(locatorsGroup, scope, _params, info, visibleOnly, allowDisabled = false, element_name) {
         let foundElements = [];
         const result = {
             foundElements: foundElements,
@@ -745,7 +822,7 @@ class StableBrowser {
         for (let i = 0; i < locatorsGroup.length; i++) {
             let foundLocators = [];
             try {
-                await this._collectLocatorInformation(locatorsGroup, i, scope, foundLocators, _params, info, visibleOnly);
+                await this._collectLocatorInformation(locatorsGroup, i, scope, foundLocators, _params, info, visibleOnly, allowDisabled, element_name);
             }
             catch (e) {
                 // this call can fail it the browser is navigating
@@ -753,7 +830,7 @@ class StableBrowser {
                 // this.logger.debug(e);
                 foundLocators = [];
                 try {
-                    await this._collectLocatorInformation(locatorsGroup, i, this.page, foundLocators, _params, info, visibleOnly);
+                    await this._collectLocatorInformation(locatorsGroup, i, this.page, foundLocators, _params, info, visibleOnly, allowDisabled, element_name);
                 }
                 catch (e) {
                     this.logger.info("unable to use locator (second try) " + JSON.stringify(locatorsGroup[i]));
@@ -768,9 +845,40 @@ class StableBrowser {
                 result.locatorIndex = i;
             }
             if (foundLocators.length > 1) {
-                info.failCause.foundMultiple = true;
-                if (info.locatorLog) {
-                    info.locatorLog.setLocatorSearchStatus(locatorsGroup[i], "FOUND_NOT_UNIQUE");
+                // remove elements that consume the same space with 10 pixels tolerance
+                const boxes = [];
+                for (let j = 0; j < foundLocators.length; j++) {
+                    boxes.push({ box: await foundLocators[j].boundingBox(), locator: foundLocators[j] });
+                }
+                for (let j = 0; j < boxes.length; j++) {
+                    for (let k = 0; k < boxes.length; k++) {
+                        if (j === k) {
+                            continue;
+                        }
+                        // check if x, y, width, height are the same with 10 pixels tolerance
+                        if (Math.abs(boxes[j].box.x - boxes[k].box.x) < 10 &&
+                            Math.abs(boxes[j].box.y - boxes[k].box.y) < 10 &&
+                            Math.abs(boxes[j].box.width - boxes[k].box.width) < 10 &&
+                            Math.abs(boxes[j].box.height - boxes[k].box.height) < 10) {
+                            // as the element is not unique, will remove it
+                            boxes.splice(k, 1);
+                            k--;
+                        }
+                    }
+                }
+                if (boxes.length === 1) {
+                    result.foundElements.push({
+                        locator: boxes[0].locator.first(),
+                        box: boxes[0].box,
+                        unique: true,
+                    });
+                    result.locatorIndex = i;
+                }
+                else {
+                    info.failCause.foundMultiple = true;
+                    if (info.locatorLog) {
+                        info.locatorLog.setLocatorSearchStatus(JSON.stringify(locatorsGroup[i]), "FOUND_NOT_UNIQUE");
+                    }
                 }
             }
         }
@@ -881,25 +989,14 @@ class StableBrowser {
             options,
             world,
             text: "Click element",
+            _text: "Click on " + selectors.element_name,
             type: Types.CLICK,
             operation: "click",
             log: "***** click on " + selectors.element_name + " *****\n",
         };
         try {
             await _preCommand(state, this);
-            if (state.options && state.options.context) {
-                state.selectors.locators[0].text = state.options.context;
-            }
-            try {
-                await state.element.click();
-                // await new Promise((resolve) => setTimeout(resolve, 1000));
-            }
-            catch (e) {
-                // await this.closeUnexpectedPopups();
-                state.element = await this._locate(selectors, state.info, _params);
-                await state.element.dispatchEvent("click");
-                // await new Promise((resolve) => setTimeout(resolve, 1000));
-            }
+            await performAction("click", state.element, options, this, state, _params);
             await this.waitForPageLoad();
             return state.info;
         }
@@ -910,6 +1007,38 @@ class StableBrowser {
             _commandFinally(state, this);
         }
     }
+    async waitForElement(selectors, _params, options = {}, world = null) {
+        const timeout = this._getFindElementTimeout(options);
+        const state = {
+            selectors,
+            _params,
+            options,
+            world,
+            text: "Wait for element",
+            _text: "Wait for " + selectors.element_name,
+            type: Types.WAIT_ELEMENT,
+            operation: "waitForElement",
+            log: "***** wait for " + selectors.element_name + " *****\n",
+        };
+        let found = false;
+        try {
+            await _preCommand(state, this);
+            // if (state.options && state.options.context) {
+            //   state.selectors.locators[0].text = state.options.context;
+            // }
+            await state.element.waitFor({ timeout: timeout });
+            found = true;
+            // await new Promise((resolve) => setTimeout(resolve, 1000));
+        }
+        catch (e) {
+            console.error("Error on waitForElement", e);
+            // await _commandError(state, e, this);
+        }
+        finally {
+            _commandFinally(state, this);
+        }
+        return found;
+    }
     async setCheck(selectors, checked = true, _params, options = {}, world = null) {
         const state = {
             selectors,
@@ -918,6 +1047,7 @@ class StableBrowser {
             world,
             type: checked ? Types.CHECK : Types.UNCHECK,
             text: checked ? `Check element` : `Uncheck element`,
+            _text: checked ? `Check ${selectors.element_name}` : `Uncheck ${selectors.element_name}`,
             operation: "setCheck",
             log: "***** check " + selectors.element_name + " *****\n",
         };
@@ -927,9 +1057,15 @@ class StableBrowser {
             // let element = await this._locate(selectors, info, _params);
             // ({ screenshotId, screenshotPath } = await this._screenShot(options, world, info));
             try {
-                // await this._highlightElements(element);
+                // if (world && world.screenshot && !world.screenshotPath) {
+                // console.log(`Highlighting while running from recorder`);
+                await this._highlightElements(state.element);
                 await state.element.setChecked(checked);
                 await new Promise((resolve) => setTimeout(resolve, 1000));
+                // await this._unHighlightElements(element);
+                // }
+                // await new Promise((resolve) => setTimeout(resolve, 1000));
+                //  await this._unHighlightElements(element);
             }
             catch (e) {
                 if (e.message && e.message.includes("did not change its state")) {
@@ -961,22 +1097,13 @@ class StableBrowser {
             world,
             type: Types.HOVER,
             text: `Hover element`,
+            _text: `Hover on ${selectors.element_name}`,
             operation: "hover",
             log: "***** hover " + selectors.element_name + " *****\n",
         };
         try {
             await _preCommand(state, this);
-            try {
-                await state.element.hover();
-                await new Promise((resolve) => setTimeout(resolve, 1000));
-            }
-            catch (e) {
-                //await this.closeUnexpectedPopups();
-                state.info.log += "hover failed, will try again" + "\n";
-                state.element = await this._locate(selectors, state.info, _params);
-                await state.element.hover({ timeout: 10000 });
-                await new Promise((resolve) => setTimeout(resolve, 1000));
-            }
+            await performAction("hover", state.element, options, this, state, _params);
             await _screenshot(state, this);
             await this.waitForPageLoad();
             return state.info;
@@ -1000,6 +1127,7 @@ class StableBrowser {
             value: values.toString(),
             type: Types.SELECT,
             text: `Select option: ${values}`,
+            _text: `Select option: ${values} on ${selectors.element_name}`,
             operation: "selectOption",
             log: "***** select option " + selectors.element_name + " *****\n",
         };
@@ -1034,6 +1162,7 @@ class StableBrowser {
             highlight: false,
             type: Types.TYPE_PRESS,
             text: `Type value: ${_value}`,
+            _text: `Type value: ${_value}`,
             operation: "type",
             log: "",
         };
@@ -1113,6 +1242,7 @@ class StableBrowser {
             world,
             type: Types.SET_DATE_TIME,
             text: `Set date time value: ${value}`,
+            _text: `Set date time value: ${value} on ${selectors.element_name}`,
             operation: "setDateTime",
             log: "***** set date time value " + selectors.element_name + " *****\n",
             throwError: false,
@@ -1120,7 +1250,7 @@ class StableBrowser {
         try {
             await _preCommand(state, this);
             try {
-                await state.element.click();
+                await performAction("click", state.element, options, this, state, _params);
                 await new Promise((resolve) => setTimeout(resolve, 500));
                 if (format) {
                     state.value = dayjs(state.value).format(format);
@@ -1184,9 +1314,13 @@ class StableBrowser {
             world,
             type: Types.FILL,
             text: `Click type input with value: ${_value}`,
+            _text: "Fill " + selectors.element_name + " with value " + maskValue(_value),
             operation: "clickType",
             log: "***** clickType on " + selectors.element_name + " with value " + maskValue(_value) + "*****\n",
         };
+        if (!options) {
+            options = {};
+        }
         if (newValue !== _value) {
             //this.logger.info(_value + "=" + newValue);
             _value = newValue;
@@ -1194,7 +1328,7 @@ class StableBrowser {
         try {
             await _preCommand(state, this);
             state.info.value = _value;
-            if (options === null || options === undefined || !options.press) {
+            if (!options.press) {
                 try {
                     let currentValue = await state.element.inputValue();
                     if (currentValue) {
@@ -1205,13 +1339,9 @@ class StableBrowser {
                     this.logger.info("unable to clear input value");
                 }
             }
-            if (options === null || options === undefined || options.press) {
-                try {
-                    await state.element.click({ timeout: 5000 });
-                }
-                catch (e) {
-                    await state.element.dispatchEvent("click");
-                }
+            if (options.press) {
+                options.timeout = 5000;
+                await performAction("click", state.element, options, this, state, _params);
             }
             else {
                 try {
@@ -1249,7 +1379,12 @@ class StableBrowser {
                 await this.waitForPageLoad();
             }
             else if (enter === false) {
-                await state.element.dispatchEvent("change");
+                try {
+                    await state.element.dispatchEvent("change", null, { timeout: 5000 });
+                }
+                catch (e) {
+                    // ignore
+                }
                 //await this.page.keyboard.press("Tab");
             }
             else {
@@ -1301,6 +1436,7 @@ class StableBrowser {
         return await this._getText(selectors, 0, _params, options, info, world);
     }
     async _getText(selectors, climb, _params = null, options = {}, info = {}, world = null) {
+        const timeout = this._getFindElementTimeout(options);
         _validateSelectors(selectors);
         let screenshotId = null;
         let screenshotPath = null;
@@ -1310,7 +1446,7 @@ class StableBrowser {
         }
         info.operation = "getText";
         info.selectors = selectors;
-        let element = await this._locate(selectors, info, _params);
+        let element = await this._locate(selectors, info, _params, timeout);
         if (climb > 0) {
             const climbArray = [];
             for (let i = 0; i < climb; i++) {
@@ -1329,6 +1465,18 @@ class StableBrowser {
         ({ screenshotId, screenshotPath } = await this._screenShot(options, world, info));
         try {
             await this._highlightElements(element);
+            // if (world && world.screenshot && !world.screenshotPath) {
+            //   // console.log(`Highlighting for get text while running from recorder`);
+            //   this._highlightElements(element)
+            //     .then(async () => {
+            //       await new Promise((resolve) => setTimeout(resolve, 1000));
+            //       this._unhighlightElements(element).then(
+            //         () => {}
+            //         // console.log(`Unhighlighting vrtr in recorder is successful`)
+            //       );
+            //     })
+            //     .catch(e);
+            // }
             const elementText = await element.innerText();
             return {
                 text: elementText,
@@ -1340,7 +1488,7 @@ class StableBrowser {
         }
         catch (e) {
             //await this.closeUnexpectedPopups();
-            this.logger.info("no innerText will use textContent");
+            this.logger.info("no innerText, will use textContent");
             const elementText = await element.textContent();
             return { text: elementText, screenshotId, screenshotPath, value: value };
         }
@@ -1365,6 +1513,7 @@ class StableBrowser {
             highlight: false,
             type: Types.VERIFY_ELEMENT_CONTAINS_TEXT,
             text: `Verify element contains pattern: ${pattern}`,
+            _text: "Verify element " + selectors.element_name + " contains pattern " + pattern,
             operation: "containsPattern",
             log: "***** verify element " + selectors.element_name + " contains pattern " + pattern + " *****\n",
         };
@@ -1400,6 +1549,8 @@ class StableBrowser {
         }
     }
     async containsText(selectors, text, climb, _params = null, options = {}, world = null) {
+        const timeout = this._getFindElementTimeout(options);
+        const startTime = Date.now();
         const state = {
             selectors,
             _params,
@@ -1426,62 +1577,54 @@ class StableBrowser {
         }
         let foundObj = null;
         try {
-            await _preCommand(state, this);
-            foundObj = await this._getText(selectors, climb, _params, options, state.info, world);
-            if (foundObj && foundObj.element) {
-                await this.scrollIfNeeded(foundObj.element, state.info);
-            }
-            await _screenshot(state, this);
-            const dateAlternatives = findDateAlternatives(text);
-            const numberAlternatives = findNumberAlternatives(text);
-            if (dateAlternatives.date) {
-                for (let i = 0; i < dateAlternatives.dates.length; i++) {
-                    if (foundObj?.text.includes(dateAlternatives.dates[i]) ||
-                        foundObj?.value?.includes(dateAlternatives.dates[i])) {
-                        return state.info;
+            while (Date.now() - startTime < timeout) {
+                try {
+                    await _preCommand(state, this);
+                    foundObj = await this._getText(selectors, climb, _params, { timeout: 2000 }, state.info, world);
+                    if (foundObj && foundObj.element) {
+                        await this.scrollIfNeeded(foundObj.element, state.info);
                     }
-                }
-                throw new Error("element doesn't contain text " + text);
-            }
-            else if (numberAlternatives.number) {
-                for (let i = 0; i < numberAlternatives.numbers.length; i++) {
-                    if (foundObj?.text.includes(numberAlternatives.numbers[i]) ||
-                        foundObj?.value?.includes(numberAlternatives.numbers[i])) {
+                    await _screenshot(state, this);
+                    const dateAlternatives = findDateAlternatives(text);
+                    const numberAlternatives = findNumberAlternatives(text);
+                    if (dateAlternatives.date) {
+                        for (let i = 0; i < dateAlternatives.dates.length; i++) {
+                            if (foundObj?.text.includes(dateAlternatives.dates[i]) ||
+                                foundObj?.value?.includes(dateAlternatives.dates[i])) {
+                                return state.info;
+                            }
+                        }
+                    }
+                    else if (numberAlternatives.number) {
+                        for (let i = 0; i < numberAlternatives.numbers.length; i++) {
+                            if (foundObj?.text.includes(numberAlternatives.numbers[i]) ||
+                                foundObj?.value?.includes(numberAlternatives.numbers[i])) {
+                                return state.info;
+                            }
+                        }
+                    }
+                    else if (foundObj?.text.includes(text) || foundObj?.value?.includes(text)) {
                         return state.info;
                     }
                 }
-                throw new Error("element doesn't contain text " + text);
-            }
-            else if (!foundObj?.text.includes(text) && !foundObj?.value?.includes(text)) {
-                state.info.foundText = foundObj?.text;
-                state.info.value = foundObj?.value;
-                throw new Error("element doesn't contain text " + text);
+                catch (e) {
+                    // Log error but continue retrying until timeout is reached
+                    this.logger.warn("Retrying containsText due to: " + e.message);
+                }
+                await new Promise((resolve) => setTimeout(resolve, 1000)); // Wait 1 second before retrying
             }
-            return state.info;
+            state.info.foundText = foundObj?.text;
+            state.info.value = foundObj?.value;
+            throw new Error("element doesn't contain text " + text);
         }
         catch (e) {
             await _commandError(state, e, this);
+            throw e;
         }
         finally {
             _commandFinally(state, this);
         }
     }
-    _getDataFile(world = null) {
-        let dataFile = null;
-        if (world && world.reportFolder) {
-            dataFile = path.join(world.reportFolder, "data.json");
-        }
-        else if (this.reportFolder) {
-            dataFile = path.join(this.reportFolder, "data.json");
-        }
-        else if (this.context && this.context.reportFolder) {
-            dataFile = path.join(this.context.reportFolder, "data.json");
-        }
-        else {
-            dataFile = "data.json";
-        }
-        return dataFile;
-    }
     async waitForUserInput(message, world = null) {
         if (!message) {
             message = "# Wait for user input. Press any key to continue";
@@ -1510,13 +1653,22 @@ class StableBrowser {
             return;
         }
         // if data file exists, load it
-        const dataFile = this._getDataFile(world);
+        const dataFile = _getDataFile(world, this.context, this);
         let data = this.getTestData(world);
         // merge the testData with the existing data
         Object.assign(data, testData);
         // save the data to the file
         fs.writeFileSync(dataFile, JSON.stringify(data, null, 2));
     }
+    overwriteTestData(testData, world = null) {
+        if (!testData) {
+            return;
+        }
+        // if data file exists, load it
+        const dataFile = _getDataFile(world, this.context, this);
+        // save the data to the file
+        fs.writeFileSync(dataFile, JSON.stringify(testData, null, 2));
+    }
     _getDataFilePath(fileName) {
         let dataFile = path.join(this.project_path, "data", fileName);
         if (fs.existsSync(dataFile)) {
@@ -1613,7 +1765,7 @@ class StableBrowser {
         }
     }
     getTestData(world = null) {
-        const dataFile = this._getDataFile(world);
+        const dataFile = _getDataFile(world, this.context, this);
         let data = {};
         if (fs.existsSync(dataFile)) {
             data = JSON.parse(fs.readFileSync(dataFile, "utf8"));
@@ -1700,6 +1852,15 @@ class StableBrowser {
             document.documentElement.clientWidth,
         ])));
         let screenshotBuffer = null;
+        // if (focusedElement) {
+        //   // console.log(`Focused element ${JSON.stringify(focusedElement._selector)}`)
+        //   await this._unhighlightElements(focusedElement);
+        //   await new Promise((resolve) => setTimeout(resolve, 100));
+        //   console.log(`Unhighlighted previous element`);
+        // }
+        // if (focusedElement) {
+        //   await this._highlightElements(focusedElement);
+        // }
         if (this.context.browserName === "chromium") {
             const client = await playContext.newCDPSession(this.page);
             const { data } = await client.send("Page.captureScreenshot", {
@@ -1721,6 +1882,10 @@ class StableBrowser {
         else {
             screenshotBuffer = await this.page.screenshot();
         }
+        // if (focusedElement) {
+        //   // console.log(`Focused element ${JSON.stringify(focusedElement._selector)}`)
+        //   await this._unhighlightElements(focusedElement);
+        // }
         let image = await Jimp.read(screenshotBuffer);
         // Get the image dimensions
         const { width, height } = image.bitmap;
@@ -1733,6 +1898,7 @@ class StableBrowser {
         else {
             fs.writeFileSync(screenshotPath, screenshotBuffer);
         }
+        return screenshotBuffer;
     }
     async verifyElementExistInPage(selectors, _params = null, options = {}, world = null) {
         const state = {
@@ -1768,8 +1934,10 @@ class StableBrowser {
             world,
             type: Types.EXTRACT,
             text: `Extract attribute from element`,
+            _text: `Extract attribute ${attribute} from ${selectors.element_name}`,
             operation: "extractAttribute",
             log: "***** extract attribute " + attribute + " from " + selectors.element_name + " *****\n",
+            allowDisabled: true,
         };
         await new Promise((resolve) => setTimeout(resolve, 2000));
         try {
@@ -1791,6 +1959,7 @@ class StableBrowser {
             state.info.value = state.value;
             this.setTestData({ [variable]: state.value }, world);
             this.logger.info("set test data: " + variable + "=" + state.value);
+            // await new Promise((resolve) => setTimeout(resolve, 500));
             return state.info;
         }
         catch (e) {
@@ -1809,14 +1978,21 @@ class StableBrowser {
             options,
             world,
             type: Types.VERIFY_ATTRIBUTE,
+            highlight: true,
+            screenshot: true,
             text: `Verify element attribute`,
+            _text: `Verify attribute ${attribute} from ${selectors.element_name} is ${value}`,
             operation: "verifyAttribute",
             log: "***** verify attribute " + attribute + " from " + selectors.element_name + " *****\n",
+            allowDisabled: true,
         };
         await new Promise((resolve) => setTimeout(resolve, 2000));
         let val;
+        let expectedValue;
         try {
             await _preCommand(state, this);
+            expectedValue = state.value;
+            state.info.expectedValue = expectedValue;
             switch (attribute) {
                 case "innerText":
                     val = String(await state.element.innerText());
@@ -1830,23 +2006,30 @@ class StableBrowser {
                 case "disabled":
                     val = String(await state.element.isDisabled());
                     break;
+                case "readOnly":
+                    const isEditable = await state.element.isEditable();
+                    val = String(!isEditable);
+                    break;
                 default:
                     val = String(await state.element.getAttribute(attribute));
                     break;
             }
+            state.info.value = val;
             let regex;
-            if (value.startsWith("/") && value.endsWith("/")) {
-                const patternBody = value.slice(1, -1);
+            if (expectedValue.startsWith("/") && expectedValue.endsWith("/")) {
+                const patternBody = expectedValue.slice(1, -1);
                 regex = new RegExp(patternBody, "g");
             }
             else {
-                const escapedPattern = value.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+                const escapedPattern = expectedValue.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
                 regex = new RegExp(escapedPattern, "g");
             }
             if (!val.match(regex)) {
-                throw new Error(`The ${attribute} attribute has a value of "${val}", but the expected value is "${value}"`);
+                let errorMessage = `The ${attribute} attribute 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;
             return state.info;
         }
         catch (e) {
@@ -1945,27 +2128,32 @@ class StableBrowser {
     async _highlightElements(scope, css) {
         try {
             if (!scope) {
+                // console.log(`Scope is not defined`);
                 return;
             }
             if (!css) {
                 scope
                     .evaluate((node) => {
                     if (node && node.style) {
-                        let originalBorder = node.style.border;
-                        node.style.border = "2px solid red";
+                        let originalOutline = node.style.outline;
+                        // console.log(`Original outline was: ${originalOutline}`);
+                        // node.__previousOutline = originalOutline;
+                        node.style.outline = "2px solid red";
+                        // console.log(`New outline is: ${node.style.outline}`);
                         if (window) {
                             window.addEventListener("beforeunload", function (e) {
-                                node.style.border = originalBorder;
+                                node.style.outline = originalOutline;
                             });
                         }
                         setTimeout(function () {
-                            node.style.border = originalBorder;
+                            node.style.outline = originalOutline;
                         }, 2000);
                     }
                 })
                     .then(() => { })
                     .catch((e) => {
                     // ignore
+                    // console.error(`Could not highlight node : ${e}`);
                 });
             }
             else {
@@ -1981,17 +2169,18 @@ class StableBrowser {
                         if (!element.style) {
                             return;
                         }
-                        var originalBorder = element.style.border;
+                        let originalOutline = element.style.outline;
+                        element.__previousOutline = originalOutline;
                         // Set the new border to be red and 2px solid
-                        element.style.border = "2px solid red";
+                        element.style.outline = "2px solid red";
                         if (window) {
                             window.addEventListener("beforeunload", function (e) {
-                                element.style.border = originalBorder;
+                                element.style.outline = originalOutline;
                             });
                         }
                         // Set a timeout to revert to the original border after 2 seconds
                         setTimeout(function () {
-                            element.style.border = originalBorder;
+                            element.style.outline = originalOutline;
                         }, 2000);
                     }
                     return;
@@ -1999,6 +2188,7 @@ class StableBrowser {
                     .then(() => { })
                     .catch((e) => {
                     // ignore
+                    // console.error(`Could not highlight css: ${e}`);
                 });
             }
         }
@@ -2006,6 +2196,54 @@ class StableBrowser {
             console.debug(error);
         }
     }
+    // async _unhighlightElements(scope, css) {
+    //   try {
+    //     if (!scope) {
+    //       return;
+    //     }
+    //     if (!css) {
+    //       scope
+    //         .evaluate((node) => {
+    //           if (node && node.style) {
+    //             if (!node.__previousOutline) {
+    //               node.style.outline = "";
+    //             } else {
+    //               node.style.outline = node.__previousOutline;
+    //             }
+    //           }
+    //         })
+    //         .then(() => {})
+    //         .catch((e) => {
+    //           // console.log(`Error while unhighlighting node ${JSON.stringify(scope)}: ${e}`);
+    //         });
+    //     } else {
+    //       scope
+    //         .evaluate(([css]) => {
+    //           if (!css) {
+    //             return;
+    //           }
+    //           let elements = Array.from(document.querySelectorAll(css));
+    //           for (i = 0; i < elements.length; i++) {
+    //             let element = elements[i];
+    //             if (!element.style) {
+    //               return;
+    //             }
+    //             if (!element.__previousOutline) {
+    //               element.style.outline = "";
+    //             } else {
+    //               element.style.outline = element.__previousOutline;
+    //             }
+    //           }
+    //         })
+    //         .then(() => {})
+    //         .catch((e) => {
+    //           // console.error(`Error while unhighlighting element in css: ${e}`);
+    //         });
+    //     }
+    //   } catch (error) {
+    //     // console.debug(error);
+    //   }
+    // }
     async verifyPagePath(pathPart, options = {}, world = null) {
         const startTime = Date.now();
         let error = null;
@@ -2050,6 +2288,7 @@ class StableBrowser {
             _reportToWorld(world, {
                 type: Types.VERIFY_PAGE_PATH,
                 text: "Verify page path",
+                _text: "Verify the page path contains " + pathPart,
                 screenshotId,
                 result: error
                     ? {
@@ -2067,26 +2306,27 @@ class StableBrowser {
             });
         }
     }
-    async findTextInAllFrames(dateAlternatives, numberAlternatives, text, state) {
+    async findTextInAllFrames(dateAlternatives, numberAlternatives, text, state, partial = true, ignoreCase = false) {
         const frames = this.page.frames();
         let results = [];
+        // let ignoreCase = false;
         for (let i = 0; i < frames.length; i++) {
             if (dateAlternatives.date) {
                 for (let j = 0; j < dateAlternatives.dates.length; j++) {
-                    const result = await this._locateElementByText(frames[i], dateAlternatives.dates[j], "*:not(script, style, head)", false, true, {});
+                    const result = await this._locateElementByText(frames[i], dateAlternatives.dates[j], "*:not(script, style, head)", false, partial, ignoreCase, {});
                     result.frame = frames[i];
                     results.push(result);
                 }
             }
             else if (numberAlternatives.number) {
                 for (let j = 0; j < numberAlternatives.numbers.length; j++) {
-                    const result = await this._locateElementByText(frames[i], numberAlternatives.numbers[j], "*:not(script, style, head)", false, true, {});
+                    const result = await this._locateElementByText(frames[i], numberAlternatives.numbers[j], "*:not(script, style, head)", false, partial, ignoreCase, {});
                     result.frame = frames[i];
                     results.push(result);
                 }
             }
             else {
-                const result = await this._locateElementByText(frames[i], text, "*:not(script, style, head)", false, true, {});
+                const result = await this._locateElementByText(frames[i], text, "*:not(script, style, head)", false, partial, ignoreCase, {});
                 result.frame = frames[i];
                 results.push(result);
             }
@@ -2105,11 +2345,15 @@ class StableBrowser {
             scroll: false,
             highlight: false,
             type: Types.VERIFY_PAGE_CONTAINS_TEXT,
-            text: `Verify text exists in page`,
+            text: `Verify the text '${text}' exists in page`,
+            _text: `Verify the text '${text}' exists in page`,
             operation: "verifyTextExistInPage",
             log: "***** verify text " + text + " exists in page *****\n",
         };
-        const timeout = this._getLoadTimeout(options);
+        if (testForRegex(text)) {
+            text = text.replace(/\\"/g, '"');
+        }
+        const timeout = this._getFindElementTimeout(options);
         await new Promise((resolve) => setTimeout(resolve, 2000));
         const newValue = await this._replaceWithLocalData(text, world);
         if (newValue !== text) {
@@ -2122,7 +2366,15 @@ class StableBrowser {
             await _preCommand(state, this);
             state.info.text = text;
             while (true) {
-                const resultWithElementsFound = await this.findTextInAllFrames(dateAlternatives, numberAlternatives, text, state);
+                let resultWithElementsFound = {
+                    length: 0,
+                };
+                try {
+                    resultWithElementsFound = await this.findTextInAllFrames(dateAlternatives, numberAlternatives, text, state);
+                }
+                catch (error) {
+                    // ignore
+                }
                 if (resultWithElementsFound.length === 0) {
                     if (Date.now() - state.startTime > timeout) {
                         throw new Error(`Text ${text} not found in page`);
@@ -2130,18 +2382,40 @@ class StableBrowser {
                     await new Promise((resolve) => setTimeout(resolve, 1000));
                     continue;
                 }
-                if (resultWithElementsFound[0].randomToken) {
-                    const frame = resultWithElementsFound[0].frame;
-                    const dataAttribute = `[data-blinq-id="blinq-id-${resultWithElementsFound[0].randomToken}"]`;
-                    await this._highlightElements(frame, dataAttribute);
-                    const element = await frame.$(dataAttribute);
-                    if (element) {
-                        await this.scrollIfNeeded(element, state.info);
-                        await element.dispatchEvent("bvt_verify_page_contains_text");
+                try {
+                    if (resultWithElementsFound[0].randomToken) {
+                        const frame = resultWithElementsFound[0].frame;
+                        const dataAttribute = `[data-blinq-id-${resultWithElementsFound[0].randomToken}]`;
+                        await this._highlightElements(frame, dataAttribute);
+                        // if (world && world.screenshot && !world.screenshotPath) {
+                        // console.log(`Highlighting for verify text is found while running from recorder`);
+                        // this._highlightElements(frame, dataAttribute).then(async () => {
+                        // await new Promise((resolve) => setTimeout(resolve, 1000));
+                        // this._unhighlightElements(frame, dataAttribute)
+                        // .then(async () => {
+                        // console.log(`Unhighlighted frame dataAttribute successfully`);
+                        // })
+                        // .catch(
+                        // (e) => {}
+                        //  console.error(e)
+                        // );
+                        // });
+                        // }
+                        const element = await frame.locator(dataAttribute).first();
+                        // await new Promise((resolve) => setTimeout(resolve, 100));
+                        // await this._unhighlightElements(frame, dataAttribute);
+                        if (element) {
+                            await this.scrollIfNeeded(element, state.info);
+                            await element.dispatchEvent("bvt_verify_page_contains_text");
+                            // await _screenshot(state, this, element);
+                        }
                     }
+                    await _screenshot(state, this);
+                    return state.info;
+                }
+                catch (error) {
+                    console.error(error);
                 }
-                await _screenshot(state, this);
-                return state.info;
             }
             // await expect(element).toHaveCount(1, { timeout: 10000 });
         }
@@ -2162,11 +2436,15 @@ class StableBrowser {
             scroll: false,
             highlight: false,
             type: Types.WAIT_FOR_TEXT_TO_DISAPPEAR,
-            text: `Verify text does not exist in page`,
+            text: `Verify the text '${text}' does not exist in page`,
+            _text: `Verify the text '${text}' does not exist in page`,
             operation: "verifyTextNotExistInPage",
             log: "***** verify text " + text + " does not exist in page *****\n",
         };
-        const timeout = this._getLoadTimeout(options);
+        if (testForRegex(text)) {
+            text = text.replace(/\\"/g, '"');
+        }
+        const timeout = this._getFindElementTimeout(options);
         await new Promise((resolve) => setTimeout(resolve, 2000));
         const newValue = await this._replaceWithLocalData(text, world);
         if (newValue !== text) {
@@ -2178,8 +2456,16 @@ class StableBrowser {
         try {
             await _preCommand(state, this);
             state.info.text = text;
+            let resultWithElementsFound = {
+                length: null, // initial cannot be 0
+            };
             while (true) {
-                const resultWithElementsFound = await this.findTextInAllFrames(dateAlternatives, numberAlternatives, text, state);
+                try {
+                    resultWithElementsFound = await this.findTextInAllFrames(dateAlternatives, numberAlternatives, text, state);
+                }
+                catch (error) {
+                    // ignore
+                }
                 if (resultWithElementsFound.length === 0) {
                     await _screenshot(state, this);
                     return state.info;
@@ -2209,10 +2495,11 @@ class StableBrowser {
             highlight: false,
             type: Types.VERIFY_TEXT_WITH_RELATION,
             text: `Verify text with relation to another text`,
+            _text: "Search for " + textAnchor + " climb " + climb + " and verify " + textToVerify + " found",
             operation: "verify_text_with_relation",
             log: "***** search for " + textAnchor + " climb " + climb + " and verify " + textToVerify + " found *****\n",
         };
-        const timeout = this._getLoadTimeout(options);
+        const timeout = this._getFindElementTimeout(options);
         await new Promise((resolve) => setTimeout(resolve, 2000));
         let newValue = await this._replaceWithLocalData(textAnchor, world);
         if (newValue !== textAnchor) {
@@ -2230,8 +2517,16 @@ class StableBrowser {
         try {
             await _preCommand(state, this);
             state.info.text = textToVerify;
+            let resultWithElementsFound = {
+                length: 0,
+            };
             while (true) {
-                const resultWithElementsFound = await this.findTextInAllFrames(dateAlternatives, numberAlternatives, textAnchor, state);
+                try {
+                    resultWithElementsFound = await this.findTextInAllFrames(findDateAlternatives(textAnchor), findNumberAlternatives(textAnchor), textAnchor, state, false);
+                }
+                catch (error) {
+                    // ignore
+                }
                 if (resultWithElementsFound.length === 0) {
                     if (Date.now() - state.startTime > timeout) {
                         throw new Error(`Text ${foundAncore ? textToVerify : textAnchor} not found in page`);
@@ -2239,51 +2534,56 @@ class StableBrowser {
                     await new Promise((resolve) => setTimeout(resolve, 1000));
                     continue;
                 }
-                for (let i = 0; i < resultWithElementsFound.length; i++) {
-                    foundAncore = true;
-                    const result = resultWithElementsFound[i];
-                    const token = result.randomToken;
-                    const frame = result.frame;
-                    const css = `[data-blinq-id="blinq-id-${token}"]`;
-                    const findResult = await frame.evaluate(([css, climb, textToVerify, token]) => {
-                        const elements = Array.from(document.querySelectorAll(css));
-                        for (let i = 0; i < elements.length; i++) {
-                            const element = elements[i];
-                            let climbParent = element;
-                            for (let j = 0; j < climb; j++) {
-                                climbParent = climbParent.parentElement;
-                                if (!climbParent) {
-                                    break;
+                try {
+                    for (let i = 0; i < resultWithElementsFound.length; i++) {
+                        foundAncore = true;
+                        const result = resultWithElementsFound[i];
+                        const token = result.randomToken;
+                        const frame = result.frame;
+                        let css = `[data-blinq-id-${token}]`;
+                        const climbArray1 = [];
+                        for (let i = 0; i < climb; i++) {
+                            climbArray1.push("..");
+                        }
+                        let climbXpath = "xpath=" + climbArray1.join("/");
+                        css = css + " >> " + climbXpath;
+                        const count = await frame.locator(css).count();
+                        for (let j = 0; j < count; j++) {
+                            const continer = await frame.locator(css).nth(j);
+                            const result = await this._locateElementByText(continer, textToVerify, "*:not(script, style, head)", false, false, true, {});
+                            if (result.elementCount > 0) {
+                                const dataAttribute = "[data-blinq-id-" + result.randomToken + "]";
+                                await this._highlightElements(frame, dataAttribute);
+                                //const cssAnchor = `[data-blinq-id="blinq-id-${token}-anchor"]`;
+                                // if (world && world.screenshot && !world.screenshotPath) {
+                                // console.log(`Highlighting for vtrt while running from recorder`);
+                                // this._highlightElements(frame, dataAttribute)
+                                // .then(async () => {
+                                // await new Promise((resolve) => setTimeout(resolve, 1000));
+                                // this._unhighlightElements(frame, dataAttribute).then(
+                                // () => {}
+                                // console.log(`Unhighlighting vrtr in recorder is successful`)
+                                // );
+                                // })
+                                // .catch(e);
+                                // }
+                                //await this._highlightElements(frame, cssAnchor);
+                                const element = await frame.locator(dataAttribute).first();
+                                // await new Promise((resolve) => setTimeout(resolve, 100));
+                                // await this._unhighlightElements(frame, dataAttribute);
+                                if (element) {
+                                    await this.scrollIfNeeded(element, state.info);
+                                    await element.dispatchEvent("bvt_verify_page_contains_text");
                                 }
+                                await _screenshot(state, this);
+                                return state.info;
                             }
-                            if (!climbParent) {
-                                continue;
-                            }
-                            const foundElements = window.findMatchingElements(textToVerify, {}, climbParent);
-                            if (foundElements.length > 0) {
-                                // set the container element attribute
-                                element.setAttribute("data-blinq-id", `blinq-id-${token}-anchor`);
-                                climbParent.setAttribute("data-blinq-id", `blinq-id-${token}-container`);
-                                foundElements[0].setAttribute("data-blinq-id", `blinq-id-${token}-verify`);
-                                return { found: true };
-                            }
-                        }
-                        return { found: false };
-                    }, [css, climb, textToVerify, result.randomToken]);
-                    if (findResult.found === true) {
-                        const dataAttribute = `[data-blinq-id="blinq-id-${token}-verify"]`;
-                        const cssAnchor = `[data-blinq-id="blinq-id-${token}-anchor"]`;
-                        await this._highlightElements(frame, dataAttribute);
-                        await this._highlightElements(frame, cssAnchor);
-                        const element = await frame.$(dataAttribute);
-                        if (element) {
-                            await this.scrollIfNeeded(element, state.info);
-                            await element.dispatchEvent("bvt_verify_page_contains_text");
                         }
-                        await _screenshot(state, this);
-                        return state.info;
                     }
                 }
+                catch (error) {
+                    console.error(error);
+                }
             }
             // await expect(element).toHaveCount(1, { timeout: 10000 });
         }
@@ -2294,6 +2594,30 @@ class StableBrowser {
             _commandFinally(state, this);
         }
     }
+    async findRelatedTextInAllFrames(textAnchor, climb, textToVerify, params = {}, options = {}, world = null) {
+        const frames = this.page.frames();
+        let results = [];
+        let ignoreCase = false;
+        for (let i = 0; i < frames.length; i++) {
+            const result = await this._locateElementByText(frames[i], textAnchor, "*:not(script, style, head)", false, true, ignoreCase, {});
+            result.frame = frames[i];
+            const climbArray = [];
+            for (let i = 0; i < climb; i++) {
+                climbArray.push("..");
+            }
+            let climbXpath = "xpath=" + climbArray.join("/");
+            const newLocator = `[data-blinq-id-${result.randomToken}] ${climb > 0 ? ">> " + climbXpath : ""} >> internal:text=${testForRegex(textToVerify) ? textToVerify : unEscapeString(textToVerify)}`;
+            const count = await frames[i].locator(newLocator).count();
+            if (count > 0) {
+                result.elementCount = count;
+                result.locator = newLocator;
+                results.push(result);
+            }
+        }
+        // state.info.results = results;
+        const resultWithElementsFound = results.filter((result) => result.elementCount > 0);
+        return resultWithElementsFound;
+    }
     async visualVerification(text, options = {}, world = null) {
         const startTime = Date.now();
         let error = null;
@@ -2312,10 +2636,13 @@ class StableBrowser {
             ({ screenshotId, screenshotPath } = await this._screenShot(options, world, info));
             info.screenshotPath = screenshotPath;
             const screenshot = await this.takeScreenshot();
-            const request = {
-                method: "POST",
+            let request = {
+                method: "post",
+                maxBodyLength: Infinity,
                 url: `${serviceUrl}/api/runs/screenshots/validate-screenshot`,
                 headers: {
+                    "x-bvt-project-id": path.basename(this.project_path),
+                    "x-source": "aaa",
                     "Content-Type": "application/json",
                     Authorization: `Bearer ${process.env.TOKEN}`,
                 },
@@ -2324,7 +2651,7 @@ class StableBrowser {
                     screenshot: screenshot,
                 }),
             };
-            let result = await this.context.api.request(request);
+            const result = await axios.request(request);
             if (result.data.status !== true) {
                 throw new Error("Visual validation failed");
             }
@@ -2352,6 +2679,7 @@ class StableBrowser {
             _reportToWorld(world, {
                 type: Types.VERIFY_VISUAL,
                 text: "Visual verification",
+                _text: "Visual verification of " + text,
                 screenshotId,
                 result: error
                     ? {
@@ -2618,6 +2946,32 @@ class StableBrowser {
         }
         return timeout;
     }
+    _getFindElementTimeout(options) {
+        if (options && options.timeout) {
+            return options.timeout;
+        }
+        if (this.configuration.find_element_timeout) {
+            return this.configuration.find_element_timeout;
+        }
+        return 30000;
+    }
+    async saveStoreState(path = null, world = null) {
+        const storageState = await this.page.context().storageState();
+        //const testDataFile = _getDataFile(world, this.context, this);
+        if (path) {
+            // save { storageState: storageState } into the path
+            fs.writeFileSync(path, JSON.stringify({ storageState: storageState }, null, 2));
+        }
+        else {
+            await this.setTestData({ storageState: storageState }, world);
+        }
+    }
+    async restoreSaveState(path = null, world = null) {
+        await refreshBrowser(this, path, world);
+        this.registerEventListeners(this.context);
+        registerNetworkEvents(this.world, this, this.context, this.page);
+        registerDownloadEvent(this.page, this.world, this.context);
+    }
     async waitForPageLoad(options = {}, world = null) {
         let timeout = this._getLoadTimeout(options);
         const promiseArray = [];
@@ -2685,6 +3039,7 @@ class StableBrowser {
             highlight: false,
             type: Types.CLOSE_PAGE,
             text: `Close page`,
+            _text: `Close the page`,
             operation: "closePage",
             log: "***** close page *****\n",
             throwError: false,
@@ -2701,8 +3056,95 @@ class StableBrowser {
             _commandFinally(state, this);
         }
     }
+    async tableCellOperation(headerText, rowText, options, _params, world = null) {
+        let operation = null;
+        if (!options || !options.operation) {
+            throw new Error("operation is not defined");
+        }
+        operation = options.operation;
+        // validate operation is one of the supported operations
+        if (operation != "click" && operation != "hover+click") {
+            throw new Error("operation is not supported");
+        }
+        const state = {
+            options,
+            world,
+            locate: false,
+            scroll: false,
+            highlight: false,
+            type: Types.TABLE_OPERATION,
+            text: `Table operation`,
+            _text: `Table ${operation} operation`,
+            operation: operation,
+            log: "***** Table operation *****\n",
+        };
+        const timeout = this._getFindElementTimeout(options);
+        try {
+            await _preCommand(state, this);
+            const start = Date.now();
+            let cellArea = null;
+            while (true) {
+                try {
+                    cellArea = await _findCellArea(headerText, rowText, this, state);
+                    if (cellArea) {
+                        break;
+                    }
+                }
+                catch (e) {
+                    // ignore
+                }
+                if (Date.now() - start > timeout) {
+                    throw new Error(`Cell not found in table`);
+                }
+                await new Promise((resolve) => setTimeout(resolve, 1000));
+            }
+            switch (operation) {
+                case "click":
+                    if (!options.css) {
+                        // will click in the center of the cell
+                        let xOffset = 0;
+                        let yOffset = 0;
+                        if (options.xOffset) {
+                            xOffset = options.xOffset;
+                        }
+                        if (options.yOffset) {
+                            yOffset = options.yOffset;
+                        }
+                        await this.page.mouse.click(cellArea.x + cellArea.width / 2 + xOffset, cellArea.y + cellArea.height / 2 + yOffset);
+                    }
+                    else {
+                        const results = await findElementsInArea(options.css, cellArea, this, options);
+                        if (results.length === 0) {
+                            throw new Error(`Element not found in cell area`);
+                        }
+                        state.element = results[0];
+                        await performAction("click", state.element, options, this, state, _params);
+                    }
+                    break;
+                case "hover+click":
+                    if (!options.css) {
+                        throw new Error("css is not defined");
+                    }
+                    const results = await findElementsInArea(options.css, cellArea, this, options);
+                    if (results.length === 0) {
+                        throw new Error(`Element not found in cell area`);
+                    }
+                    state.element = results[0];
+                    await performAction("hover+click", state.element, options, this, state, _params);
+                    break;
+                default:
+                    throw new Error("operation is not supported");
+            }
+        }
+        catch (e) {
+            await _commandError(state, e, this);
+        }
+        finally {
+            _commandFinally(state, this);
+        }
+    }
     saveTestDataAsGlobal(options, world) {
-        const dataFile = this._getDataFile(world);
+        const dataFile = _getDataFile(world, this.context, this);
         process.env.GLOBAL_TEST_DATA_FILE = dataFile;
         this.logger.info("Save the scenario test data as global for the following scenarios.");
     }
@@ -2732,6 +3174,7 @@ class StableBrowser {
             _reportToWorld(world, {
                 type: Types.SET_VIEWPORT,
                 text: "set viewport size to " + width + "x" + hight,
+                _text: "Set the viewport size to " + width + "x" + hight,
                 screenshotId,
                 result: error
                     ? {
@@ -2803,14 +3246,25 @@ class StableBrowser {
         }
     }
     async beforeStep(world, step) {
-        this.stepName = step.pickleStep.text;
-        this.logger.info("step: " + this.stepName);
         if (this.stepIndex === undefined) {
             this.stepIndex = 0;
         }
         else {
             this.stepIndex++;
         }
+        if (step && step.pickleStep && step.pickleStep.text) {
+            this.stepName = step.pickleStep.text;
+            this.logger.info("step: " + this.stepName);
+        }
+        else if (step && step.text) {
+            this.stepName = step.text;
+        }
+        else {
+            this.stepName = "step " + this.stepIndex;
+        }
+        if (this.context) {
+            this.context.examplesRow = extractStepExampleParameters(step);
+        }
         if (this.context && this.context.browserObject && this.context.browserObject.trace === true) {
             if (this.context.browserObject.context) {
                 await this.context.browserObject.context.tracing.startChunk({ title: this.stepName });
@@ -2823,6 +3277,41 @@ class StableBrowser {
                 this.saveTestDataAsGlobal({}, world);
             }
         }
+        if (this.initSnapshotTaken === false) {
+            this.initSnapshotTaken = true;
+            if (world && world.attach && !process.env.DISABLE_SNAPSHOT) {
+                const snapshot = await this.getAriaSnapshot();
+                if (snapshot) {
+                    await world.attach(JSON.stringify(snapshot), "application/json+snapshot-before");
+                }
+            }
+        }
+    }
+    async getAriaSnapshot() {
+        try {
+            // find the page url
+            const url = await this.page.url();
+            // extract the path from the url
+            const path = new URL(url).pathname;
+            // get the page title
+            const title = await this.page.title();
+            // go over other frams
+            const frames = this.page.frames();
+            const snapshots = [];
+            const content = [`- path: ${path}`, `- title: ${title}`];
+            const timeout = this.configuration.ariaSnapshotTimeout ? this.configuration.ariaSnapshotTimeout : 3000;
+            for (let i = 0; i < frames.length; i++) {
+                content.push(`- frame: ${i}`);
+                const frame = frames[i];
+                const snapshot = await frame.locator("body").ariaSnapshot({ timeout });
+                content.push(snapshot);
+            }
+            return content.join("\n");
+        }
+        catch (e) {
+            console.error(e);
+        }
+        return null;
     }
     async afterStep(world, step) {
         this.stepName = null;
@@ -2833,6 +3322,16 @@ class StableBrowser {
                 });
             }
         }
+        if (this.context) {
+            this.context.examplesRow = null;
+        }
+        if (world && world.attach && !process.env.DISABLE_SNAPSHOT) {
+            const snapshot = await this.getAriaSnapshot();
+            if (snapshot) {
+                const obj = {};
+                await world.attach(JSON.stringify(snapshot), "application/json+snapshot-after");
+            }
+        }
     }
 }
 function createTimedPromise(promise, label) {