@nocobase/flow-engine 2.0.0-beta.13 → 2.0.0-beta.14

package/lib/utils/runjsTemplateCompat.js

@@ -34,10 +34,12 @@ module.exports = __toCommonJS(runjsTemplateCompat_exports);
 var import_jsxTransform = require("./jsxTransform");
 const RESOLVE_JSON_TEMPLATE_CALL = "ctx.resolveJsonTemplate";
 const CTX_TEMPLATE_MARKER_RE = /\{\{\s*ctx(?:\.|\[|\?\.)/;
+const CTX_LIBS_MARKER_RE = /\bctx(?:\?\.|\.)libs\b/;
 const STRINGIFY_HELPER_BASE_NAME = "__runjs_templateValueToString";
 const BARE_PLACEHOLDER_VAR_RE = /\b__runjs_ctx_tpl_\d+\b/;
 const STRINGIFY_HELPER_RE = /\b__runjs_templateValueToString(?:_\d+)?\b/;
 const PREPROCESSED_MARKER_RE = /\b__runjs_ctx_tpl_\d+\b|\b__runjs_templateValueToString(?:_\d+)?\b/;
+const ENSURE_LIBS_MARKER_RE = /\b__runjs_ensure_libs\b/;
 const PREPARE_RUNJS_CODE_CACHE_LIMIT = 256;
 const PREPARE_RUNJS_CODE_CACHE = {
   withTemplates: /* @__PURE__ */ new Map(),
@@ -186,6 +188,354 @@ function skipWhitespaceBackward(code, start) {
   return i;
 }
 __name(skipWhitespaceBackward, "skipWhitespaceBackward");
+function skipSpaceAndCommentsForward(code, start) {
+  let i = start;
+  for (; ; ) {
+    i = skipWhitespaceForward(code, i);
+    const ch = code[i];
+    const next = code[i + 1];
+    if (ch === "/" && next === "/") {
+      i = readLineComment(code, i);
+      continue;
+    }
+    if (ch === "/" && next === "*") {
+      i = readBlockComment(code, i);
+      continue;
+    }
+    return i;
+  }
+}
+__name(skipSpaceAndCommentsForward, "skipSpaceAndCommentsForward");
+function isIdentStartChar(ch) {
+  return !!ch && /[A-Za-z_$]/.test(ch);
+}
+__name(isIdentStartChar, "isIdentStartChar");
+function readIdentifier(code, start) {
+  const first = code[start];
+  if (!isIdentStartChar(first)) return null;
+  let i = start + 1;
+  while (i < code.length && isIdentChar(code[i])) i += 1;
+  return { name: code.slice(start, i), end: i };
+}
+__name(readIdentifier, "readIdentifier");
+function readSimpleStringLiteralValue(code, start, quote) {
+  if (code[start] !== quote) return null;
+  let i = start + 1;
+  let value = "";
+  while (i < code.length) {
+    const ch = code[i];
+    if (ch === "\\") {
+      const n = code[i + 1];
+      if (typeof n === "undefined") break;
+      value += n;
+      i += 2;
+      continue;
+    }
+    if (ch === quote) {
+      return { value, end: i + 1 };
+    }
+    value += ch;
+    i += 1;
+  }
+  return null;
+}
+__name(readSimpleStringLiteralValue, "readSimpleStringLiteralValue");
+function readsCtxLibsBase(code, index) {
+  if (!code.startsWith("ctx", index)) return null;
+  const before = index > 0 ? code[index - 1] : "";
+  const after = code[index + 3] || "";
+  if (isIdentChar(before) || isIdentChar(after)) return null;
+  const tail = code.slice(index + 3);
+  if (tail.startsWith(".libs")) return index + 3 + 5;
+  if (tail.startsWith("?.libs")) return index + 3 + 6;
+  return null;
+}
+__name(readsCtxLibsBase, "readsCtxLibsBase");
+function tryReadCtxLibAccess(code, index) {
+  const baseEnd = readsCtxLibsBase(code, index);
+  if (baseEnd === null) return null;
+  let i = skipSpaceAndCommentsForward(code, baseEnd);
+  const ch = code[i];
+  const next = code[i + 1];
+  const next2 = code[i + 2];
+  if (ch === "?" && next === "." && next2 === "[") {
+    i = skipSpaceAndCommentsForward(code, i + 3);
+    const q = code[i];
+    if (q === "'" || q === '"') {
+      const parsed = readSimpleStringLiteralValue(code, i, q);
+      if (!parsed) return { end: i + 1 };
+      let j = skipSpaceAndCommentsForward(code, parsed.end);
+      if (code[j] === "]") j += 1;
+      return { end: j, key: parsed.value };
+    }
+    return { end: i };
+  }
+  if (ch === "[") {
+    i = skipSpaceAndCommentsForward(code, i + 1);
+    const q = code[i];
+    if (q === "'" || q === '"') {
+      const parsed = readSimpleStringLiteralValue(code, i, q);
+      if (!parsed) return { end: i + 1 };
+      let j = skipSpaceAndCommentsForward(code, parsed.end);
+      if (code[j] === "]") j += 1;
+      return { end: j, key: parsed.value };
+    }
+    return { end: i };
+  }
+  if (ch === "?" && next === ".") {
+    i = skipSpaceAndCommentsForward(code, i + 2);
+    const ident = readIdentifier(code, i);
+    if (!ident) return { end: i };
+    return { end: ident.end, key: ident.name };
+  }
+  if (ch === ".") {
+    i = skipSpaceAndCommentsForward(code, i + 1);
+    const ident = readIdentifier(code, i);
+    if (!ident) return { end: i };
+    return { end: ident.end, key: ident.name };
+  }
+  return { end: baseEnd };
+}
+__name(tryReadCtxLibAccess, "tryReadCtxLibAccess");
+function parseDestructuredKeysFromObjectPattern(pattern) {
+  const out = [];
+  const src = String(pattern ?? "");
+  let itemStart = 0;
+  let braceDepth = 0;
+  let bracketDepth = 0;
+  let parenDepth = 0;
+  const pushItem = /* @__PURE__ */ __name((raw) => {
+    const s = String(raw ?? "").trim();
+    if (!s) return;
+    if (s.startsWith("...")) return;
+    let keyPart = s;
+    let i2 = 0;
+    let b = 0;
+    let br = 0;
+    let p = 0;
+    while (i2 < s.length) {
+      const ch = s[i2];
+      const next = s[i2 + 1];
+      if (ch === "/" && next === "/") {
+        break;
+      }
+      if (ch === "/" && next === "*") {
+        const end = s.indexOf("*/", i2 + 2);
+        i2 = end === -1 ? s.length : end + 2;
+        continue;
+      }
+      if (ch === "'" || ch === '"') {
+        let j = i2 + 1;
+        while (j < s.length) {
+          const c = s[j];
+          if (c === "\\") {
+            j += 2;
+            continue;
+          }
+          j += 1;
+          if (c === ch) break;
+        }
+        i2 = j;
+        continue;
+      }
+      if (ch === "`") {
+        let j = i2 + 1;
+        while (j < s.length) {
+          const c = s[j];
+          if (c === "\\") {
+            j += 2;
+            continue;
+          }
+          j += 1;
+          if (c === "`") break;
+        }
+        i2 = j;
+        continue;
+      }
+      if (ch === "{") b += 1;
+      else if (ch === "}") b -= 1;
+      else if (ch === "[") br += 1;
+      else if (ch === "]") br -= 1;
+      else if (ch === "(") p += 1;
+      else if (ch === ")") p -= 1;
+      if (b === 0 && br === 0 && p === 0) {
+        if (ch === ":") {
+          keyPart = s.slice(0, i2).trim();
+          break;
+        }
+        if (ch === "=") {
+          keyPart = s.slice(0, i2).trim();
+          break;
+        }
+      }
+      i2 += 1;
+    }
+    if (!keyPart) return;
+    if (keyPart.startsWith("'") || keyPart.startsWith('"')) {
+      const q = keyPart[0];
+      const parsed = readSimpleStringLiteralValue(keyPart, 0, q);
+      if (parsed) out.push(parsed.value);
+      return;
+    }
+    const m = keyPart.match(/^[A-Za-z_$][A-Za-z0-9_$]*/);
+    if (m) out.push(m[0]);
+  }, "pushItem");
+  let i = 0;
+  while (i < src.length) {
+    const ch = src[i];
+    const next = src[i + 1];
+    if (ch === "/" && next === "/") {
+      break;
+    }
+    if (ch === "/" && next === "*") {
+      const end = src.indexOf("*/", i + 2);
+      i = end === -1 ? src.length : end + 2;
+      continue;
+    }
+    if (ch === "'" || ch === '"') {
+      i = readQuotedString(src, i, ch);
+      continue;
+    }
+    if (ch === "`") {
+      i = readTemplateLiteral(src, i);
+      continue;
+    }
+    if (ch === "{") braceDepth += 1;
+    else if (ch === "}") braceDepth -= 1;
+    else if (ch === "[") bracketDepth += 1;
+    else if (ch === "]") bracketDepth -= 1;
+    else if (ch === "(") parenDepth += 1;
+    else if (ch === ")") parenDepth -= 1;
+    if (braceDepth === 0 && bracketDepth === 0 && parenDepth === 0 && ch === ",") {
+      pushItem(src.slice(itemStart, i));
+      itemStart = i + 1;
+    }
+    i += 1;
+  }
+  pushItem(src.slice(itemStart));
+  return out;
+}
+__name(parseDestructuredKeysFromObjectPattern, "parseDestructuredKeysFromObjectPattern");
+function extractUsedCtxLibKeys(code) {
+  if (!CTX_LIBS_MARKER_RE.test(code)) return [];
+  const out = /* @__PURE__ */ new Set();
+  const scanTemplateExpression = /* @__PURE__ */ __name((start) => {
+    let i2 = start;
+    let braceDepth = 1;
+    while (i2 < code.length && braceDepth > 0) {
+      const ch = code[i2];
+      const next = code[i2 + 1];
+      if (ch === "/" && next === "/") {
+        i2 = readLineComment(code, i2);
+        continue;
+      }
+      if (ch === "/" && next === "*") {
+        i2 = readBlockComment(code, i2);
+        continue;
+      }
+      if (ch === "'" || ch === '"') {
+        i2 = readQuotedString(code, i2, ch);
+        continue;
+      }
+      if (ch === "`") {
+        i2 = scanTemplateLiteral(i2 + 1);
+        continue;
+      }
+      const access = tryReadCtxLibAccess(code, i2);
+      if (access) {
+        if (access.key) out.add(access.key);
+        i2 = access.end;
+        continue;
+      }
+      if (ch === "{") braceDepth += 1;
+      else if (ch === "}") braceDepth -= 1;
+      i2 += 1;
+    }
+    return i2;
+  }, "scanTemplateExpression");
+  const scanTemplateLiteral = /* @__PURE__ */ __name((start) => {
+    let i2 = start;
+    while (i2 < code.length) {
+      const ch = code[i2];
+      const next = code[i2 + 1];
+      if (ch === "\\") {
+        i2 += 2;
+        continue;
+      }
+      if (ch === "`") return i2 + 1;
+      if (ch === "$" && next === "{") {
+        i2 = scanTemplateExpression(i2 + 2);
+        continue;
+      }
+      i2 += 1;
+    }
+    return i2;
+  }, "scanTemplateLiteral");
+  let i = 0;
+  while (i < code.length) {
+    const ch = code[i];
+    const next = code[i + 1];
+    if (ch === "/" && next === "/") {
+      i = readLineComment(code, i);
+      continue;
+    }
+    if (ch === "/" && next === "*") {
+      i = readBlockComment(code, i);
+      continue;
+    }
+    if (ch === "'" || ch === '"') {
+      i = readQuotedString(code, i, ch);
+      continue;
+    }
+    if (ch === "`") {
+      i = scanTemplateLiteral(i + 1);
+      continue;
+    }
+    const access = tryReadCtxLibAccess(code, i);
+    if (access) {
+      if (access.key) out.add(access.key);
+      i = access.end;
+      continue;
+    }
+    if (ch === "=" && next !== "=" && next !== ">" && next !== "<") {
+      const right = skipSpaceAndCommentsForward(code, i + 1);
+      const rhsBaseEnd = readsCtxLibsBase(code, right);
+      if (rhsBaseEnd !== null) {
+        const leftEnd = skipWhitespaceBackward(code, i - 1);
+        if (code[leftEnd] === "}") {
+          let depth = 0;
+          let j = leftEnd;
+          while (j >= 0) {
+            const c = code[j];
+            if (c === "}") depth += 1;
+            else if (c === "{") {
+              depth -= 1;
+              if (depth === 0) break;
+            }
+            j -= 1;
+          }
+          if (j >= 0 && code[j] === "{") {
+            const inner = code.slice(j + 1, leftEnd);
+            for (const k of parseDestructuredKeysFromObjectPattern(inner)) out.add(k);
+          }
+        }
+      }
+    }
+    i += 1;
+  }
+  return Array.from(out);
+}
+__name(extractUsedCtxLibKeys, "extractUsedCtxLibKeys");
+function injectEnsureLibsPreamble(code) {
+  if (!CTX_LIBS_MARKER_RE.test(code)) return code;
+  if (ENSURE_LIBS_MARKER_RE.test(code)) return code;
+  const keys = extractUsedCtxLibKeys(code);
+  if (!keys.length) return code;
+  return `/* __runjs_ensure_libs */
+await ctx.__ensureLibs(${JSON.stringify(keys)});
+${code}`;
+}
+__name(injectEnsureLibsPreamble, "injectEnsureLibsPreamble");
 function isObjectLikeKeyPosition(code, tokenStart, tokenEnd) {
   const next = skipWhitespaceForward(code, tokenEnd);
   if (code[next] !== ":") return false;
@@ -371,10 +721,11 @@ async function prepareRunJsCode(code, options = {}) {
   const cached = lruGet(cache, src);
   if (cached) return await cached;
   const task = (async () => {
-    if (!preprocessTemplates) return await (0, import_jsxTransform.compileRunJs)(src);
+    if (!preprocessTemplates) return injectEnsureLibsPreamble(await (0, import_jsxTransform.compileRunJs)(src));
     const preBare = preprocessRunJsTemplates(src, { processStringLiterals: false });
     const jsxCompiled = await (0, import_jsxTransform.compileRunJs)(preBare);
-    return preprocessRunJsTemplates(jsxCompiled, { processBarePlaceholders: false });
+    const out = preprocessRunJsTemplates(jsxCompiled, { processBarePlaceholders: false });
+    return injectEnsureLibsPreamble(out);
   })();
   lruSet(cache, src, task, PREPARE_RUNJS_CODE_CACHE_LIMIT);
   try {

package/lib/views/index.d.ts

@@ -8,6 +8,6 @@
  */
 export { useDialog } from './useDialog';
 export { useDrawer } from './useDrawer';
-export { usePage } from './usePage';
+export { usePage, GLOBAL_EMBED_CONTAINER_ID, EMBED_REPLACING_DATA_KEY } from './usePage';
 export { usePopover } from './usePopover';
 export { ViewNavigation } from './ViewNavigation';

package/lib/views/index.js

@@ -26,6 +26,8 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var views_exports = {};
 __export(views_exports, {
+  EMBED_REPLACING_DATA_KEY: () => import_usePage.EMBED_REPLACING_DATA_KEY,
+  GLOBAL_EMBED_CONTAINER_ID: () => import_usePage.GLOBAL_EMBED_CONTAINER_ID,
   ViewNavigation: () => import_ViewNavigation.ViewNavigation,
   useDialog: () => import_useDialog.useDialog,
   useDrawer: () => import_useDrawer.useDrawer,
@@ -40,6 +42,8 @@ var import_usePopover = require("./usePopover");
 var import_ViewNavigation = require("./ViewNavigation");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  EMBED_REPLACING_DATA_KEY,
+  GLOBAL_EMBED_CONTAINER_ID,
   ViewNavigation,
   useDialog,
   useDrawer,

package/lib/views/usePage.d.ts

@@ -7,6 +7,10 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 import React from 'react';
+/** Global embed container element ID */
+export declare const GLOBAL_EMBED_CONTAINER_ID = "nocobase-embed-container";
+/** Dataset key used to signal embed replacement in progress (skip style reset on close) */
+export declare const EMBED_REPLACING_DATA_KEY = "nocobaseEmbedReplacing";
 export declare function usePage(): (React.JSX.Element | {
     open: (config: any, flowContext: any) => Promise<unknown> & {
         type: "embed";

package/lib/views/usePage.js

@@ -37,6 +37,8 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var usePage_exports = {};
 __export(usePage_exports, {
+  EMBED_REPLACING_DATA_KEY: () => EMBED_REPLACING_DATA_KEY,
+  GLOBAL_EMBED_CONTAINER_ID: () => GLOBAL_EMBED_CONTAINER_ID,
   usePage: () => usePage
 });
 module.exports = __toCommonJS(usePage_exports);
@@ -52,16 +54,18 @@ var import_provider = require("../provider");
 var import_ViewScopedFlowEngine = require("../ViewScopedFlowEngine");
 var import_variablesParams = require("../utils/variablesParams");
 let uuid = 0;
+const GLOBAL_EMBED_CONTAINER_ID = "nocobase-embed-container";
+const EMBED_REPLACING_DATA_KEY = "nocobaseEmbedReplacing";
 const PageElementsHolder = import_react.default.memo(
   import_react.default.forwardRef((props, ref) => {
     const [elements, patchElement] = (0, import_usePatchElement.default)();
     import_react.default.useImperativeHandle(ref, () => ({ patchElement }), [patchElement]);
-    console.log("[NocoBase] Rendering PageElementsHolder with elements count:", elements.length);
     return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, elements);
   })
 );
 function usePage() {
   const holderRef = import_react.default.useRef(null);
+  const globalEmbedActiveRef = import_react.default.useRef(null);
   const open = /* @__PURE__ */ __name((config, flowContext) => {
     var _a, _b, _c;
     uuid += 1;
@@ -93,7 +97,24 @@ function usePage() {
       }, [props]);
       return null;
     }, "HeaderComponent");
-    const { target, content, preventClose, inheritContext = true, inputArgs, ...restConfig } = config;
+    const {
+      target,
+      content,
+      preventClose,
+      inheritContext = true,
+      inputArgs: viewInputArgs = {},
+      ...restConfig
+    } = config;
+    const isGlobalEmbedContainer = target instanceof HTMLElement && target.id === GLOBAL_EMBED_CONTAINER_ID;
+    if (isGlobalEmbedContainer && globalEmbedActiveRef.current) {
+      try {
+        target.dataset[EMBED_REPLACING_DATA_KEY] = "1";
+        globalEmbedActiveRef.current.destroy();
+      } finally {
+        delete target.dataset[EMBED_REPLACING_DATA_KEY];
+        globalEmbedActiveRef.current = null;
+      }
+    }
     const ctx = new import_flowContext.FlowContext();
     const scopedEngine = (0, import_ViewScopedFlowEngine.createViewScopedEngine)(flowContext.engine);
     ctx.defineProperty("engine", { value: scopedEngine });
@@ -105,7 +126,7 @@ function usePage() {
     }
     const currentPage = {
       type: "embed",
-      inputArgs: config.inputArgs || {},
+      inputArgs: viewInputArgs,
       preventClose: !!config.preventClose,
       destroy: /* @__PURE__ */ __name((result) => {
         var _a2, _b2;
@@ -113,6 +134,9 @@ function usePage() {
         resolvePromise == null ? void 0 : resolvePromise(result);
         (_b2 = pageRef.current) == null ? void 0 : _b2.destroy();
         closeFunc == null ? void 0 : closeFunc();
+        if (isGlobalEmbedContainer) {
+          globalEmbedActiveRef.current = null;
+        }
         scopedEngine.unlinkFromStack();
       }, "destroy"),
       update: /* @__PURE__ */ __name((newConfig) => {
@@ -185,13 +209,16 @@ function usePage() {
         displayName: "PageWithContext"
       }
     );
-    const key = (inputArgs == null ? void 0 : inputArgs.viewUid) || `page-${uuid}`;
+    const key = (viewInputArgs == null ? void 0 : viewInputArgs.viewUid) || `page-${uuid}`;
     const page = /* @__PURE__ */ import_react.default.createElement(import_provider.FlowEngineProvider, { key, engine: scopedEngine }, /* @__PURE__ */ import_react.default.createElement(import_FlowContextProvider.FlowViewContextProvider, { context: ctx }, /* @__PURE__ */ import_react.default.createElement(PageWithContext, null)));
     if (target && target instanceof HTMLElement) {
       closeFunc = (_b = holderRef.current) == null ? void 0 : _b.patchElement(import_react_dom.default.createPortal(page, target, key));
     } else {
       closeFunc = (_c = holderRef.current) == null ? void 0 : _c.patchElement(page);
     }
+    if (isGlobalEmbedContainer) {
+      globalEmbedActiveRef.current = { destroy: currentPage.destroy };
+    }
     return Object.assign(promise, currentPage);
   }, "open");
   const api = import_react.default.useMemo(() => ({ open }), []);
@@ -200,5 +227,7 @@ function usePage() {
 __name(usePage, "usePage");
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  EMBED_REPLACING_DATA_KEY,
+  GLOBAL_EMBED_CONTAINER_ID,
   usePage
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nocobase/flow-engine",
-  "version": "2.0.0-beta.13",
+  "version": "2.0.0-beta.14",
   "private": false,
   "description": "A standalone flow engine for NocoBase, managing workflows, models, and actions.",
   "main": "lib/index.js",
@@ -8,8 +8,8 @@
   "dependencies": {
     "@formily/antd-v5": "1.x",
     "@formily/reactive": "2.x",
-    "@nocobase/sdk": "2.0.0-beta.13",
-    "@nocobase/shared": "2.0.0-beta.13",
+    "@nocobase/sdk": "2.0.0-beta.14",
+    "@nocobase/shared": "2.0.0-beta.14",
     "ahooks": "^3.7.2",
     "dayjs": "^1.11.9",
     "dompurify": "^3.0.2",
@@ -36,5 +36,5 @@
   ],
   "author": "NocoBase Team",
   "license": "AGPL-3.0",
-  "gitHead": "3d3db6eb771d20a49559e5f2c0841057196a0c8f"
+  "gitHead": "e51bd3f094b93bd8bbb8fa3c6ff0f07fcca2e16d"
 }

package/src/__tests__/flowSettings.open.test.tsx

@@ -12,6 +12,7 @@ import { screen } from '@testing-library/react';
 import { FlowSettings } from '../flowSettings';
 import { FlowModel } from '../models';
 import { FlowEngine } from '../flowEngine';
+import { GLOBAL_EMBED_CONTAINER_ID } from '../views';
 
 // We will stub viewer directly on model.context in tests
 
@@ -1087,18 +1088,18 @@ describe('FlowSettings.open rendering behavior', () => {
 
     // Create mock DOM element for embed target
     const mockTarget = document.createElement('div');
-    mockTarget.id = 'nocobase-embed-container';
+    mockTarget.id = GLOBAL_EMBED_CONTAINER_ID;
     mockTarget.style.width = 'auto';
     mockTarget.style.maxWidth = 'none';
     document.body.appendChild(mockTarget);
 
     // Mock querySelector to return our mock element
-    const originalQuerySelector = document.querySelector;
-    document.querySelector = vi.fn((selector) => {
-      if (selector === '#nocobase-embed-container') {
+    const originalQuerySelector = document.querySelector.bind(document);
+    const querySelectorSpy = vi.spyOn(document, 'querySelector').mockImplementation((selector: string) => {
+      if (selector === `#${GLOBAL_EMBED_CONTAINER_ID}`) {
         return mockTarget;
       }
-      return originalQuerySelector.call(document, selector);
+      return originalQuerySelector(selector);
     });
 
     const M = model.constructor as any;
@@ -1164,7 +1165,61 @@ describe('FlowSettings.open rendering behavior', () => {
 
     // Cleanup
     document.body.removeChild(mockTarget);
-    document.querySelector = originalQuerySelector;
+    querySelectorSpy.mockRestore();
+  });
+
+  it('does not clear embed target DOM before opening (avoids portal unmount errors)', async () => {
+    const engine = new FlowEngine();
+    const flowSettings = new FlowSettings(engine);
+    const model = new FlowModel({ uid: 'm-embed-no-clear', flowEngine: engine });
+
+    const mockTarget = document.createElement('div');
+    mockTarget.id = GLOBAL_EMBED_CONTAINER_ID;
+    mockTarget.innerHTML = '<div data-testid="existing">Existing</div>';
+    document.body.appendChild(mockTarget);
+
+    const originalQuerySelector = document.querySelector.bind(document);
+    const querySelectorSpy = vi.spyOn(document, 'querySelector').mockImplementation((selector: string) => {
+      if (selector === `#${GLOBAL_EMBED_CONTAINER_ID}`) {
+        return mockTarget;
+      }
+      return originalQuerySelector(selector);
+    });
+
+    const M = model.constructor as any;
+    M.registerFlow({
+      key: 'embedNoClearFlow',
+      steps: {
+        step: {
+          title: 'Step',
+          uiSchema: { f: { type: 'string', 'x-component': 'Input' } },
+        },
+      },
+    });
+
+    const embed = vi.fn((opts: any) => {
+      // The existing DOM should not be wiped out before opening the embed view.
+      expect(mockTarget.querySelector('[data-testid="existing"]')).toBeTruthy();
+      const dlg = { close: vi.fn(), Footer: (p: any) => null } as any;
+      if (typeof opts.content === 'function') opts.content(dlg, { defineMethod: vi.fn() });
+      return dlg;
+    });
+
+    model.context.defineProperty('viewer', { value: { embed } });
+    model.context.defineProperty('message', { value: { info: vi.fn(), error: vi.fn(), success: vi.fn() } });
+
+    await flowSettings.open({
+      model,
+      flowKey: 'embedNoClearFlow',
+      stepKey: 'step',
+      uiMode: 'embed',
+    } as any);
+
+    expect(embed).toHaveBeenCalledTimes(1);
+    expect(mockTarget.querySelector('[data-testid="existing"]')).toBeTruthy();
+
+    document.body.removeChild(mockTarget);
+    querySelectorSpy.mockRestore();
   });
 
   it('uses embed uiMode with default props when target element exists', async () => {
@@ -1174,16 +1229,16 @@ describe('FlowSettings.open rendering behavior', () => {
 
     // Create mock DOM element for embed target
     const mockTarget = document.createElement('div');
-    mockTarget.id = 'nocobase-embed-container';
+    mockTarget.id = GLOBAL_EMBED_CONTAINER_ID;
     document.body.appendChild(mockTarget);
 
     // Mock querySelector
-    const originalQuerySelector = document.querySelector;
-    document.querySelector = vi.fn((selector) => {
-      if (selector === '#nocobase-embed-container') {
+    const originalQuerySelector = document.querySelector.bind(document);
+    const querySelectorSpy = vi.spyOn(document, 'querySelector').mockImplementation((selector: string) => {
+      if (selector === `#${GLOBAL_EMBED_CONTAINER_ID}`) {
         return mockTarget;
       }
-      return originalQuerySelector.call(document, selector);
+      return originalQuerySelector(selector);
     });
 
     const M = model.constructor as any;
@@ -1223,7 +1278,7 @@ describe('FlowSettings.open rendering behavior', () => {
 
     // Cleanup
     document.body.removeChild(mockTarget);
-    document.querySelector = originalQuerySelector;
+    querySelectorSpy.mockRestore();
   });
 
   it('handles embed uiMode when target element is not found', async () => {
@@ -1232,8 +1287,7 @@ describe('FlowSettings.open rendering behavior', () => {
     const model = new FlowModel({ uid: 'm-embed-no-target', flowEngine: engine });
 
     // Mock querySelector to return null (target not found)
-    const originalQuerySelector = document.querySelector;
-    document.querySelector = vi.fn(() => null);
+    const querySelectorSpy = vi.spyOn(document, 'querySelector').mockReturnValue(null);
 
     const M = model.constructor as any;
     M.registerFlow({
@@ -1266,7 +1320,7 @@ describe('FlowSettings.open rendering behavior', () => {
     expect(embed).toHaveBeenCalledTimes(1);
 
     // Restore querySelector
-    document.querySelector = originalQuerySelector;
+    querySelectorSpy.mockRestore();
   });
 
   it('handles error in function-based step uiMode gracefully', async () => {