clarity-visualize 0.8.67-beta → 0.8.68

package/build/clarity.visualize.module.js

@@ -1300,19 +1300,24 @@ class LayoutHelper {
             this.hashMapBeta = {};
             this.primaryHtmlNodeId = null;
         };
-        this.get = (hash) => {
+        this.get = (hash, silent = false) => {
             if (hash in this.hashMapBeta && this.hashMapBeta[hash].isConnected) {
                 return this.hashMapBeta[hash];
             }
             else if (hash in this.hashMapAlpha && this.hashMapAlpha[hash].isConnected) {
+                // Beta lookup missed but the Alpha (fallback) selector resolved the element.
+                // Surface this so we can measure how often Alpha is still required before retiring it.
+                if (!silent && this.state.options.onalphaFallback) {
+                    this.state.options.onalphaFallback(hash);
+                }
                 return this.hashMapAlpha[hash];
             }
             return null;
         };
         this.addToHashMap = (data, parent) => {
             // In case of selector collision, prefer the first inserted node
-            this.hashMapAlpha[data.hashAlpha] = this.get(data.hashAlpha) || parent;
-            this.hashMapBeta[data.hashBeta] = this.get(data.hashBeta) || parent;
+            this.hashMapAlpha[data.hashAlpha] = this.get(data.hashAlpha, true) || parent;
+            this.hashMapBeta[data.hashBeta] = this.get(data.hashBeta, true) || parent;
         };
         this.resize = (el, width, height) => {
             if (el && el.nodeType === 1 /* NodeType.ELEMENT_NODE */ && width && height) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "clarity-visualize",
-  "version": "0.8.67-beta",
+  "version": "0.8.68",
   "description": "An analytics library that uses web page interactions to generate aggregated insights",
   "author": "Microsoft Corp.",
   "license": "MIT",
@@ -27,7 +27,7 @@
     "url": "https://github.com/Microsoft/clarity/issues"
   },
   "dependencies": {
-    "clarity-decode": "^0.8.67-beta"
+    "clarity-decode": "^0.8.68"
   },
   "devDependencies": {
     "@rollup/plugin-commonjs": "^24.0.0",

package/src/layout.ts

@@ -142,10 +142,13 @@ export class LayoutHelper {
         this.primaryHtmlNodeId = null;
     }
 
-    public get = (hash) => {
+    public get = (hash: string, silent: boolean = false): HTMLElement => {
         if (hash in this.hashMapBeta && this.hashMapBeta[hash].isConnected) {
             return this.hashMapBeta[hash];
         } else if (hash in this.hashMapAlpha && this.hashMapAlpha[hash].isConnected) {
+            // Beta lookup missed but the Alpha (fallback) selector resolved the element.
+            // Surface this so we can measure how often Alpha is still required before retiring it.
+            if (!silent && this.state.options.onalphaFallback) { this.state.options.onalphaFallback(hash); }
             return this.hashMapAlpha[hash];
         }
         return null;
@@ -153,8 +156,8 @@ export class LayoutHelper {
 
     private addToHashMap = (data: DecodedLayout.DomData, parent: Node) => {
         // In case of selector collision, prefer the first inserted node
-        this.hashMapAlpha[data.hashAlpha] = this.get(data.hashAlpha) || parent;
-        this.hashMapBeta[data.hashBeta] = this.get(data.hashBeta) || parent;
+        this.hashMapAlpha[data.hashAlpha] = this.get(data.hashAlpha, true) || parent;
+        this.hashMapBeta[data.hashBeta] = this.get(data.hashBeta, true) || parent;
     }
 
     private resize = (el: HTMLElement, width: number, height: number): void => {

package/types/visualize.d.ts

@@ -35,6 +35,9 @@ export type ResizeHandler  = (width: number, height: number) => void;
 export type ErrorLogger = (error: Error) => void;
 export type LinkHandler = (link: string, id: string, linkType: string) => string;
 export type ClickLogger = (args: IClickLoggerArgs) => void;
+// Fired when a hash resolves via the Alpha (fallback) selector map after the Beta lookup missed.
+// Used to measure how often the Alpha selector is still required.
+export type AlphaFallbackLogger = (hash: string) => void;
 
 export interface IClickLoggerArgs {
     time: number;
@@ -62,6 +65,7 @@ export interface Options {
     logerror?: ErrorLogger;
     useproxy?: LinkHandler;
     onclickMismatch?: ClickLogger;
+    onalphaFallback?: AlphaFallbackLogger;
     metadata?: HTMLElement;
     pointer?: boolean;
     canvas?: boolean;