Fix Mermaid diagram rendering on View Transitions

saadshahd · saadshahd · commit 8cf11f61cb0e · 2025-10-30T07:10:06.000Z
Remove conflicting Mermaid re-initialization script that was creating
a race condition with astro-mermaid's built-in View Transitions support.

The astro-mermaid integration already listens to astro:after-swap and
handles diagram re-rendering correctly with proper centering CSS.
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
@@ -130,26 +130,6 @@ const ogImageURL = new URL(ogImage, Astro.site);
         headroomInstance.init();
       });
     </script>
-
-    <!-- Re-initialize Mermaid diagrams after View Transitions -->
-    <script>
-      import mermaid from 'mermaid';
-
-      function initMermaid() {
-        // Remove data-processed attributes from any previously rendered diagrams
-        // (prevents Mermaid from skipping them on re-initialization)
-        const processedDiagrams = document.querySelectorAll('.mermaid[data-processed="true"]');
-        processedDiagrams.forEach((diagram) => {
-          diagram.removeAttribute('data-processed');
-        });
-
-        // Re-initialize Mermaid to process all unprocessed diagrams
-        mermaid.contentLoaded();
-      }
-
-      // Run on initial page load and after every View Transition
-      document.addEventListener('astro:page-load', initMermaid);
-    </script>
   </head>
   <body class="bg-background text-text antialiased">
     <!-- Scroll Progress Indicator (long-form content pages only) -->
