fix: ensure pageviews are fetched after DOM is loaded (cotes2020#2071)

kungfux · Nov 30, 2024 · b4019f3 · b4019f3
1 parent 2966fc1
commit b4019f3
Showing 1 changed file with 8 additions and 6 deletions.
diff --git a/_includes/pageviews/goatcounter.html b/_includes/pageviews/goatcounter.html
@@ -1,12 +1,13 @@
 <!-- Display GoatCounter pageviews -->
 <script>
-  let pv = document.getElementById('pageviews');
+  document.addEventListener('DOMContentLoaded', () => {
+    const pv = document.getElementById('pageviews');
 
-  if (pv !== null) {
-    const uri = location.pathname.replace(/\/$/, '');
-    const url = `https://{{ site.analytics.goatcounter.id }}.goatcounter.com/counter/${encodeURIComponent(uri)}.json`;
+    if (pv !== null) {
+      const uri = location.pathname.replace(/\/$/, '');
+      const url = `https://{{ site.analytics.goatcounter.id }}.goatcounter.com/counter/${encodeURIComponent(uri)}.json`;
 
-    fetch(url)
+      fetch(url)
       .then((response) => response.json())
       .then((data) => {
         const count = data.count.replace(/\s/g, '');
@@ -15,5 +16,6 @@
       .catch((error) => {
         pv.innerText = '1';
       });
-  }
+    }
+  });
 </script>