@adobe/helix-rum-enhancer 2.1.0 → 2.2.0

package/.releaserc.cjs

@@ -12,5 +12,5 @@ module.exports = {
     }],
     ["@semantic-release/github", {}]
   ],
-  branches: ['main', "1.x"],
+  branches: ['main', '1.x'],
 };

package/CHANGELOG.md

@@ -1,3 +1,20 @@
+# [2.2.0](https://github.com/adobe/helix-rum-enhancer/compare/v2.1.1...v2.2.0) (2024-03-04)
+
+
+### Features
+
+* **sourceselector:** highlight clicks on buttons and CTAs ([2bc8dc5](https://github.com/adobe/helix-rum-enhancer/commit/2bc8dc531ef31e9ae08daebdd428a98a493c0f9e))
+
+## [2.1.1](https://github.com/adobe/helix-rum-enhancer/compare/v2.1.0...v2.1.1) (2024-02-28)
+
+
+### Bug Fixes
+
+* **cwv:** only report LCP and CLS eagerly ([9d44949](https://github.com/adobe/helix-rum-enhancer/commit/9d44949701865242ac44255d5080f52b22be2b72))
+* **cwv:** report metrics eagerly ([4cfcad9](https://github.com/adobe/helix-rum-enhancer/commit/4cfcad9e8271a2a3c4571db419e26857b72d0c6d))
+* **cwv:** small change ([542fd6a](https://github.com/adobe/helix-rum-enhancer/commit/542fd6a050fdb911b4fb5faad7f83d0843af4d1e))
+* **cwv:** small change ([3a41b52](https://github.com/adobe/helix-rum-enhancer/commit/3a41b52676484d44585e8b0debe7352fe7a2e5ac))
+
 # [2.1.0](https://github.com/adobe/helix-rum-enhancer/compare/v2.0.0...v2.1.0) (2024-01-22)
 
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adobe/helix-rum-enhancer",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "description": "Helix RUM Enhancer",
   "main": "src/index.js",
   "type": "module",
@@ -9,7 +9,7 @@
     "lint": "eslint .",
     "docs": "npx jsdoc2md -c .jsdoc.json --files 'src/*.js'  > docs/API.md",
     "semantic-release": "semantic-release",
-    "semantic-release-dry": "semantic-release --dry-run --branches $CI_BRANCH",
+    "semantic-release-dry": "semantic-release --dry-run --branches $CI_BRANCH 1.x main",
     "prepare": "husky install"
   },
   "repository": {
@@ -29,20 +29,20 @@
     "reporter-options": "configFile=.mocha-multi.json"
   },
   "devDependencies": {
-    "@adobe/eslint-config-helix": "2.0.5",
+    "@adobe/eslint-config-helix": "2.0.6",
     "@semantic-release/changelog": "6.0.3",
     "@semantic-release/git": "10.0.1",
-    "@semantic-release/npm": "11.0.2",
+    "@semantic-release/npm": "11.0.3",
     "c8": "9.1.0",
     "codecov": "3.8.3",
-    "eslint": "8.56.0",
+    "eslint": "8.57.0",
     "eslint-plugin-header": "3.1.1",
     "eslint-plugin-import": "2.29.1",
-    "husky": "8.0.3",
-    "jsdoc-to-markdown": "8.0.0",
-    "junit-report-builder": "3.1.0",
-    "lint-staged": "15.2.0",
-    "mocha": "10.2.0",
+    "husky": "9.0.11",
+    "jsdoc-to-markdown": "8.0.1",
+    "junit-report-builder": "3.2.1",
+    "lint-staged": "15.2.2",
+    "mocha": "10.3.0",
     "mocha-multi-reporters": "1.5.1",
     "semantic-release": "22.0.12"
   },

package/src/index.js

@@ -44,8 +44,8 @@ const sourceselector = (element) => {
     formElementSelector = element.tagName === 'INPUT' ? `form input[type='${element.getAttribute('type')}']` : `form ${element.tagName.toLowerCase()}`;
   }
 
+  const blockName = element.closest('.block') ? element.closest('.block').getAttribute('data-block-name') : '';
   if (element.id || formElementSelector) {
-    const blockName = element.closest('.block') ? element.closest('.block').getAttribute('data-block-name') : '';
     const id = element.id ? `#${element.id}` : '';
     return blockName ? `.${blockName} ${formElementSelector}${id}` : `${formElementSelector}${id}`;
   }
@@ -53,6 +53,11 @@ const sourceselector = (element) => {
   if (element.getAttribute('data-block-name')) {
     return `.${element.getAttribute('data-block-name')}`;
   }
+
+  if (Array.from(element.classList).some((className) => className.match(/button|cta/))) {
+    return blockName ? `.${blockName} .button` : '.button';
+  }
+
   return sourceselector(element.parentElement);
 };
 
@@ -107,14 +112,19 @@ function addCWVTracking() {
         data.cwv[measurement.name] = measurement.value;
         sampleRUM('cwv', data);
       };
+
+      const featureToggle = () => window.location.hostname === 'blog.adobe.com';
+      const isEager = (metric) => ['CLS', 'LCP'].includes(metric);
+
       // When loading `web-vitals` using a classic script, all the public
       // methods can be found on the `webVitals` global namespace.
-      ['CLS', 'FID', 'LCP', 'INP', 'TTFB']
-        .map((metric) => window.webVitals[`get${metric}`])
-        .filter((metric) => typeof metric === 'function')
-        .forEach((invokeMetric) => {
-          invokeMetric(storeCWV);
-        });
+      ['FID', 'INP', 'TTFB', 'CLS', 'LCP'].forEach((metric) => {
+        const metricFn = window.webVitals[`on${metric}`];
+        if (typeof metricFn === 'function') {
+          const opts = isEager(metric) ? { reportAllChanges: featureToggle() } : undefined;
+          metricFn(storeCWV, opts);
+        }
+      });
     };
     document.head.appendChild(script);
   }, 2000); // wait for delayed