diff --git a/src/livePreview/eventManager/livePreviewEventManager.constant.ts b/src/livePreview/eventManager/livePreviewEventManager.constant.ts index 7d703944..1a1cab63 100644 --- a/src/livePreview/eventManager/livePreviewEventManager.constant.ts +++ b/src/livePreview/eventManager/livePreviewEventManager.constant.ts @@ -5,6 +5,7 @@ export const LIVE_PREVIEW_POST_MESSAGE_EVENTS = { CHECK_ENTRY_PAGE: "check-entry-page", URL_CHANGE: "url-change", VARIANT_PATCH: "variant-patch-update", + ON_RELOAD: "cslp-reload" } as const; export const LIVE_PREVIEW_CHANNEL_ID = "live-preview"; diff --git a/src/livePreview/eventManager/livePreviewEventManager.ts b/src/livePreview/eventManager/livePreviewEventManager.ts index fbd5693a..be4350bc 100644 --- a/src/livePreview/eventManager/livePreviewEventManager.ts +++ b/src/livePreview/eventManager/livePreviewEventManager.ts @@ -4,11 +4,17 @@ import { LIVE_PREVIEW_CHANNEL_ID } from "./livePreviewEventManager.constant"; let livePreviewPostMessage: EventManager | undefined; if (typeof window !== "undefined") { - livePreviewPostMessage = new EventManager(LIVE_PREVIEW_CHANNEL_ID, { + let eventOptions = { target: window.parent, debug: false, - suppressErrors: true, - }); + suppressErrors: true + }; + + if (window.opener) { + eventOptions.target = window.opener; + } + + livePreviewPostMessage = new EventManager(LIVE_PREVIEW_CHANNEL_ID, eventOptions); } export default livePreviewPostMessage; diff --git a/src/livePreview/eventManager/postMessageEvent.hooks.ts b/src/livePreview/eventManager/postMessageEvent.hooks.ts index 2cf60b01..01ddc59d 100644 --- a/src/livePreview/eventManager/postMessageEvent.hooks.ts +++ b/src/livePreview/eventManager/postMessageEvent.hooks.ts @@ -7,6 +7,7 @@ import { HistoryLivePreviewPostMessageEventData, LivePreviewInitEventResponse, OnChangeLivePreviewPostMessageEventData, + OnReloadLivePreviewPostMessageEventData, } from "./types/livePreviewPostMessageEvent.type"; /** @@ -57,6 +58,20 @@ export function useOnEntryUpdatePostMessageEvent(): void { ); } +export function useOnReloadPostMessageEvent(): void { + livePreviewPostMessage?.on( + LIVE_PREVIEW_POST_MESSAGE_EVENTS.ON_RELOAD, + (event) => { + setConfigFromParams({ + live_preview: event.data.hash, + }); + if (window) { + window.location?.reload(); + } + } + ); +} + export function sendInitializeLivePreviewPostMessageEvent(): void { livePreviewPostMessage ?.send( @@ -109,6 +124,7 @@ export function sendInitializeLivePreviewPostMessageEvent(): void { useHistoryPostMessageEvent(); useOnEntryUpdatePostMessageEvent(); + useOnReloadPostMessageEvent(); }) .catch((e) => { // TODO: add debug logs that runs conditionally diff --git a/src/livePreview/eventManager/types/livePreviewPostMessageEvent.type.ts b/src/livePreview/eventManager/types/livePreviewPostMessageEvent.type.ts index d27bd232..5e6f253c 100644 --- a/src/livePreview/eventManager/types/livePreviewPostMessageEvent.type.ts +++ b/src/livePreview/eventManager/types/livePreviewPostMessageEvent.type.ts @@ -8,6 +8,10 @@ export interface OnChangeLivePreviewPostMessageEventData { hash: string; } +export interface OnReloadLivePreviewPostMessageEventData { + hash: string; +} + export interface LivePreviewInitEventResponse { contentTypeUid: string; entryUid: string;