From 42518a1ecec12b2b5341618b03ea0d3f97a659af Mon Sep 17 00:00:00 2001
From: Liu Liu <liuliu-dev@github.com>
Date: Fri, 27 Mar 2026 09:24:32 -0700
Subject: [PATCH 1/4] logs

---
 .../src/AnchoredOverlay/AnchoredOverlay.tsx   | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx b/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
index 9b5c7c4b858..f03e92f3b22 100644
--- a/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
+++ b/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
@@ -257,10 +257,25 @@ export const AnchoredOverlay: React.FC<React.PropsWithChildren<AnchoredOverlayPr
   const id = popoverId.replaceAll(':', '_') // popoverId can contain colons which are invalid in CSS custom property names, so we replace them with underscores
 
   useEffect(() => {
-    if (!cssAnchorPositioning || !anchorRef.current) return
-
+    // eslint-disable-next-line no-console
+    console.log('[AnchoredOverlay anchor-name effect]', {
+      cssAnchorPositioning,
+      anchorRefCurrent: anchorRef.current,
+      anchorRefCurrentTagName: anchorRef.current?.tagName,
+      id,
+    })
+    if (!cssAnchorPositioning || !anchorRef.current) {
+      // eslint-disable-next-line no-console
+      console.log(
+        '[AnchoredOverlay anchor-name effect] BAILING -',
+        !cssAnchorPositioning ? 'cssAnchorPositioning is false' : 'anchorRef.current is null',
+      )
+      return
+    }
     const anchor = anchorRef.current
     const overlay = overlayRef.current
+    // eslint-disable-next-line no-console
+    console.log('[AnchoredOverlay anchor-name effect] SETTING anchor-name on', anchor.tagName, anchor)
     anchor.style.setProperty('anchor-name', `--anchored-overlay-anchor-${id}`)
 
     return () => {

From 60c20eec3ce2e7613050b4147b6349bc752cf31c Mon Sep 17 00:00:00 2001
From: Liu Liu <liuliu-dev@github.com>
Date: Fri, 27 Mar 2026 10:02:56 -0700
Subject: [PATCH 2/4] deps:open

---
 packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx b/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
index f03e92f3b22..b2c84643fba 100644
--- a/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
+++ b/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
@@ -284,7 +284,7 @@ export const AnchoredOverlay: React.FC<React.PropsWithChildren<AnchoredOverlayPr
         overlay.style.removeProperty('position-anchor')
       }
     }
-  }, [cssAnchorPositioning, anchorRef, overlayRef, id])
+  }, [cssAnchorPositioning, anchorRef, overlayRef, id, open])
 
   // Track the overlay element so we can re-run the effect when it changes.
   // The overlay unmounts when closed, so each open creates a new DOM node -

From b77c3f8e6a8d85ab45adfa259e34e70268d5c9c7 Mon Sep 17 00:00:00 2001
From: Liu Liu <liuliu-dev@github.com>
Date: Fri, 27 Mar 2026 10:31:52 -0700
Subject: [PATCH 3/4] remove logs

---
 .../react/src/AnchoredOverlay/AnchoredOverlay.tsx  | 14 --------------
 1 file changed, 14 deletions(-)

diff --git a/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx b/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
index b2c84643fba..ea0bf5be8e2 100644
--- a/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
+++ b/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
@@ -257,25 +257,11 @@ export const AnchoredOverlay: React.FC<React.PropsWithChildren<AnchoredOverlayPr
   const id = popoverId.replaceAll(':', '_') // popoverId can contain colons which are invalid in CSS custom property names, so we replace them with underscores
 
   useEffect(() => {
-    // eslint-disable-next-line no-console
-    console.log('[AnchoredOverlay anchor-name effect]', {
-      cssAnchorPositioning,
-      anchorRefCurrent: anchorRef.current,
-      anchorRefCurrentTagName: anchorRef.current?.tagName,
-      id,
-    })
     if (!cssAnchorPositioning || !anchorRef.current) {
-      // eslint-disable-next-line no-console
-      console.log(
-        '[AnchoredOverlay anchor-name effect] BAILING -',
-        !cssAnchorPositioning ? 'cssAnchorPositioning is false' : 'anchorRef.current is null',
-      )
       return
     }
     const anchor = anchorRef.current
     const overlay = overlayRef.current
-    // eslint-disable-next-line no-console
-    console.log('[AnchoredOverlay anchor-name effect] SETTING anchor-name on', anchor.tagName, anchor)
     anchor.style.setProperty('anchor-name', `--anchored-overlay-anchor-${id}`)
 
     return () => {

From f44ef2df9dfa5c1e8ddc0b4aca218c1f84a763b3 Mon Sep 17 00:00:00 2001
From: Liu Liu <liuliu-dev@github.com>
Date: Fri, 27 Mar 2026 13:18:24 -0700
Subject: [PATCH 4/4] clean up

---
 packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx b/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
index ea0bf5be8e2..65af71b83dd 100644
--- a/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
+++ b/packages/react/src/AnchoredOverlay/AnchoredOverlay.tsx
@@ -257,9 +257,8 @@ export const AnchoredOverlay: React.FC<React.PropsWithChildren<AnchoredOverlayPr
   const id = popoverId.replaceAll(':', '_') // popoverId can contain colons which are invalid in CSS custom property names, so we replace them with underscores
 
   useEffect(() => {
-    if (!cssAnchorPositioning || !anchorRef.current) {
-      return
-    }
+    if (!cssAnchorPositioning || !anchorRef.current) return
+
     const anchor = anchorRef.current
     const overlay = overlayRef.current
     anchor.style.setProperty('anchor-name', `--anchored-overlay-anchor-${id}`)