Coveo: Fix vertical overflow race condition

Noticed that on hard page refreshes, and slower connections
that I would still see the extra vertical overflow caused by coveo.
I assumed it was a race condition, and wrapping the removal of
`atomic-relevance-inspector` in a timeout, would generally resolve it.
I didn't want a timeout to be the "fix" here, so I added the Mutation
Observer (https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver)
which appears to be the safest approach.
There's an overall 5 second timeout still, in case search never renders
for whatever reason.

Author: nginx-jack

assets/js/coveo.js

@@ -1,3 +1,30 @@
+const hideShadowElement = (shadowRoot, selector, timeout = 5000) => {
+  if (!shadowRoot) return;
+
+  const hideElement = () => {
+    const el = shadowRoot.querySelector(selector);
+    if (el) {
+      el.style.display = 'none';
+      return true;
+    }
+    return false;
+  };
+
+  if (hideElement()) {
+    return;
+  }
+
+  const observer = new MutationObserver((_mutations, obs) => {
+    if (hideElement()) {
+      obs.disconnect();
+    }
+  });
+
+  observer.observe(shadowRoot, { childList: true, subtree: true });
+
+  setTimeout(() => observer.disconnect(), timeout);
+};
+
 function isJwtExpired(token) {
   const parts = token.split('.');
   if (parts.length !== 3) {
@@ -90,14 +117,8 @@ async function atomicCoveo() {
     await searchBarSidebar.executeFirstSearch();
   }
 
-  /* Hide atomic-relevance-inspector */
-  const shadowElements = searchBarHeader.shadowRoot.childNodes;
-  for (let i = 0; i < shadowElements.length; i++) {
-    const val = shadowElements[i];
-    if (val.localName === 'atomic-relevance-inspector') {
-      val.style.display = 'none';
-      break;
-    }
+  if (searchBarHeader?.shadowRoot) {
+    hideShadowElement(searchBarHeader.shadowRoot, 'atomic-relevance-inspector');
   }
 }