@adobe/helix-rum-enhancer 1.10.0 → 1.11.1

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,17 @@
+## [1.11.1](https://github.com/adobe/helix-rum-enhancer/compare/v1.11.0...v1.11.1) (2024-02-28)
+
+
+### Bug Fixes
+
+* **cwv:** report metrics eagerly ([b7a7e3e](https://github.com/adobe/helix-rum-enhancer/commit/b7a7e3e202f8dc4de97994cdf36ece95075082c4))
+
+# [1.11.0](https://github.com/adobe/helix-rum-enhancer/compare/v1.10.0...v1.11.0) (2024-01-17)
+
+
+### Features
+
+* **observer:** enable tracking of JSON loading for all browsers that have a PerformanceObserver implementation ([c049f93](https://github.com/adobe/helix-rum-enhancer/commit/c049f930f0cc1dc548e42bd8e76cd97709a873d7))
+
 # [1.10.0](https://github.com/adobe/helix-rum-enhancer/compare/v1.9.1...v1.10.0) (2024-01-16)
 
 

package/README.md

@@ -4,10 +4,9 @@
 
 ## Status
 [![codecov](https://img.shields.io/codecov/c/github/adobe/helix-rum-enhancer.svg)](https://codecov.io/gh/adobe/helix-rum-enhancer)
-[![CircleCI](https://img.shields.io/circleci/project/github/adobe/helix-rum-enhancer.svg)](https://circleci.com/gh/adobe/helix-rum-enhancer)
+[![GitHub Actions](https://img.shields.io/github/actions/workflow/status/adobe/helix-rum-enhancer/main.yaml)](https://github.com/adobe/helix-rum-enhancer/actions/workflows/main.yaml)
 [![GitHub license](https://img.shields.io/github/license/adobe/helix-rum-enhancer.svg)](https://github.com/adobe/helix-rum-enhancer/blob/master/LICENSE.txt)
 [![GitHub issues](https://img.shields.io/github/issues/adobe/helix-rum-enhancer.svg)](https://github.com/adobe/helix-rum-enhancer/issues)
-[![LGTM Code Quality Grade: JavaScript](https://img.shields.io/lgtm/grade/javascript/g/adobe/helix-rum-enhancer.svg?logo=lgtm&logoWidth=18)](https://lgtm.com/projects/g/adobe/helix-rum-enhancer)
 [![semantic-release](https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg)](https://github.com/semantic-release/semantic-release)
 
 ## Usage

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adobe/helix-rum-enhancer",
-  "version": "1.10.0",
+  "version": "1.11.1",
   "description": "Helix RUM Enhancer",
   "main": "src/index.js",
   "type": "module",
@@ -9,6 +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 1.x main",
     "prepare": "husky install"
   },
   "repository": {
@@ -28,7 +29,7 @@
     "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",

package/src/index.js

@@ -91,14 +91,19 @@ sampleRUM.drain('cwv', (() => {
       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);
 }));
@@ -137,7 +142,6 @@ sampleRUM.sourceselector = (element) => {
   if (Array.from(element.classList).some((className) => className.match(/button|cta/))) {
     return blockName ? `.${blockName} .button` : '.button';
   }
-  
   return sampleRUM.sourceselector(element.parentElement);
 };
 
@@ -155,15 +159,13 @@ document.querySelectorAll('form').forEach((form) => {
 window.addEventListener('visibilitychange', ((event) => sampleRUM.leave(event)));
 window.addEventListener('pagehide', ((event) => sampleRUM.leave(event)));
 
-if (window.location.hostname === 'blog.adobe.com') {
-  const observer = new PerformanceObserver((list) => {
-    list.getEntries()
-      .filter((entry) => !entry.responseStatus || entry.responseStatus < 400)
-      .filter((entry) => window.location.hostname === new URL(entry.name).hostname)
-      .filter((entry) => new URL(entry.name).pathname.match('.*(\\.plain\\.html|\\.json)$'))
-      .forEach((entry) => {
-        sampleRUM('loadresource', { source: entry.name, target: Math.round(entry.duration) });
-      });
-  });
-  observer.observe({ type: 'resource', buffered: true });
-}
+const observer = new PerformanceObserver((list) => {
+  list.getEntries()
+    .filter((entry) => !entry.responseStatus || entry.responseStatus < 400)
+    .filter((entry) => window.location.hostname === new URL(entry.name).hostname)
+    .filter((entry) => new URL(entry.name).pathname.match('.*(\\.plain\\.html|\\.json)$'))
+    .forEach((entry) => {
+      sampleRUM('loadresource', { source: entry.name, target: Math.round(entry.duration) });
+    });
+});
+observer.observe({ type: 'resource', buffered: true });