@nocobase/flow-engine 2.1.0-alpha.1 → 2.1.0-alpha.11

package/src/models/__tests__/flowModel.clone.test.ts

@@ -0,0 +1,416 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import { describe, it, expect, beforeEach, vi } from 'vitest';
+import { FlowEngine } from '../../flowEngine';
+import { FlowModel } from '../flowModel';
+
+describe('FlowModel.clone', () => {
+  let flowEngine: FlowEngine;
+
+  beforeEach(() => {
+    flowEngine = new FlowEngine();
+    // Mock api for FlowEngineContext
+    (flowEngine.context as any).api = {
+      auth: {
+        role: 'admin',
+        locale: 'en-US',
+        token: 'mock-token',
+      },
+    };
+    vi.clearAllMocks();
+  });
+
+  it('should clone a simple model with a new uid', () => {
+    const original = flowEngine.createModel({
+      uid: 'original-uid',
+      use: 'FlowModel',
+      props: { title: 'Original Title' },
+      stepParams: { testFlow: { step1: { value: 'test' } } },
+    });
+
+    const cloned = original.clone();
+
+    // uid should be different
+    expect(cloned.uid).not.toBe(original.uid);
+
+    // props should be the same
+    expect(cloned.props).toEqual(original.props);
+
+    // stepParams should be the same
+    expect(cloned.stepParams).toEqual(original.stepParams);
+
+    // should be registered in flowEngine
+    expect(flowEngine.getModel(cloned.uid)).toBe(cloned);
+  });
+
+  it('should clone model without parent relationship', () => {
+    const parent = flowEngine.createModel({
+      uid: 'parent-uid',
+      use: 'FlowModel',
+    });
+
+    const child = parent.addSubModel('children', {
+      use: 'FlowModel',
+      props: { name: 'child' },
+    });
+
+    const cloned = child.clone();
+
+    // cloned model should not have parent
+    expect(cloned.parent).toBeUndefined();
+    expect(cloned['_options'].parentId).toBeUndefined();
+  });
+
+  it('should clone model with subModels recursively', () => {
+    const parent = flowEngine.createModel({
+      uid: 'parent-uid',
+      use: 'FlowModel',
+      props: { name: 'parent' },
+    });
+
+    const child1 = parent.addSubModel('items', {
+      use: 'FlowModel',
+      props: { name: 'child1' },
+    });
+
+    const child2 = parent.addSubModel('items', {
+      use: 'FlowModel',
+      props: { name: 'child2' },
+    });
+
+    const cloned = parent.clone();
+
+    // parent uid should be different
+    expect(cloned.uid).not.toBe(parent.uid);
+
+    // subModels should exist
+    expect(cloned.subModels['items']).toBeDefined();
+    expect(cloned.subModels['items']).toHaveLength(2);
+
+    // subModels uids should be different
+    const clonedChildren = cloned.subModels['items'] as FlowModel[];
+    expect(clonedChildren[0].uid).not.toBe(child1.uid);
+    expect(clonedChildren[1].uid).not.toBe(child2.uid);
+
+    // subModels props should be the same
+    expect(clonedChildren[0].props.name).toBe('child1');
+    expect(clonedChildren[1].props.name).toBe('child2');
+  });
+
+  it('should clone model with nested subModels', () => {
+    const root = flowEngine.createModel({
+      uid: 'root-uid',
+      use: 'FlowModel',
+      props: { level: 'root' },
+    });
+
+    const level1 = root.addSubModel('children', {
+      use: 'FlowModel',
+      props: { level: 'level1' },
+    });
+
+    const level2 = level1.addSubModel('children', {
+      use: 'FlowModel',
+      props: { level: 'level2' },
+    });
+
+    const cloned = root.clone();
+
+    // All uids should be different
+    expect(cloned.uid).not.toBe(root.uid);
+
+    const clonedLevel1 = (cloned.subModels['children'] as FlowModel[])[0];
+    expect(clonedLevel1.uid).not.toBe(level1.uid);
+    expect(clonedLevel1.props.level).toBe('level1');
+
+    const clonedLevel2 = (clonedLevel1.subModels['children'] as FlowModel[])[0];
+    expect(clonedLevel2.uid).not.toBe(level2.uid);
+    expect(clonedLevel2.props.level).toBe('level2');
+  });
+
+  it('should clone model with object-type subModel', () => {
+    const parent = flowEngine.createModel({
+      uid: 'parent-uid',
+      use: 'FlowModel',
+    });
+
+    const header = parent.setSubModel('header', {
+      use: 'FlowModel',
+      props: { title: 'Header' },
+    });
+
+    const cloned = parent.clone();
+
+    // parent uid should be different
+    expect(cloned.uid).not.toBe(parent.uid);
+
+    // object-type subModel should exist with different uid
+    const clonedHeader = cloned.subModels['header'] as FlowModel;
+    expect(clonedHeader).toBeDefined();
+    expect(clonedHeader.uid).not.toBe(header.uid);
+    expect(clonedHeader.props.title).toBe('Header');
+  });
+
+  it('should preserve sortIndex when cloning', () => {
+    const model = flowEngine.createModel({
+      uid: 'test-uid',
+      use: 'FlowModel',
+      sortIndex: 5,
+    });
+
+    const cloned = model.clone();
+
+    expect(cloned.sortIndex).toBe(5);
+  });
+
+  it('should preserve stepParams when cloning', () => {
+    const model = flowEngine.createModel({
+      uid: 'test-uid',
+      use: 'FlowModel',
+      stepParams: {
+        flow1: { step1: { param1: 'value1' } },
+        flow2: { step2: { param2: 'value2' } },
+      },
+    });
+
+    const cloned = model.clone();
+
+    expect(cloned.stepParams).toEqual({
+      flow1: { step1: { param1: 'value1' } },
+      flow2: { step2: { param2: 'value2' } },
+    });
+  });
+
+  it('should throw error if flowEngine is not set', () => {
+    const model = flowEngine.createModel({
+      uid: 'test-uid',
+      use: 'FlowModel',
+    });
+
+    // Manually remove flowEngine to simulate edge case
+    (model as any).flowEngine = null;
+
+    expect(() => model.clone()).toThrow('FlowEngine is not set on this model. Please set flowEngine before cloning.');
+  });
+
+  it('should clone model with correct type', () => {
+    class CustomModel extends FlowModel {
+      customMethod() {
+        return 'custom';
+      }
+    }
+
+    flowEngine.registerModels({ CustomModel });
+
+    const original = flowEngine.createModel<CustomModel>({
+      uid: 'custom-uid',
+      use: 'CustomModel',
+      props: { custom: true },
+    });
+
+    const cloned = original.clone<CustomModel>();
+
+    expect(cloned).toBeInstanceOf(CustomModel);
+    expect(cloned.customMethod()).toBe('custom');
+    expect(cloned.uid).not.toBe(original.uid);
+  });
+
+  it('should clone model and all cloned models should be independent', () => {
+    const original = flowEngine.createModel({
+      uid: 'original-uid',
+      use: 'FlowModel',
+      props: { value: 1 },
+    });
+
+    const cloned = original.clone();
+
+    // Modify original
+    original.setProps({ value: 2 });
+
+    // Cloned should not be affected
+    expect(cloned.props.value).toBe(1);
+    expect(original.props.value).toBe(2);
+  });
+
+  it('should clone model with mixed subModels (array and object)', () => {
+    const parent = flowEngine.createModel({
+      uid: 'parent-uid',
+      use: 'FlowModel',
+    });
+
+    // Add array-type subModels
+    parent.addSubModel('items', { use: 'FlowModel', props: { type: 'item1' } });
+    parent.addSubModel('items', { use: 'FlowModel', props: { type: 'item2' } });
+
+    // Add object-type subModel
+    parent.setSubModel('header', { use: 'FlowModel', props: { type: 'header' } });
+    parent.setSubModel('footer', { use: 'FlowModel', props: { type: 'footer' } });
+
+    const cloned = parent.clone();
+
+    // Check array-type subModels
+    const clonedItems = cloned.subModels['items'] as FlowModel[];
+    expect(clonedItems).toHaveLength(2);
+    expect(clonedItems[0].props.type).toBe('item1');
+    expect(clonedItems[1].props.type).toBe('item2');
+
+    // Check object-type subModels
+    const clonedHeader = cloned.subModels['header'] as FlowModel;
+    const clonedFooter = cloned.subModels['footer'] as FlowModel;
+    expect(clonedHeader.props.type).toBe('header');
+    expect(clonedFooter.props.type).toBe('footer');
+
+    // All uids should be unique
+    const originalItems = parent.subModels['items'] as FlowModel[];
+    expect(clonedItems[0].uid).not.toBe(originalItems[0].uid);
+    expect(clonedItems[1].uid).not.toBe(originalItems[1].uid);
+    expect(clonedHeader.uid).not.toBe((parent.subModels['header'] as FlowModel).uid);
+    expect(clonedFooter.uid).not.toBe((parent.subModels['footer'] as FlowModel).uid);
+  });
+
+  it('should correctly remap parentId for subModels to new parent uid', () => {
+    const parent = flowEngine.createModel({
+      uid: 'parent-uid',
+      use: 'FlowModel',
+    });
+
+    const child = parent.addSubModel('children', {
+      use: 'FlowModel',
+      props: { name: 'child' },
+    });
+
+    // Verify original relationship
+    expect(child.parentId).toBe(parent.uid);
+
+    const cloned = parent.clone();
+    const clonedChild = (cloned.subModels['children'] as FlowModel[])[0];
+
+    // Root model should not have parentId
+    expect(cloned.parentId).toBeUndefined();
+
+    // Child's parentId should be remapped to cloned parent's uid
+    expect(clonedChild.parentId).toBe(cloned.uid);
+    expect(clonedChild.parentId).not.toBe(parent.uid);
+  });
+
+  it('should correctly remap parentId in deeply nested subModels', () => {
+    const root = flowEngine.createModel({
+      uid: 'root-uid',
+      use: 'FlowModel',
+    });
+
+    const level1 = root.addSubModel('children', {
+      use: 'FlowModel',
+    });
+
+    const level2 = level1.addSubModel('children', {
+      use: 'FlowModel',
+    });
+
+    const cloned = root.clone();
+    const clonedLevel1 = (cloned.subModels['children'] as FlowModel[])[0];
+    const clonedLevel2 = (clonedLevel1.subModels['children'] as FlowModel[])[0];
+
+    // Root should not have parentId
+    expect(cloned.parentId).toBeUndefined();
+
+    // Level1's parentId should point to cloned root
+    expect(clonedLevel1.parentId).toBe(cloned.uid);
+
+    // Level2's parentId should point to cloned level1
+    expect(clonedLevel2.parentId).toBe(clonedLevel1.uid);
+  });
+
+  it('should replace uid references in props and other fields', () => {
+    const parent = flowEngine.createModel({
+      uid: 'parent-uid',
+      use: 'FlowModel',
+    });
+
+    const child = parent.addSubModel('children', {
+      use: 'FlowModel',
+      props: {
+        // Store a reference to parent uid in props
+        targetUid: 'parent-uid',
+        relatedIds: ['parent-uid'],
+        nested: { refId: 'parent-uid' },
+      },
+    });
+
+    const cloned = parent.clone();
+    const clonedChild = (cloned.subModels['children'] as FlowModel[])[0];
+
+    // Props containing old uid references should be updated to new uids
+    expect(clonedChild.props.targetUid).toBe(cloned.uid);
+    expect(clonedChild.props.relatedIds[0]).toBe(cloned.uid);
+    expect(clonedChild.props.nested.refId).toBe(cloned.uid);
+  });
+
+  it('should replace uid references in stepParams', () => {
+    const parent = flowEngine.createModel({
+      uid: 'parent-uid',
+      use: 'FlowModel',
+    });
+
+    const child = parent.addSubModel('children', {
+      use: 'FlowModel',
+      stepParams: {
+        someFlow: {
+          someStep: {
+            targetModelUid: 'parent-uid',
+          },
+        },
+      },
+    });
+
+    const cloned = parent.clone();
+    const clonedChild = (cloned.subModels['children'] as FlowModel[])[0];
+
+    // stepParams containing old uid references should be updated
+    expect(clonedChild.stepParams.someFlow.someStep.targetModelUid).toBe(cloned.uid);
+  });
+
+  it('should handle self-referencing uid in props', () => {
+    const model = flowEngine.createModel({
+      uid: 'self-uid',
+      use: 'FlowModel',
+      props: {
+        selfRef: 'self-uid',
+      },
+    });
+
+    const cloned = model.clone();
+
+    // Self-reference should be updated to new uid
+    expect(cloned.props.selfRef).toBe(cloned.uid);
+    expect(cloned.props.selfRef).not.toBe('self-uid');
+  });
+
+  it('should not replace strings that are not uids', () => {
+    const model = flowEngine.createModel({
+      uid: 'model-uid',
+      use: 'FlowModel',
+      props: {
+        title: 'Some Title',
+        description: 'This is a description',
+        count: 42,
+        enabled: true,
+      },
+    });
+
+    const cloned = model.clone();
+
+    // Non-uid strings should remain unchanged
+    expect(cloned.props.title).toBe('Some Title');
+    expect(cloned.props.description).toBe('This is a description');
+    expect(cloned.props.count).toBe(42);
+    expect(cloned.props.enabled).toBe(true);
+  });
+});

