@gemx-dev/clarity-visualize 0.8.65 → 0.8.67

package/build/clarity.visualize.module.js

@@ -149,19 +149,16 @@ function get$1(input, type) {
                         selectorMap[key].push(input.id);
                     }
                     selector = "".concat(key).concat("~" /* Constant.Tilde */).concat(selectorMap[key].indexOf(input.id));
-                    console.log("\uD83D\uDE80 \uD83D\uDC25 ~ get ~ selector:", selector);
                 }
                 else {
                     // In Beta mode, we continue to look at query selectors in context of the full page
                     selector = "".concat(prefix).concat(input.tag, ".").concat(classes).concat(suffix);
-                    console.log("\uD83D\uDE80 \uD83D\uDC25 ~ get ~ selector:", selector);
                 }
             }
             // Update selector to use "id" field when available. There are two exceptions:
             // (1) if "id" appears to be an auto generated string token, e.g. guid or a random id containing digits
             // (2) if "id" appears inside a shadow DOM, in which case we continue to prefix up to shadow DOM to prevent conflicts
             selector = id && filter(id) ? "".concat(getDomPrefix(prefix)).concat("#" /* Constant.Hash */).concat(id) : selector;
-            console.log("\uD83D\uDE80 \uD83D\uDC25 ~ get ~ selector:", selector);
             return selector;
     }
 }
@@ -189,7 +186,6 @@ function filter(value) {
         return false;
     } // Do not process empty strings
     var excludeClassNames = getExcludeClassNames();
-    console.log("\uD83D\uDE80 \uD83D\uDC25 ~ filter ~ excludeClassNames:", excludeClassNames);
     if (excludeClassNames.some(function (x) { return value.toLowerCase().indexOf(x) >= 0; })) {
         return false;
     }
@@ -202,8 +198,6 @@ function filter(value) {
     return true;
 }
 function getExcludeClassNames() {
-    console.log("\uD83D\uDE80 \uD83D\uDC25 ~ getExcludeClassNames ~ extraExcludeClassNames:", extraExcludeClassNames);
-    console.log("\uD83D\uDE80 \uD83D\uDC25 ~ getExcludeClassNames ~ excludeClassNames:", excludeClassNames);
     return __spreadArray(__spreadArray([], excludeClassNames, true), extraExcludeClassNames, true);
 }
 
@@ -996,7 +990,9 @@ var HeatmapHelper = /** @class */ (function () {
                         if (e.tagName === "CANVAS" /* Constant.Canvas */ || (e.id && e.id.indexOf("clarity-" /* Constant.ClarityPrefix */) === 0)) {
                             continue;
                         }
-                        visibility = e === el;
+                        // Consider visible if the top element is the element itself OR a descendant of it
+                        // (e.g. a BUTTON containing P/SPAN children — children will appear on top in elementsFromPoint)
+                        visibility = e === el || el.contains(e);
                         shadowElement = e.shadowRoot && e.shadowRoot != doc ? e.shadowRoot : null;
                         break;
                     }
@@ -1056,7 +1052,7 @@ var HeatmapHelper = /** @class */ (function () {
                 return canvas;
             }
             catch (error) {
-                console.error("\uD83D\uDE80 \uD83D\uDC25 ~ HeatmapHelper ~ createPortalCanvas:", error);
+                console.error("[Heatmap] createPortalCanvas:", error);
             }
             return null;
         };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gemx-dev/clarity-visualize",
-  "version": "0.8.65",
+  "version": "0.8.67",
   "description": "Clarity visualize",
   "author": "Microsoft Corp.",
   "license": "MIT",
@@ -9,7 +9,7 @@
   "unpkg": "build/clarity.visualize.min.js",
   "types": "types/index.d.ts",
   "dependencies": {
-    "@gemx-dev/clarity-decode": "^0.8.65"
+    "@gemx-dev/clarity-decode": "^0.8.67"
   },
   "devDependencies": {
     "@rollup/plugin-commonjs": "^24.0.0",

package/src/heatmap.ts

@@ -366,7 +366,9 @@ export class HeatmapHelper {
                 for (let e of elements) {
                     // Ignore if top element ends up being the canvas element we added for heatmap visualization
                     if (e.tagName === Constant.Canvas || (e.id && e.id.indexOf(Constant.ClarityPrefix) === 0)) { continue; }
-                    visibility = e === el;
+                    // Consider visible if the top element is the element itself OR a descendant of it
+                    // (e.g. a BUTTON containing P/SPAN children — children will appear on top in elementsFromPoint)
+                    visibility = e === el || el.contains(e);
                     shadowElement = e.shadowRoot && e.shadowRoot != doc ? e.shadowRoot : null;
                     break;
                 }
@@ -420,7 +422,7 @@ export class HeatmapHelper {
             this.parentCanvasInfo.canvas = canvas;
             return canvas;
         } catch (error) {
-            console.error(`🚀 🐥 ~ HeatmapHelper ~ createPortalCanvas:`, error);
+            console.error(`[Heatmap] createPortalCanvas:`, error);
         }
         return null;
     }