chore: introduce cross-origin behaviour for docs version switching

measuredco · Dec 13, 2023 · 5bdeb86 · 5bdeb86
1 parent ccf7aa5
commit 5bdeb86
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 11 deletions.
diff --git a/apps/docs/pages/_app.tsx b/apps/docs/pages/_app.tsx
@@ -9,7 +9,7 @@ export default function DocsApp({ Component, pageProps }: AppProps) {
   const router = useRouter();
 
   useEffect(() => {
-    if (!window.parent) return;
+    if (!window || window.parent === window) return;
 
     const message: Message = {
       type: "routeChange",
@@ -25,7 +25,7 @@ export default function DocsApp({ Component, pageProps }: AppProps) {
         title: window.document.title,
       };
 
-      window.parent.postMessage(message);
+      window.parent.postMessage(message, "https://puckeditor.com");
     };
 
     router.events.on("routeChangeComplete", handleRouteChange);

diff --git a/apps/docs/pages/v/[[...fullPath]].tsx b/apps/docs/pages/v/[[...fullPath]].tsx
@@ -1,15 +1,32 @@
-import { useEffect, useRef } from "react";
+import { useEffect } from "react";
 
 export type Message = {
   type: "routeChange";
   url?: string;
   title: string;
 };
 
-export default function Version({ path, version }) {
+export default function Version({ path, version = "" }) {
+  const versionSlug = version.replace(/\./g, "");
+
+  const base =
+    version === "canary"
+      ? `https://puck-docs-git-main-measured.vercel.app`
+      : `https://puck-docs-git-releases-v${versionSlug}-measured.vercel.app`;
+
+  const src = `${base}/${path}`;
+
   useEffect(() => {
     const handleMessageReceived = (event: MessageEvent) => {
       if (event.data.type === "routeChange") {
+        if (event.origin !== base) {
+          console.warn(
+            `Origin does not match expected target: ${event.origin} vs ${base}`
+          );
+
+          return;
+        }
+
         const routeChange = event.data as Message;
 
         if (routeChange.url) {
@@ -27,13 +44,6 @@ export default function Version({ path, version }) {
     return () => window.removeEventListener("message", handleMessageReceived);
   }, []);
 
-  const versionSlug = version.replace(/\./g, "");
-
-  const src =
-    version === "canary"
-      ? `https://puck-docs-git-canary-measured.vercel.app`
-      : `https://puck-docs-git-releases-v${versionSlug}-measured.vercel.app`;
-
   return (
     <iframe
       src={src}