From d8f611a3a5a488d46688fe0a728abb70ada0df48 Mon Sep 17 00:00:00 2001 From: DeveloperViraj Date: Mon, 6 Oct 2025 23:29:32 +0530 Subject: [PATCH 1/2] fix(Sandpack): prevent phantom browser history entries on scroll (#8047) --- src/components/MDX/Sandpack/Preview.tsx | 16 ++++++++++------ 1 file changed, 10 insertions(+), 6 deletions(-) diff --git a/src/components/MDX/Sandpack/Preview.tsx b/src/components/MDX/Sandpack/Preview.tsx index ead9341b6e3..2739c1e3bd7 100644 --- a/src/components/MDX/Sandpack/Preview.tsx +++ b/src/components/MDX/Sandpack/Preview.tsx @@ -97,14 +97,18 @@ export function Preview({ const sandpackIdle = sandpack.status === 'idle'; - useEffect(function createBundler() { - const iframeElement = iframeRef.current!; +useEffect(function createBundler() { + const iframeElement = iframeRef.current!; + if (!iframeElement.dataset.registered) { registerBundler(iframeElement, clientId); + iframeElement.dataset.registered = 'true'; + } + return () => { + unregisterBundler(clientId); + iframeElement.dataset.registered = ''; + }; +}, []); - return () => { - unregisterBundler(clientId); - }; - }, []); useEffect( function bundlerListener() { From 7fb86044f2394fd1a49f7456b9464d2fa54e9f12 Mon Sep 17 00:00:00 2001 From: DeveloperViraj Date: Mon, 6 Oct 2025 23:48:26 +0530 Subject: [PATCH 2/2] chore(format): run prettier to fix CI lint errors --- src/components/MDX/Sandpack/Preview.tsx | 23 +++++++++++------------ 1 file changed, 11 insertions(+), 12 deletions(-) diff --git a/src/components/MDX/Sandpack/Preview.tsx b/src/components/MDX/Sandpack/Preview.tsx index 2739c1e3bd7..38a6fc03171 100644 --- a/src/components/MDX/Sandpack/Preview.tsx +++ b/src/components/MDX/Sandpack/Preview.tsx @@ -97,18 +97,17 @@ export function Preview({ const sandpackIdle = sandpack.status === 'idle'; -useEffect(function createBundler() { - const iframeElement = iframeRef.current!; - if (!iframeElement.dataset.registered) { - registerBundler(iframeElement, clientId); - iframeElement.dataset.registered = 'true'; - } - return () => { - unregisterBundler(clientId); - iframeElement.dataset.registered = ''; - }; -}, []); - + useEffect(function createBundler() { + const iframeElement = iframeRef.current!; + if (!iframeElement.dataset.registered) { + registerBundler(iframeElement, clientId); + iframeElement.dataset.registered = 'true'; + } + return () => { + unregisterBundler(clientId); + iframeElement.dataset.registered = ''; + }; + }, []); useEffect( function bundlerListener() {