@cfp-studio/iframe 18.0.1 → 18.3.0

package/preview/index.html

@@ -28,11 +28,23 @@
           else if (event.kind === "error" && event.source === "renderer") {
             window.__PREVIEWJS_IFRAME__.lastRenderFailed = true;
           }
-          // 调用控制器的 onPreviewEvent 方法处理事件
-          (
-            // 注意: 与 core/src/html-error.ts 中的代码保持同步.
-            window.__PREVIEWJS_CONTROLLER__ || window.parent.__PREVIEWJS_CONTROLLER__
-          ).onPreviewEvent(event);
+          // 调用控制器的 onPreviewEvent 方法处理事件.
+          // 跨域 iframe 无法直接读取 parent 的属性，此时走 postMessage.
+          let delivered = false;
+          try {
+            const controller =
+              // 注意: 与 core/src/html-error.ts 中的代码保持同步.
+              window.__PREVIEWJS_CONTROLLER__ || window.parent.__PREVIEWJS_CONTROLLER__;
+            if (controller) {
+              controller.onPreviewEvent(event);
+              delivered = true;
+            }
+          } catch {
+            // cross-origin parent; fall through to postMessage
+          }
+          if (!delivered && window.parent !== window) {
+            window.parent.postMessage({ kind: "preview-event", event }, "*");
+          }
         },
         /**
          * 刷新预览

package/dist/index.d.ts

@@ -1,268 +0,0 @@
-import { UpdatePayload } from 'vite/types/hmrPayload';
-
-/**
- * 扩展全局 Window 对象，定义在 iframe 和其父窗口中使用的特定属性
- */
-declare global {
-    interface Window {
-        /**
-         * iframe 中暴露的对象，用于管理渲染状态和报告事件
-         */
-        __PREVIEWJS_IFRAME__: {
-            /**
-             * 表示最后一次渲染是否失败
-             */
-            lastRenderFailed: boolean;
-            toggleInspect: boolean;
-            /**
-             * 处理 HMR 更新
-             * @param payload - HMR 更新的负载
-             */
-            /**
-             * 报告预览事件
-             * @param event - 预览事件对象
-             */
-            reportEvent(event: PreviewEvent): void;
-            /**
-             * 刷新预览，可选参数指定刷新选项
-             * @param options - 刷新选项
-             */
-            refresh(options?: RefreshOptions): void;
-            /**
-             * 渲染预览，可选异步函数，接收渲染选项
-             * @param options - 渲染选项
-             * @returns 渲染完成的 Promise
-             */
-            render?(options: RenderOptions): Promise<void>;
-        };
-        /**
-         * 通常在 iframe 的父窗口中暴露，用于跟踪 iframe 的状态
-         */
-        __PREVIEWJS_CONTROLLER__: {
-            /**
-             * 处理预览事件
-             * @param event - 预览事件对象
-             */
-            onPreviewEvent(event: PreviewEvent): void;
-        };
-    }
-}
-/**
- * 刷新预览的选项
- */
-type RefreshOptions = {
-    /**
-     * 是否重新获取可预览模块
-     */
-    refetchPreviewableModule?: boolean;
-    /**
-     * 是否重新获取包装模块
-     * added by Anthony on 2025-04-08
-     */
-    refetchWrapperModule?: boolean;
-    /**
-     * 可预览模块
-     */
-    previewableModule?: any;
-    /**
-     * 包装模块
-     */
-    wrapperModule?: any;
-};
-/**
- * 预览 iframe 的状态
- */
-type PreviewIframeState = {
-    /**
-     * 表示是否正在加载
-     */
-    loading: boolean;
-    /**
-     * 表示是否已经渲染
-     */
-    rendered: boolean;
-    /**
-     * 预览错误列表
-     */
-    errors: PreviewError[];
-    /**
-     * 日志消息列表
-     */
-    logs: LogMessage[];
-    /**
-     * 操作列表
-     */
-    actions: Action[];
-};
-/**
- * 创建控制器的选项
- */
-type CreateControllerOptions = {
-    /**
-     * 获取 iframe 元素的函数
-     * @returns HTMLIFrameElement 或 null
-     */
-    getIframe: () => HTMLIFrameElement | null;
-    /**
-     * 状态更新时的回调函数
-     * @param state - 预览 iframe 的状态
-     */
-    onStateUpdate?: (state: PreviewIframeState) => void;
-};
-/**
- * 渲染选项
- */
-type RenderOptions = {
-    /**
-     * 自动生成的回调属性源代码
-     */
-    autogenCallbackPropsSource: string;
-    /**
-     * 属性赋值源代码
-     */
-    propsAssignmentSource: string;
-};
-/**
- * 创建预览 iframe 控制器
- * @param options - 创建控制器的选项
- * @returns 预览 iframe 控制器实例
- */
-declare function createController(options: CreateControllerOptions): PreviewIframeController;
-/**
- * 预览 iframe 控制器接口
- */
-type PreviewIframeController = {
-    /**
-     * 渲染预览
-     * @param previewableId - 可预览项的 ID
-     * @param options - 渲染选项
-     */
-    render(previewableId: string, options: RenderOptions): void;
-};
-/**
- * 预览事件类型
- */
-type PreviewEvent = Bootstrapping | Bootstrapped | ViteBeforeUpdate | ViteAfterUpdate | ViteInvalidate | ViteBeforeReload | BeforeRender | Rendered | Action | LogMessage | PreviewError | ToggleInspect;
-type ToggleInspect = {
-    kind: "toggle-inspect";
-    enabled: boolean;
-};
-/**
- * 正在初始化事件
- */
-type Bootstrapping = {
-    kind: "bootstrapping";
-};
-/**
- * 初始化完成事件
- */
-type Bootstrapped = {
-    kind: "bootstrapped";
-};
-/**
- * Vite 预更新事件
- */
-type ViteBeforeUpdate = {
-    kind: "vite-before-update";
-    payload: UpdatePayload;
-};
-/**
- * Vite 更新后事件
- */
-type ViteAfterUpdate = {
-    kind: "vite-after-update";
-    payload: UpdatePayload;
-};
-/**
- * Vite 失效事件
- */
-type ViteInvalidate = {
-    kind: "vite-invalidate";
-};
-/**
- * Vite 预重载事件
- */
-type ViteBeforeReload = {
-    kind: "vite-before-reload";
-};
-/**
- * 渲染前事件
- */
-type BeforeRender = {
-    kind: "before-render";
-};
-/**
- * 渲染完成事件
- */
-type Rendered = {
-    kind: "rendered";
-};
-/**
- * 操作事件
- */
-type Action = {
-    kind: "action";
-    type: "fn" | "url";
-    path: string;
-};
-/**
- * 日志消息事件
- */
-type LogMessage = {
-    kind: "log-message";
-    level: LogLevel;
-    message: string;
-    timestamp: number;
-};
-/**
- * 预览错误事件
- */
-type PreviewError = {
-    kind: "error";
-    source: "load";
-    message: string;
-} | {
-    kind: "error";
-    source: "hmr";
-    modulePath: string;
-    message: string;
-} | {
-    kind: "error";
-    source: "vite";
-    message: string;
-} | {
-    kind: "error";
-    source: "renderer";
-    message: string;
-};
-/**
- * 日志级别
- */
-type LogLevel = "log" | "info" | "warn" | "error";
-/**
- * 渲染器加载器函数
- * @param options - 加载器选项
- * @returns 包含渲染函数和 JSX 工厂函数的对象
- */
-type RendererLoader = (options: {
-    wrapperModule: any;
-    wrapperName?: string;
-    previewableModule: any;
-    previewableName: string;
-    renderId: number;
-    shouldAbortRender: () => boolean;
-}) => Promise<{
-    render: (getProps: GetPropsFn) => Promise<void>;
-    jsxFactory: ((type: any, props: any, ...children: any[]) => any) | null;
-}>;
-/**
- * 获取属性函数
- * @param options - 获取属性的选项
- * @returns 属性对象
- */
-type GetPropsFn = (options: {
-    presetGlobalProps: any;
-    presetProps: any;
-}) => Record<string, any>;
-
-export { type Action, type BeforeRender, type Bootstrapped, type Bootstrapping, type CreateControllerOptions, type GetPropsFn, type LogLevel, type LogMessage, type PreviewError, type PreviewEvent, type PreviewIframeController, type PreviewIframeState, type RefreshOptions, type RenderOptions, type Rendered, type RendererLoader, type ToggleInspect, type ViteAfterUpdate, type ViteBeforeReload, type ViteBeforeUpdate, type ViteInvalidate, createController };