@dev-blinq/cucumber_client 1.0.1255-dev → 1.0.1255-stage

package/bin/assets/preload/recorderv3.js

@@ -955,6 +955,7 @@ class BVTRecorder {
     // Get all attributes
     if (element.attributes) {
       for (const attr of element.attributes) {
+        if (attr.name === "data-blinq-id" || attr.name === "data-input-id") continue;
         unsortedAttributes[attr.name] = attr.value;
       }
     }
@@ -962,6 +963,7 @@ class BVTRecorder {
     // Get dataset properties (data-* attributes)
     if (element.dataset) {
       for (const [key, value] of Object.entries(element.dataset)) {
+        if (key === "blinqId" || key === "inputId") continue;
         unsortedDataset[key] = value;
       }
     }
@@ -989,7 +991,7 @@ class BVTRecorder {
       el.__locators = this.getLocatorsObject(el);
     }
     const role = window.getAriaRole(el);
-    const label = window.getElementAccessibleName(el, false) || window.getElementAccessibleName(el, true) || role || "";
+    const label = window.getElementAccessibleName(el, false) || window.getElementAccessibleName(el, true) || "";
     const result = this.getElementProperties(el);
     return {
       role,
@@ -1188,7 +1190,7 @@ class BVTRecorder {
         cssLocators.push(origenCss);
       }
       const noClasses = CssSelectorGenerator.getCssSelector(el, {
-        blacklist: [/^(?!.*h\d).*?\d.*/, /\[style/, /\[data-input-id/, /\[blinq-container/],
+        blacklist: [/^(?!.*h\d).*?\d.*/, /\[style/, /\[data-input-id/],
         combineWithinSelector: true,
         combineBetweenSelectors: true,
         selectors: ["id", "attribute", "tag", "nthchild", "nthoftype"],

package/bin/assets/scripts/dom_parent.js

@@ -6,6 +6,10 @@ class DOM_Parent {
         }
 
         // TODO: account for slotted elements 
+
+        if (element.assignedSlot) {
+            return element.assignedSlot
+        }
         // Get the actual parent element, skipping shadow DOM if necessary
         let parent = element.parentElement;
         if (parent) {
@@ -35,6 +39,28 @@ class DOM_Parent {
 
         return ancestors;
     }
+    getFullAncestorChainToRoot(element, root) {
+        if (!element || !(element instanceof Element)) {
+            throw new Error('Invalid element provided');
+        }
+        if (!root || !(root instanceof Element)) {
+            throw new Error('Invalid root provided');
+        }
+        if (!this.containsElementCrossShadow(root, element)) {
+            throw new Error('Root does not contain the element');
+        }
+        const ancestors = [];
+        let currentElement = element;
+        while (currentElement && currentElement !== root && this.containsElementCrossShadow(root, currentElement)) {
+            ancestors.push(currentElement);
+            currentElement = this.getActualParent(currentElement);
+
+        }
+        if (currentElement === root) {
+            ancestors.push(currentElement);
+        }
+        return ancestors;
+    }
     getClimbCountToParent(element, targetParent) {
         if (!element || !(element instanceof Element)) {
             throw new Error('Invalid element provided');

package/bin/assets/scripts/recorder.js

@@ -642,6 +642,8 @@ class BVTRecorder {
     // Get all attributes
     if (element.attributes) {
       for (const attr of element.attributes) {
+        if (attr.name === "data-input-id") continue; // skip input id attribute
+        if (attr.name === "data-blinq-id") continue; // skip blinq id attribute{
         unsortedAttributes[attr.name] = attr.value;
       }
     }
@@ -649,6 +651,8 @@ class BVTRecorder {
     // Get dataset properties (data-* attributes)
     if (element.dataset) {
       for (const [key, value] of Object.entries(element.dataset)) {
+        if (key === "inputId") continue; // skip input id dataset property
+        if (key === "blinqId") continue; // skip blinq id dataset property
         unsortedDataset[key] = value;
       }
     }
@@ -678,7 +682,6 @@ class BVTRecorder {
     const label =
       this.PW.roleUtils.getElementAccessibleName(el, false) ||
       this.PW.roleUtils.getElementAccessibleName(el, true) ||
-      role ||
       "";
     const result = this.getElementProperties(el);
     return {
@@ -687,7 +690,7 @@ class BVTRecorder {
       inputID: el.dataset.inputId,
       tagName: el.tagName,
       type: el.type,
-      text: this.PW.selectorUtils.elementText(new Map(), el).full,
+      text: this.PW.selectorUtils.elementText(new Map(), el).full.trim(),
       parent: `tagname: ${el.parentElement?.tagName}\ninnerText: ${el.parentElement?.innerText}`,
       attrs: {
         placeholder: el.getAttribute("placeholder"),
@@ -999,7 +1002,7 @@ class BVTTool extends HTMLElement {
     const tooltip = this.#tooltip;
 
     tooltip.style.opacity = "0"; // hide before measuring
-    tooltip.style.left = "0px";  // reset for accurate width calc
+    tooltip.style.left = "0px"; // reset for accurate width calc
     tooltip.style.top = "0px";
     tooltip.style.transform = "none"; // remove old transform
 
@@ -1019,7 +1022,6 @@ class BVTTool extends HTMLElement {
       tooltip.style.top = `${rect.bottom + 20}px`;
       tooltip.style.opacity = "1";
     });
-
   }
   hideTooltip() {
     if (this.#tooltip) {
@@ -1109,8 +1111,7 @@ class BVTToolBar extends HTMLElement {
 
       // 	document.addEventListener("mousemove", moveHandler);
       // 	document.addEventListener("mouseup", upHandler);
-    }
-    );
+    });
     return dragHandler;
   }
   getHoverTool() {
@@ -1118,7 +1119,7 @@ class BVTToolBar extends HTMLElement {
     const hoverTool = document.createElement("x-bvt-tool");
     hoverTool.name = "hover";
     hoverTool.tooltipText = "Record hover over an element";
-    hoverTool.innerHTML = `<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><path clip-rule="evenodd" d="M13.999 17.175l-3.452.774a.391.391 0 00-.245.172l-1.664 2.6c-.809 1.265-2.743.924-3.072-.541L3.71 10.963C3.38 9.493 4.99 8.36 6.263 9.167l8.271 4.933c1.27.805.933 2.746-.535 3.075z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="stroke: currentColor; fill: none;" /><rect x="11" y="3" width="12" height="2" rx="1" fill="currentColor" style="fill: currentColor;"/><rect x="11" y="7" width="9" height="2" rx="1" fill="currentColor" style="fill: currentColor;"/><rect x="11" y="11" width="12" height="2" rx="1" fill="currentColor" style="fill: currentColor;"/><circle cx="9" cy="4" r="1" fill="currentColor" style="fill: currentColor;"/><circle cx="9" cy="8" r="1" fill="currentColor" style="fill: currentColor;"/></svg>`
+    hoverTool.innerHTML = `<svg width="24" height="24" fill="none" xmlns="http://www.w3.org/2000/svg"><path clip-rule="evenodd" d="M13.999 17.175l-3.452.774a.391.391 0 00-.245.172l-1.664 2.6c-.809 1.265-2.743.924-3.072-.541L3.71 10.963C3.38 9.493 4.99 8.36 6.263 9.167l8.271 4.933c1.27.805.933 2.746-.535 3.075z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="stroke: currentColor; fill: none;" /><rect x="11" y="3" width="12" height="2" rx="1" fill="currentColor" style="fill: currentColor;"/><rect x="11" y="7" width="9" height="2" rx="1" fill="currentColor" style="fill: currentColor;"/><rect x="11" y="11" width="12" height="2" rx="1" fill="currentColor" style="fill: currentColor;"/><circle cx="9" cy="4" r="1" fill="currentColor" style="fill: currentColor;"/><circle cx="9" cy="8" r="1" fill="currentColor" style="fill: currentColor;"/></svg>`;
     // hoverTool.addEventListener("click", this.onHoverMode);
     return hoverTool;
   }
@@ -1143,4 +1144,4 @@ class BVTToolBar extends HTMLElement {
 }
 
 customElements.define("x-bvt-tool", BVTTool);
-customElements.define("x-bvt-toolbar", BVTToolBar);
+customElements.define("x-bvt-toolbar", BVTToolBar);