diff --git a/change/@fluentui-react-positioning-49f77ad4-3265-436c-b6b1-51312f5591ae.json b/change/@fluentui-react-positioning-49f77ad4-3265-436c-b6b1-51312f5591ae.json
new file mode 100644
index 00000000000000..8117df7cf01143
--- /dev/null
+++ b/change/@fluentui-react-positioning-49f77ad4-3265-436c-b6b1-51312f5591ae.json
@@ -0,0 +1,7 @@
+{
+  "type": "patch",
+  "comment": "Wrap toggleScrollListener calls in requestAnimationFrame callback.",
+  "packageName": "@fluentui/react-positioning",
+  "email": "xinychen@microsoft.com",
+  "dependentChangeType": "patch"
+}
diff --git a/packages/react-components/react-positioning/src/usePositioning.ts b/packages/react-components/react-positioning/src/usePositioning.ts
index 5c054c6d14f928..1d918950a90664 100644
--- a/packages/react-components/react-positioning/src/usePositioning.ts
+++ b/packages/react-components/react-positioning/src/usePositioning.ts
@@ -267,17 +267,21 @@ function useContainerRef(updatePosition: () => void, enabled: boolean) {
       Object.assign(container.style, { position: 'fixed', left: 0, top: 0, margin: 0 });
     }
 
-    toggleScrollListener(container, prevContainer, updatePosition);
-
-    updatePosition();
+    // toggleScrollListener requires computed styles; thus use RAF to prevent forced style reevaluation.
+    window.requestAnimationFrame(() => {
+      toggleScrollListener(container, prevContainer, updatePosition);
+      updatePosition();
+    });
   });
 }
 
 function useTargetRef(updatePosition: () => void) {
   return useCallbackRef<HTMLElement | PositioningVirtualElement | null>(null, (target, prevTarget) => {
-    toggleScrollListener(target, prevTarget, updatePosition);
-
-    updatePosition();
+    // toggleScrollListener requires computed styles; thus use RAF to prevent forced style reevaluation.
+    window.requestAnimationFrame(() => {
+      toggleScrollListener(target, prevTarget, updatePosition);
+      updatePosition();
+    });
   });
 }