Fix empty index

Resolves #2514

Author: Gerrit0

CHANGELOG.md

@@ -1,5 +1,9 @@
 # Unreleased
 
+### Bug Fixes
+
+-   Fixed an issue introduced with 0.25.10 which causes the page index to initially render empty, #2514.
+
 ## v0.25.10 (2024-03-03)
 
 ### Bug Fixes

src/lib/output/themes/default/assets/typedoc/Application.ts

@@ -39,9 +39,11 @@ export class Application {
             this.ensureFocusedElementVisible(),
         );
 
-        // We're on a *really* slow network connection.
+        // We're on a *really* slow network connection and the inline JS
+        // has already made the page display.
         if (!document.body.style.display) {
             this.scrollToHash();
+            this.updateIndexVisibility();
         }
     }
 
@@ -67,6 +69,7 @@ export class Application {
         if (!document.body.style.display) return;
         document.body.style.removeProperty("display");
         this.scrollToHash();
+        this.updateIndexVisibility();
     }
 
     public scrollToHash() {
@@ -102,6 +105,32 @@ export class Application {
         }
     }
 
+    public updateIndexVisibility() {
+        const indexAccordion =
+            document.querySelector<HTMLDetailsElement>(".tsd-index-content");
+        const oldOpen = indexAccordion?.open;
+        if (indexAccordion) {
+            indexAccordion.open = true;
+        }
+
+        // Hide index headings where all index items are hidden.
+        // offsetParent == null checks for display: none
+        document
+            .querySelectorAll<HTMLElement>(".tsd-index-section")
+            .forEach((el) => {
+                el.style.display = "block";
+                const allChildrenHidden = Array.from(
+                    el.querySelectorAll<HTMLElement>(".tsd-index-link"),
+                ).every((child) => child.offsetParent == null);
+
+                el.style.display = allChildrenHidden ? "none" : "block";
+            });
+
+        if (indexAccordion) {
+            indexAccordion.open = oldOpen!;
+        }
+    }
+
     /**
      * Ensures that if a user was linked to a reflection which is hidden because of filter
      * settings, that reflection is still shown.

src/lib/output/themes/default/assets/typedoc/components/Filter.ts

@@ -30,7 +30,7 @@ export class Filter extends Component {
         this.setLocalStorage(this.fromLocalStorage());
 
         style.innerHTML += `html:not(.${this.key}) .tsd-is-${this.el.name} { display: none; }\n`;
-        this.updateIndexHeadingVisibility();
+        this.app.updateIndexVisibility();
     }
 
     /**
@@ -60,32 +60,6 @@ export class Filter extends Component {
         document.documentElement.classList.toggle(this.key, this.value);
 
         this.app.filterChanged();
-        this.updateIndexHeadingVisibility();
-    }
-
-    private updateIndexHeadingVisibility() {
-        const indexAccordion =
-            document.querySelector<HTMLDetailsElement>(".tsd-index-content");
-        const oldOpen = indexAccordion?.open;
-        if (indexAccordion) {
-            indexAccordion.open = true;
-        }
-
-        // Hide index headings where all index items are hidden.
-        // offsetParent == null checks for display: none
-        document
-            .querySelectorAll<HTMLElement>(".tsd-index-section")
-            .forEach((el) => {
-                el.style.display = "block";
-                const allChildrenHidden = Array.from(
-                    el.querySelectorAll<HTMLElement>(".tsd-index-link"),
-                ).every((child) => child.offsetParent == null);
-
-                el.style.display = allChildrenHidden ? "none" : "block";
-            });
-
-        if (indexAccordion) {
-            indexAccordion.open = oldOpen!;
-        }
+        this.app.updateIndexVisibility();
     }
 }

src/lib/output/themes/default/layouts/default.tsx

@@ -44,7 +44,7 @@ export const defaultLayout = (
                 {/* settings, this appears to be a reasonable tradeoff between displaying page content without the */}
                 {/* navigation on exceptionally slow connections and not having the navigation obviously repaint. */}
                 <Raw html='document.body.style.display="none";' />
-                <Raw html='setTimeout(() => document.body.style.removeProperty("display"),500)' />
+                <Raw html='setTimeout(() => app?app.showPage():document.body.style.removeProperty("display"),500)' />
             </script>
             {context.toolbar(props)}