ensuring we dont execute code in attributes

Author: Sam Martin

lerna.json

@@ -2,6 +2,6 @@
   "packages": [
     "packages/*"
   ],
-  "version": "0.8.46",
+  "version": "0.8.47",
   "npmClient": "yarn"
 }

package.json

@@ -1,7 +1,7 @@
 {
   "name": "clarity",
   "private": true,
-  "version": "0.8.46",
+  "version": "0.8.47",
   "repository": "https://github.com/microsoft/clarity.git",
   "author": "Sarvesh Nagpal <[email protected]>",
   "license": "MIT",

packages/clarity-decode/package.json

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

packages/clarity-devtools/package.json

@@ -1,6 +1,6 @@
 {
   "name": "clarity-devtools",
-  "version": "0.8.46",
+  "version": "0.8.47",
   "private": true,
   "description": "Adds Clarity debugging support to browser devtools",
   "author": "Microsoft Corp.",
@@ -24,9 +24,9 @@
     "url": "https://github.com/Microsoft/clarity/issues"
   },
   "dependencies": {
-    "clarity-decode": "^0.8.46",
-    "clarity-js": "^0.8.46",
-    "clarity-visualize": "^0.8.46"
+    "clarity-decode": "^0.8.47",
+    "clarity-js": "^0.8.47",
+    "clarity-visualize": "^0.8.47"
   },
   "devDependencies": {
     "@rollup/plugin-node-resolve": "^15.0.0",

packages/clarity-devtools/static/manifest.json

@@ -2,8 +2,8 @@
   "manifest_version": 2,
   "name": "Microsoft Clarity Developer Tools",
   "description": "Clarity helps you understand how users are interacting with your website.",
-  "version": "0.8.46",
-  "version_name": "0.8.46",
+  "version": "0.8.47",
+  "version_name": "0.8.47",
   "minimum_chrome_version": "50",
   "devtools_page": "devtools.html",
   "icons": {

packages/clarity-js/package.json

@@ -1,6 +1,6 @@
 {
   "name": "clarity-js",
-  "version": "0.8.46",
+  "version": "0.8.47",
   "description": "An analytics library that uses web page interactions to generate aggregated insights",
   "author": "Microsoft Corp.",
   "license": "MIT",

packages/clarity-js/src/core/version.ts

@@ -1,2 +1,2 @@
-let version = "0.8.46";
+let version = "0.8.47";
 export default version;

packages/clarity-visualize/package.json

@@ -1,6 +1,6 @@
 {
   "name": "clarity-visualize",
-  "version": "0.8.46",
+  "version": "0.8.47",
   "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.46"
+    "clarity-decode": "^0.8.47"
   },
   "devDependencies": {
     "@rollup/plugin-commonjs": "^24.0.0",

packages/clarity-visualize/src/layout.ts

@@ -641,7 +641,7 @@ export class LayoutHelper {
                                 node.setAttribute(Constant.Hide, size);
                         }
                     } else {
-                        node.setAttribute(attribute, v);
+                        node.setAttribute(attribute, this.isSuspiciousAttribute(attribute, v) ? Constant.Empty : v);
                     }
                 } catch (ex) {
                     console.warn("Node: " + node + " | " + JSON.stringify(attributes));
@@ -670,6 +670,23 @@ export class LayoutHelper {
         }
     }
 
+    private isSuspiciousAttribute(name: string, value: string): boolean {
+        // Block event handlers entirely
+        if (name.startsWith('on')) {
+            return true;
+        }
+        
+        // Check for JavaScript protocols and dangerous patterns
+        const dangerous = [
+            /^\s*javascript:/i,
+            /^\s*data:text\/html/i,
+            /^\s*vbscript:/i
+        ];
+        
+        return dangerous.some(pattern => pattern.test(value));
+    }
+
+
     private getMobileCustomStyle = (): string => {
         if(this.isMobile){
             return `*{scrollbar-width: none; scrollbar-gutter: unset;};`

packages/clarity-visualize/types/visualize.d.ts

@@ -199,7 +199,7 @@ export const enum Constant {
     NewPassword = "new-password",
     StyleSheet = "stylesheet",
     OriginalBackgroundColor = "data-clarity-background-color",
-    OriginalOpacity = "data-clarity-opacity"
+    OriginalOpacity = "data-clarity-opacity",
 }
 
 export const enum Setting {