Merge pull request #273 from adobe/redirect-checkpoint

feat(navigation): add support for `redirect` checkpoint
adobe · Sep 20, 2024 · 8adcfb7 · 8adcfb7
2 parents 85e68d5 + 38e301e
commit 8adcfb7
Show file tree

Hide file tree

Showing 4 changed files with 94 additions and 7 deletions.
diff --git a/modules/fflags.js b/modules/fflags.js
@@ -18,6 +18,7 @@ export const fflags = {
   /* c8 ignore next */
   disabled: (flag, callback) => !fflags.has(flag) && callback(),
   eagercwv: [683],
+  redirect: [620, 1139],
   example: [543, 770, 1136],
   language: [543, 959, 1139, 620],
 };
diff --git a/modules/index.js b/modules/index.js
@@ -111,7 +111,7 @@ function addCWVTracking() {
 
 function addNavigationTracking() {
   // enter checkpoint when referrer is not the current page url
-  const navigate = (source, type) => {
+  const navigate = (source, type, redirectCount) => {
     const payload = { source, target: document.visibilityState };
     // reload: same page, navigate: same origin, enter: everything else
     if (type === 'reload' || source === window.location.href) {
@@ -123,10 +123,20 @@ function addNavigationTracking() {
     } else {
       sampleRUM('enter', payload); // enter site
     }
+    fflags.enabled('redirect', () => {
+      const from = new URLSearchParams(window.location.search).get('redirect-from');
+      if (redirectCount || from) {
+        sampleRUM('redirect', { source: from, target: redirectCount || 1 });
+      }
+    });
   };
 
   new PerformanceObserver((list) => list
-    .getEntries().map((entry) => navigate(window.hlx.referrer || document.referrer, entry.type)))
+    .getEntries().map((entry) => navigate(
+      window.hlx.referrer || document.referrer,
+      entry.type,
+      entry.redirectCount,
+    )))
     .observe({ type: 'navigation', buffered: true });
 }
 

diff --git a/test/it/fromredirect.test.html b/test/it/fromredirect.test.html
@@ -0,0 +1,72 @@
+<html>
+
+<head>
+  <title>Test Runner</title>
+  <script>
+    // we load from localhost, and have the ability to
+    // change the scripts that are being served. Check the
+    // web-test-runner.config.js file for details
+    window.RUM_BASE = window.origin;
+    window.hlx = {
+      RUM_MASK_URL: 'full'
+    };
+    // we log what's being sent to the "server"
+    window.called = [];
+    // and navigator.sendBeacon has been replaced with
+    // a call to fakeSendBeacon
+    window.fakeSendBeacon = function (url, payload) {
+      // if payload is a string, we assume it's a JSON string
+      if (typeof payload === 'string') {
+        window.called.push(JSON.parse(payload));
+      } else {
+        // it's a blob
+        payload.text().then((text) => {
+          window.called.push(JSON.parse(text));
+        });
+      }
+    };
+  </script>
+</head>
+
+<body>
+  <img src="/test/it/img.test.html">
+  <script type="module">
+    import { runTests } from '@web/test-runner-mocha';
+    import { sendMouse } from '@web/test-runner-commands';
+    import { assert } from '@esm-bundle/chai';
+
+    runTests(async () => {
+      beforeEach(() => {
+        const usp = new URLSearchParams(window.location.search);
+        usp.append('redirect-from', 'https://www.example.com');
+        window.history.replaceState({}, '', `${window.location.pathname}?${usp.toString()}`);
+        const script = document.createElement('script');
+        script.type = 'text/javascript';
+        script.src = '/.rum/@adobe/helix-rum-js@^2/dist/rum-standalone.js';
+        document.head.appendChild(script);
+      });
+
+      describe('HTML Integration Tests', () => {
+
+        it('Can load rum enhancer through a (prepared) helix-rum-js, while pretending to be redirected', async () => {
+
+          await sendMouse({ type: 'click', position: [100, 100] });
+
+          await new Promise((resolve) => {
+            setTimeout(resolve, 3000);
+          });
+
+          await sendMouse({ type: 'click', position: [10, 10] });
+
+          assert(window.called.some((call) => call.checkpoint === 'top'), 'top checkpoint missing');
+          assert(window.called.some((call) => call.checkpoint === 'redirect'), 'redirect checkpoint missing');
+          assert(window.called.some((call) => call.checkpoint === 'enter'), 'enter checkpoint missing');
+          assert(window.called.some((call) => call.checkpoint === 'viewmedia'), 'viewmedia checkpoint missing');
+          assert(window.called.some((call) => call.checkpoint === 'cwv'), 'cwv checkpoint missing');
+          assert(window.called.some((call) => call.checkpoint === 'click'), 'click checkpoint missing');
+        });
+
+      });
+    });
+  </script>
+</body>
diff --git a/test/it/navigation.test.html b/test/it/navigation.test.html
@@ -28,7 +28,8 @@
             getEntries() {
               return [
                 {
-                  type: 'navigate'
+                  type: 'navigate',
+                  redirectCount: 1
                 },
                 {
                   type: 'reload'
@@ -68,11 +69,14 @@
             setTimeout(resolve, 1000);
           });
 
-          expect(called).to.have.lengthOf(5);
+          expect(called).to.have.lengthOf(6, 'we expect six calls, got ' + called.map((c) => c[0]).join(', '));
           expect(called[0][0]).to.equal('navigate');
-          expect(called[1][0]).to.equal('reload');
-          expect(called[2][0]).to.equal('back_forward');
-          expect(called[3][0]).to.equal('prerender');
+          expect(called[1][0]).to.equal('redirect');
+          expect(called[1][1].target).to.equal(1);
+          expect(called[2][0]).to.equal('reload');
+          expect(called[3][0]).to.equal('back_forward');
+          expect(called[4][0]).to.equal('prerender');
+          expect(called[5][0]).to.equal('language');
         });
 
       });