From bfd72347cf719a7500dd98484d037c2b2320729c Mon Sep 17 00:00:00 2001
From: Jacky Zhao <j.zhao2k19@gmail.com>
Date: Fri, 11 Apr 2025 08:18:28 -0700
Subject: [PATCH] fix(popover): clear popovers more aggressively, use href as
 id

---
 quartz/components/scripts/popover.inline.ts | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/quartz/components/scripts/popover.inline.ts b/quartz/components/scripts/popover.inline.ts
index 04ffd58..d8f1e1a 100644
--- a/quartz/components/scripts/popover.inline.ts
+++ b/quartz/components/scripts/popover.inline.ts
@@ -1,7 +1,6 @@
 import { computePosition, flip, inline, shift } from "@floating-ui/dom"
 import { normalizeRelativeURLs } from "../../util/path"
 import { fetchCanonical } from "./util"
-import { randomIdNonSecure } from "../../util/random"
 
 const p = new DOMParser()
 
@@ -25,6 +24,7 @@ async function mouseEnterHandler(
   }
 
   function showPopover(popoverElement: HTMLElement) {
+    clearActivePopover()
     popoverElement.classList.add("active-popover")
     setPosition(popoverElement as HTMLElement)
 
@@ -42,7 +42,7 @@ async function mouseEnterHandler(
   const hash = decodeURIComponent(targetUrl.hash)
   targetUrl.hash = ""
   targetUrl.search = ""
-  const popoverId = `popover-${link.dataset.slug ?? randomIdNonSecure()}`
+  const popoverId = `popover-${link.pathname}`
   const prevPopoverElement = document.getElementById(popoverId)
   const hasAlreadyBeenFetched = () => !!document.getElementById(popoverId)
 
@@ -117,10 +117,10 @@ function clearActivePopover() {
 }
 
 document.addEventListener("nav", () => {
-  const links = [...document.getElementsByClassName("internal")] as HTMLAnchorElement[]
+  const links = [...document.querySelectorAll("a.internal")] as HTMLAnchorElement[]
   for (const link of links) {
-    link.addEventListener("mouseleave", clearActivePopover)
     link.addEventListener("mouseenter", mouseEnterHandler)
+    link.addEventListener("mouseleave", clearActivePopover)
     window.addCleanup(() => {
       link.removeEventListener("mouseenter", mouseEnterHandler)
       link.removeEventListener("mouseleave", clearActivePopover)