feat: migration to rum v2

adobe · Jun 19, 2024 · 96fbd9f · 96fbd9f
1 parent 013d39b
commit 96fbd9f
Show file tree

Hide file tree

Showing 3 changed files with 68 additions and 13 deletions.
diff --git a/src/block-loader.js b/src/block-loader.js
@@ -29,6 +29,7 @@ export function updateSectionsStatus(main) {
       } else {
         section.dataset.sectionStatus = 'loaded';
         section.style.display = null;
+        window.dispatchEvent(new CustomEvent('hlx:section:loaded', { detail: { section } }));
       }
     }
   }

diff --git a/src/setup.js b/src/setup.js
@@ -18,6 +18,7 @@ import { sampleRUM } from '@adobe/helix-rum-js';
 export function setup() {
   window.hlx = window.hlx || {};
   window.hlx.RUM_MASK_URL = 'full';
+  window.hlx.RUM_MANUAL_ENHANCE = true;
   window.hlx.codeBasePath = '';
   window.hlx.lighthouse = new URLSearchParams(window.location.search).get('lighthouse') === 'on';
 
@@ -39,17 +40,6 @@ export function setup() {
 /* c8 ignore next 14 */
 export function init() {
   setup();
-  sampleRUM('top');
-
-  window.addEventListener('load', () => sampleRUM('load'));
-
-  window.addEventListener('unhandledrejection', (event) => {
-    /* c8 ignore next */
-    sampleRUM('error', { source: event.reason.sourceURL, target: event.reason.line });
-  });
-
-  window.addEventListener('error', (event) => {
-    /* c8 ignore next */
-    sampleRUM('error', { source: event.filename, target: event.lineno });
-  });
+  sampleRUM();
+  window.addEventListener('hlx:section:loaded', sampleRUM.enhance, { once: true });
 }
diff --git a/test/block-loader/updateSectionsStatus.event.test.html b/test/block-loader/updateSectionsStatus.event.test.html
@@ -0,0 +1,64 @@
+<!DOCTYPE html>
+<html>
+  <body>
+    <main>
+      <div class="section section1" id="section1"><div class="block block11" data-block-status="initialized"></div></div>
+      <div class="section section2" id="section2"><div class="block block21" data-block-status="loading"></div></div>
+    </main>
+
+    <script type="module">
+      /* eslint-env mocha */
+      import { runTests } from '@web/test-runner-mocha';
+      import { expect } from '@esm-bundle/chai';
+      import { updateSectionsStatus } from '../../src/block-loader.js';
+
+      runTests(() => {
+        it('updateSectionsStatus - fires event', async () => {
+          const main = document.querySelector('main');
+
+          const events = [];
+          window.addEventListener('hlx:section:loaded', (event) => {
+            events.push(event);
+          });
+
+          const section1 = document.querySelector('.section1');
+          const section2 = document.querySelector('.section2');
+
+          const block11 = document.querySelector('.block11');
+          const block21 = document.querySelector('.block21');
+
+          updateSectionsStatus(main);
+
+          expect(section1.dataset.sectionStatus).to.equal('loading');
+          expect(section2.dataset.sectionStatus).to.be.undefined;
+
+          block11.dataset.blockStatus = 'loaded';
+
+          updateSectionsStatus(main);
+
+          expect(section1.dataset.sectionStatus).to.equal('loaded');
+          expect(section2.dataset.sectionStatus).to.equal('loading');
+
+          expect(events.length).to.equal(1);
+
+          expect(events[0].detail).to.exists;
+          expect(events[0].detail.section).to.exists;
+          expect(events[0].detail.section.id).to.equal('section1');
+
+          block21.dataset.blockStatus = 'loaded';
+
+          updateSectionsStatus(main);
+
+          expect(section1.dataset.sectionStatus).to.equal('loaded');
+          expect(section2.dataset.sectionStatus).to.equal('loaded');
+
+          expect(events.length).to.equal(2);
+
+          expect(events[1].detail).to.exists;
+          expect(events[1].detail.section).to.exists;
+          expect(events[1].detail.section.id).to.equal('section2');
+        });
+      });
+    </script>
+  </body>
+</html>