dataquest-dev
diff --git a/‎src/index.html‎
Lines changed: 114 additions & 0 deletions b/‎src/index.html‎
Lines changed: 114 additions & 0 deletions
@@ -7,10 +7,124 @@
   <title>DSpace</title>
   <meta name="viewport" content="width=device-width,minimum-scale=1">
   <meta http-equiv="cache-control" content="no-store">
+  <style id="__dspace-ssr-overlay-style">
+    #__dspace_ssr_overlay {
+      position: fixed;
+      inset: 0;
+      z-index: 10000;
+      background: #fff;
+      overflow: hidden;
+      pointer-events: none;
+    }
+  </style>
 </head>
 
 <body>
   <ds-app></ds-app>
+<script>
+/*
+  Keeps the server-rendered page on screen while Angular rebuilds it underneath.
+
+  provideClientHydration() is registered in the browser config only, never in the server one, so
+  platform-server emits no hydration annotations and the browser clears <ds-app> and renders the
+  whole tree again. Upstream issue: DSpace/dspace-angular#3867.
+
+  We paint a detached clone on top instead of moving the server-rendered nodes, so nothing Angular
+  touches is disturbed, and remove it once <ds-app> has stopped changing and shows a visible
+  #main-content. Deliberately self-contained: an earlier version drove the removal from
+  AppComponent and never got there, because Angular constructs it long after this script runs.
+*/
+(function () {
+  if (typeof window === 'undefined' || typeof document === 'undefined') return;
+  // Cypress and Playwright drive the real app; a cloned copy breaks element-uniqueness selectors.
+  if (typeof window.Cypress !== 'undefined') return;
+  if (typeof navigator !== 'undefined' && navigator.webdriver) return;
+
+  var QUIET_MS = 600;      // the rebuild is done after this long with no element added or removed
+  var BACKSTOP_MS = 10000; // reveal regardless, so a page that never goes quiet is not held hostage
+  var MIN_HEIGHT_PX = 200; // proves <ds-app> is no longer the empty shell
+
+  try {
+    var app = document.querySelector('ds-app');
+    // No server-rendered content, e.g. an SSR-excluded route, so there is nothing to cover.
+    if (!app || !app.firstElementChild) return;
+    if (document.getElementById('__dspace_ssr_overlay')) return;
+
+    var overlay = document.createElement('div');
+    overlay.id = '__dspace_ssr_overlay';
+    // A visual duplicate of content the live app still exposes: keep it out of the a11y tree and
+    // out of the tab order so focus cannot land on the dead cloned controls.
+    overlay.setAttribute('aria-hidden', 'true');
+    overlay.setAttribute('inert', '');
+
+    // Clone, never move. The clone keeps its _nghost/_ngcontent attributes, so the component styles
+    // already in <head> still apply and the frozen frame looks like the server-rendered paint.
+    overlay.appendChild(app.cloneNode(true));
+    document.body.appendChild(overlay);
+
+    var quietTimer = null;
+    var observer = null;
+
+    var remove = function () {
+      if (!overlay) return;
+      var el = overlay;
+      overlay = null;
+      if (observer) observer.disconnect();
+      if (quietTimer) clearTimeout(quietTimer);
+      window.__dspaceRemoveSsrOverlay = null;
+      el.style.transition = 'opacity 150ms ease-out';
+      el.style.opacity = '0';
+      setTimeout(function () {
+        if (el.parentNode) el.parentNode.removeChild(el);
+      }, 200);
+    };
+    // Exposed so an e2e run or a later change can drop the clone on demand.
+    window.__dspaceRemoveSsrOverlay = remove;
+
+    // root.component keeps .outer-wrapper display:none behind its fullscreen loader, so a visible
+    // #main-content is what tells us the routed page, and not the loader, is on screen.
+    var contentIsVisible = function () {
+      var main = app.querySelector('#main-content');
+      return !!main && main.offsetParent !== null &&
+        app.getBoundingClientRect().height >= MIN_HEIGHT_PX;
+    };
+
+    var onQuiet = function () {
+      if (!contentIsVisible()) return; // wait for the next mutation
+      // one frame, so the rebuilt content is painted before the clone fades out
+      if (typeof window.requestAnimationFrame === 'function') {
+        window.requestAnimationFrame(remove);
+      } else {
+        remove();
+      }
+    };
+
+    var restartQuietTimer = function () {
+      if (quietTimer) clearTimeout(quietTimer);
+      quietTimer = setTimeout(onQuiet, QUIET_MS);
+    };
+
+    observer = new MutationObserver(function (records) {
+      for (var i = 0; i < records.length; i++) {
+        var r = records[i];
+        if (r.type !== 'childList') continue;
+        var nodes = [].slice.call(r.addedNodes).concat([].slice.call(r.removedNodes));
+        for (var j = 0; j < nodes.length; j++) {
+          if (nodes[j].nodeType === 1) { restartQuietTimer(); return; }
+        }
+      }
+    });
+    observer.observe(app, { childList: true, subtree: true });
+    restartQuietTimer();
+
+    setTimeout(remove, BACKSTOP_MS);
+  } catch (e) {
+    if (window.console && typeof console.warn === 'function') {
+      console.warn('[dspace-ssr-overlay] disabled due to error:', e);
+    }
+  }
+})();
+</script>
 </body>
 
 <!-- do not include client bundle, it is injected with Zone already loaded -->