package/src/models/__tests__/flowModel.test.ts

@@ -353,7 +353,7 @@ describe('FlowModel', () => {
         }).toThrow('FlowModel must be initialized with a FlowEngine instance.');
       });
 
-      test('should handle FlowExitException correctly', async () => {
+      test('should handle ctx.exit() as FlowExitAllException in applyFlow', async () => {
         const exitFlow: FlowDefinitionOptions = {
           key: 'exitFlow',
           steps: {
@@ -374,14 +374,14 @@ describe('FlowModel', () => {
 
         const result = await model.applyFlow('exitFlow');
 
-        expect(result).toEqual({});
+        expect(result).toBeInstanceOf(FlowExitAllException);
         expect(exitFlow.steps.step2.handler).not.toHaveBeenCalled();
         expect(consoleSpy).toHaveBeenCalledWith(expect.stringContaining('[FlowModel]'));
 
         consoleSpy.mockRestore();
       });
 
-      test('should handle FlowExitException correctly', async () => {
+      test('should handle ctx.exit() as FlowExitAllException in beforeRender dispatch', async () => {
         const exitFlow: FlowDefinitionOptions = {
           key: 'exitFlow',
           steps: {
@@ -413,7 +413,7 @@ describe('FlowModel', () => {
         await model.dispatchEvent('beforeRender');
 
         expect(exitFlow.steps.step2.handler).not.toHaveBeenCalled();
-        expect(exitFlow2.steps.step2.handler).toHaveBeenCalled();
+        expect(exitFlow2.steps.step2.handler).not.toHaveBeenCalled();
         expect(loggerSpy).toHaveBeenCalledWith(expect.stringContaining('[FlowEngine]'));
 
         loggerSpy.mockRestore();
@@ -1558,6 +1558,22 @@ describe('FlowModel', () => {
         expect(model.forks.size).toBe(1);
       });
 
+      test('should recreate cached fork after dispose to avoid state leakage', () => {
+        const fork1 = model.createFork({ foo: 'bar' }, 'cacheKey');
+        fork1.hidden = true;
+        fork1.setProps({ disabled: true });
+
+        fork1.dispose();
+
+        expect(model.getFork('cacheKey')).toBeUndefined();
+
+        const fork2 = model.createFork({}, 'cacheKey');
+
+        expect(fork2).not.toBe(fork1);
+        expect(fork2.hidden).toBe(false);
+        expect(fork2.localProps).toEqual({});
+      });
+
       test('should create different instances for different keys', () => {
         const fork1 = model.createFork({}, 'key1');
         const fork2 = model.createFork({}, 'key2');

package/src/models/flowModel.tsx

@@ -11,8 +11,6 @@ import { batch, define, observable, observe } from '@formily/reactive';
 import _ from 'lodash';
 import React from 'react';
 import { uid } from 'uid/secure';
-import { openRequiredParamsStepFormDialog as openRequiredParamsStepFormDialogFn } from '../components/settings/wrappers/contextual/StepRequiredSettingsDialog';
-import { openStepSettingsDialog as openStepSettingsDialogFn } from '../components/settings/wrappers/contextual/StepSettingsDialog';
 import { Emitter } from '../emitter';
 import { InstanceFlowRegistry } from '../flow-registry/InstanceFlowRegistry';
 import { FlowContext, FlowModelContext, FlowRuntimeContext } from '../flowContext';
@@ -36,7 +34,7 @@ import type {
 import { IModelComponentProps, ReadonlyModelProps } from '../types';
 import { isInheritedFrom, setupRuntimeContextSteps } from '../utils';
 // import { FlowExitAllException } from '../utils/exceptions';
-import { Typography } from 'antd/lib';
+import { Typography } from 'antd';
 import { ModelActionRegistry } from '../action-registry/ModelActionRegistry';
 import { buildSubModelItem } from '../components/subModel/utils';
 import { ModelEventRegistry } from '../event-registry/ModelEventRegistry';
@@ -88,6 +86,16 @@ type ExtraMenuItemEntry = {
 
 const classMenuExtensions = new WeakMap<typeof FlowModel, Set<ExtraMenuItemEntry>>();
 
+async function loadOpenStepSettingsDialog() {
+  const mod = await import('../components/settings/wrappers/contextual/StepSettingsDialog');
+  return mod.openStepSettingsDialog;
+}
+
+async function loadOpenRequiredParamsStepFormDialog() {
+  const mod = await import('../components/settings/wrappers/contextual/StepRequiredSettingsDialog');
+  return mod.openRequiredParamsStepFormDialog;
+}
+
 export enum ModelRenderMode {
   ReactElement = 'reactElement',
   RenderFunction = 'renderFunction',
@@ -424,7 +432,19 @@ export class FlowModel<Structure extends DefaultStructure = DefaultStructure> {
       const meta = Cls.meta as any;
       const metaCreate = meta?.createModelOptions;
       if (metaCreate && typeof metaCreate === 'object' && metaCreate.subModels) {
-        mergedSubModels = _.merge({}, _.cloneDeep(metaCreate.subModels || {}), _.cloneDeep(subModels || {}));
+        const replaceArrays = (objValue: unknown, srcValue: unknown) => {
+          if (Array.isArray(objValue) && Array.isArray(srcValue)) {
+            // Arrays should be replaced, not merged by index.
+            return srcValue;
+          }
+          return undefined;
+        };
+        mergedSubModels = _.mergeWith(
+          {},
+          _.cloneDeep(metaCreate.subModels || {}),
+          _.cloneDeep(subModels || {}),
+          replaceArrays,
+        );
       }
     } catch (e) {
       // Fallback silently if meta defaults resolution fails
@@ -1357,7 +1377,7 @@ export class FlowModel<Structure extends DefaultStructure = DefaultStructure> {
    * @param {string} stepKey 步骤的唯一标识符
    * @returns {void}
    */
-  openStepSettingsDialog(flowKey: string, stepKey: string) {
+  async openStepSettingsDialog(flowKey: string, stepKey: string) {
     // 创建流程运行时上下文
     const flow = this.getFlow(flowKey);
     const step = flow?.steps?.[stepKey];
@@ -1371,7 +1391,9 @@ export class FlowModel<Structure extends DefaultStructure = DefaultStructure> {
     setupRuntimeContextSteps(ctx, flow.steps, this, flowKey);
     ctx.defineProperty('currentStep', { value: step });
 
-    return openStepSettingsDialogFn({
+    const openStepSettingsDialog = await loadOpenStepSettingsDialog();
+
+    return openStepSettingsDialog({
       model: this,
       flowKey,
       stepKey,
@@ -1387,7 +1409,9 @@ export class FlowModel<Structure extends DefaultStructure = DefaultStructure> {
    * @returns {Promise<any>} 返回表单提交的值
    */
   async configureRequiredSteps(dialogWidth?: number | string, dialogTitle?: string) {
-    return openRequiredParamsStepFormDialogFn({
+    const openRequiredParamsStepFormDialog = await loadOpenRequiredParamsStepFormDialog();
+
+    return openRequiredParamsStepFormDialog({
       model: this,
       dialogWidth,
       dialogTitle,
@@ -1444,6 +1468,87 @@ export class FlowModel<Structure extends DefaultStructure = DefaultStructure> {
     return data;
   }
 
+  /**
+   * 复制当前模型实例为一个新的实例。
+   * 新实例及其所有子模型都会有新的 uid，且不保留 root model 的 parent 关系。
+   * 内部所有引用旧 uid 的地方（如 parentId, parentUid 等）都会被替换为对应的新 uid。
+   * @returns {FlowModel} 复制后的新模型实例
+   */
+  clone<T extends FlowModel = this>(): T {
+    if (!this.flowEngine) {
+      throw new Error('FlowEngine is not set on this model. Please set flowEngine before cloning.');
+    }
+
+    // 序列化当前实例
+    const serialized = this.serialize();
+
+    // 第一步：收集所有 uid 并建立 oldUid -> newUid 的映射
+    const uidMap = new Map<string, string>();
+
+    const collectUids = (data: Record<string, any>): void => {
+      if (data.uid && typeof data.uid === 'string') {
+        uidMap.set(data.uid, uid());
+      }
+
+      // 递归处理 subModels
+      if (data.subModels) {
+        for (const key in data.subModels) {
+          const subModel = data.subModels[key];
+          if (Array.isArray(subModel)) {
+            subModel.forEach((item) => collectUids(item));
+          } else if (subModel && typeof subModel === 'object') {
+            collectUids(subModel);
+          }
+        }
+      }
+    };
+
+    collectUids(serialized);
+
+    // 第二步：深度遍历并替换所有 uid 引用
+    const replaceUidReferences = (data: any, isRoot = false): any => {
+      if (data === null || data === undefined) {
+        return data;
+      }
+
+      // 如果是字符串，检查是否是需要替换的 uid
+      if (typeof data === 'string') {
+        return uidMap.get(data) ?? data;
+      }
+
+      // 如果是数组，递归处理每个元素
+      if (Array.isArray(data)) {
+        return data.map((item) => replaceUidReferences(item, false));
+      }
+
+      // 如果是对象，递归处理每个属性
+      if (typeof data === 'object') {
+        const result: Record<string, any> = {};
+
+        for (const key in data) {
+          if (!Object.prototype.hasOwnProperty.call(data, key)) continue;
+
+          // 只删除 root model 的 parentId
+          if (isRoot && key === 'parentId') {
+            continue;
+          }
+
+          result[key] = replaceUidReferences(data[key], false);
+        }
+
+        return result;
+      }
+
+      // 其他类型（number, boolean 等）直接返回
+      return data;
+    };
+
+    const clonedData = replaceUidReferences(serialized, true);
+
+    // 使用 flowEngine 创建新实例
+    return this.flowEngine.createModel<T>(clonedData as any);
+  }
+
   /**
    * Opens the flow settings dialog for this flow model.
    * @param options - Configuration options for opening flow settings, excluding the model property

package/src/provider.tsx

@@ -58,18 +58,19 @@ export const FlowEngineGlobalsContextProvider: React.FC<{ children: React.ReactN
       cache: false,
       get: (ctx) => new FlowViewer(ctx, { drawer, embed, popover, dialog }),
     });
-    // 将 themeToken 定义为 observable, 使组件能够响应主题的变更
-    engine.context.defineProperty('themeToken', {
-      get: () => token,
-      observable: true,
-      cache: true,
-    });
     for (const item of Object.entries(context)) {
       const [key, value] = item;
       if (value) {
         engine.context.defineProperty(key, { value });
       }
     }
+    // 将 themeToken 定义为 observable, 使组件能够响应主题的变更
+    // NOTE: 必须在 antdConfig 写入后再更新 themeToken；否则会读取到旧 antdConfig 的值。
+    engine.context.defineProperty('themeToken', {
+      get: () => token,
+      observable: true,
+      cache: true,
+    });
     engine.reactView.refresh();
   }, [engine, drawer, modal, message, notification, config, popover, token, dialog, embed]);
 
@@ -90,9 +91,10 @@ export const useFlowEngine = ({ throwError = true } = {}): FlowEngine => {
   if (!context && throwError) {
     // This error should ideally not be hit if FlowEngineProvider is used correctly at the root
     // and always supplied with an engine.
-    throw new Error(
+    console.warn(
       'useFlowEngine must be used within a FlowEngineProvider, and FlowEngineProvider must be supplied with an engine.',
     );
+    return;
   }
   return context;
 };