@nocobase/flow-engine 2.2.0-beta.16 → 2.2.0-beta.18

package/src/components/subModel/__tests__/LazyDropdown.test.tsx

@@ -0,0 +1,202 @@
+/**
+ * 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 { act, render, screen, userEvent, waitFor } from '@nocobase/test/client';
+import { ConfigProvider } from 'antd';
+import React from 'react';
+import { afterEach, describe, expect, it, vi } from 'vitest';
+import { FlowEngineProvider } from '../../../provider';
+import { FlowEngine } from '../../../flowEngine';
+import LazyDropdown from '../LazyDropdown';
+
+const setViewportHeight = (height: number) => {
+  Object.defineProperty(window, 'innerHeight', {
+    configurable: true,
+    value: height,
+  });
+};
+
+describe('LazyDropdown', () => {
+  const originalInnerHeight = window.innerHeight;
+
+  afterEach(() => {
+    setViewportHeight(originalInnerHeight);
+    vi.restoreAllMocks();
+  });
+
+  it('uses the current viewport space when opening after the viewport height changes', async () => {
+    setViewportHeight(720);
+    const engine = new FlowEngine();
+    const user = userEvent.setup();
+
+    render(
+      <FlowEngineProvider engine={engine}>
+        <ConfigProvider>
+          <LazyDropdown
+            trigger={['click']}
+            menu={{
+              items: [{ key: 'field', label: 'Field' }],
+            }}
+          >
+            <button type="button">Open fields</button>
+          </LazyDropdown>
+        </ConfigProvider>
+      </FlowEngineProvider>,
+    );
+
+    const trigger = screen.getByRole('button', { name: 'Open fields' });
+    vi.spyOn(trigger, 'getBoundingClientRect').mockReturnValue({
+      bottom: 196,
+      height: 32,
+      left: 49,
+      right: 141,
+      top: 164,
+      width: 92,
+      x: 49,
+      y: 164,
+      toJSON: () => ({}),
+    });
+    setViewportHeight(460);
+
+    await user.click(trigger);
+
+    const menu = await screen.findByRole('menu');
+    await waitFor(() => expect(menu).toHaveStyle({ maxHeight: '256px', overflowY: 'auto' }));
+  });
+
+  it('updates the available height while the dropdown is open', async () => {
+    setViewportHeight(720);
+    const engine = new FlowEngine();
+    const user = userEvent.setup();
+
+    render(
+      <FlowEngineProvider engine={engine}>
+        <ConfigProvider>
+          <LazyDropdown
+            trigger={['click']}
+            menu={{
+              items: [{ key: 'field', label: 'Field' }],
+            }}
+          >
+            <button type="button">Open fields</button>
+          </LazyDropdown>
+        </ConfigProvider>
+      </FlowEngineProvider>,
+    );
+
+    const trigger = screen.getByRole('button', { name: 'Open fields' });
+    vi.spyOn(trigger, 'getBoundingClientRect').mockReturnValue({
+      bottom: 196,
+      height: 32,
+      left: 49,
+      right: 141,
+      top: 164,
+      width: 92,
+      x: 49,
+      y: 164,
+      toJSON: () => ({}),
+    });
+
+    await user.click(trigger);
+
+    const menu = await screen.findByRole('menu');
+    await waitFor(() => expect(menu).toHaveStyle({ maxHeight: '400px', overflowY: 'auto' }));
+
+    act(() => {
+      setViewportHeight(460);
+      window.dispatchEvent(new Event('resize'));
+    });
+    await waitFor(() => expect(menu).toHaveStyle({ maxHeight: '256px', overflowY: 'auto' }));
+
+    act(() => {
+      setViewportHeight(720);
+      window.dispatchEvent(new Event('resize'));
+    });
+    await waitFor(() => expect(menu).toHaveStyle({ maxHeight: '400px', overflowY: 'auto' }));
+  });
+
+  it('reserves the placement offset when the dropdown has an arrow', async () => {
+    setViewportHeight(460);
+    const engine = new FlowEngine();
+    const user = userEvent.setup();
+
+    render(
+      <FlowEngineProvider engine={engine}>
+        <ConfigProvider>
+          <LazyDropdown
+            arrow
+            trigger={['click']}
+            menu={{
+              items: [{ key: 'field', label: 'Field' }],
+            }}
+          >
+            <button type="button">Open fields</button>
+          </LazyDropdown>
+        </ConfigProvider>
+      </FlowEngineProvider>,
+    );
+
+    const trigger = screen.getByRole('button', { name: 'Open fields' });
+    vi.spyOn(trigger, 'getBoundingClientRect').mockReturnValue({
+      bottom: 196,
+      height: 32,
+      left: 49,
+      right: 141,
+      top: 164,
+      width: 92,
+      x: 49,
+      y: 164,
+      toJSON: () => ({}),
+    });
+
+    await user.click(trigger);
+
+    const menu = await screen.findByRole('menu');
+    await waitFor(() => expect(menu).toHaveStyle({ maxHeight: '248px', overflowY: 'auto' }));
+  });
+
+  it('uses the space above when it is larger than the space below', async () => {
+    setViewportHeight(460);
+    const engine = new FlowEngine();
+    const user = userEvent.setup();
+
+    render(
+      <FlowEngineProvider engine={engine}>
+        <ConfigProvider>
+          <LazyDropdown
+            trigger={['click']}
+            menu={{
+              items: [{ key: 'field', label: 'Field' }],
+            }}
+          >
+            <button type="button">Open fields</button>
+          </LazyDropdown>
+        </ConfigProvider>
+      </FlowEngineProvider>,
+    );
+
+    const trigger = screen.getByRole('button', { name: 'Open fields' });
+    vi.spyOn(trigger, 'getBoundingClientRect').mockReturnValue({
+      bottom: 332,
+      height: 32,
+      left: 49,
+      right: 141,
+      top: 300,
+      width: 92,
+      x: 49,
+      y: 300,
+      toJSON: () => ({}),
+    });
+
+    await user.click(trigger);
+
+    const menu = await screen.findByRole('menu');
+    await waitFor(() => expect(menu).toHaveStyle({ maxHeight: '292px', overflowY: 'auto' }));
+  });
+});

package/src/components/variables/__tests__/FlowContextSelector.test.tsx

@@ -864,4 +864,39 @@ describe('FlowContextSelector', () => {
     // It should only expand the node, not select it
     expect(onChange).not.toHaveBeenCalled();
   });
+
+  it('should expand but never select a node marked selectable=false', async () => {
+    const onChange = vi.fn();
+    const flowContext = createTestFlowContext();
+    const metaTree = [
+      {
+        name: 'date',
+        title: 'Date',
+        type: 'date',
+        paths: ['date'],
+        selectable: false,
+        children: [{ name: 'today', title: 'Today', type: 'date', paths: ['date', 'today'] }],
+      },
+    ];
+
+    render(
+      <TestFlowContextWrapper context={flowContext}>
+        <FlowContextSelector metaTree={metaTree} onChange={onChange} />
+      </TestFlowContextWrapper>,
+    );
+
+    fireEvent.click(screen.getByRole('button'));
+    await waitFor(() => expect(screen.getByText('Date')).toBeInTheDocument());
+
+    fireEvent.click(screen.getByText('Date'));
+    fireEvent.click(screen.getByText('Date'));
+    expect(onChange).not.toHaveBeenCalled();
+
+    await waitFor(() => expect(screen.getByText('Today')).toBeInTheDocument());
+    fireEvent.click(screen.getByText('Today'));
+    expect(onChange).toHaveBeenCalledWith(
+      '{{ ctx.date.today }}',
+      expect.objectContaining({ paths: ['date', 'today'] }),
+    );
+  });
 });

package/src/flowContext.ts

@@ -50,11 +50,11 @@ import {
   resolveModuleUrl,
 } from './utils';
 import { FlowExitAllException } from './utils/exceptions';
-import { enqueueVariablesResolve, JSONValue } from './utils/params-resolvers';
+import { buildFlowModelResolveDescriptor, enqueueVariablesResolve, JSONValue } from './utils/params-resolvers';
 import type { RecordRef } from './utils/serverContextParams';
 import { buildServerContextParams as _buildServerContextParams } from './utils/serverContextParams';
 import { getDirtyAwareApiClient } from './utils/dirtyAwareApiClient';
-import { inferRecordRef } from './utils/variablesParams';
+import { inferRecordRef, inferViewRecordRef } from './utils/variablesParams';
 import { FlowView, FlowViewer } from './views/FlowView';
 import { RunJSContextRegistry, getModelClassName, type RunJSVersion } from './runjs-context/registry';
 import { createEphemeralContext } from './utils/createEphemeralContext';
@@ -165,6 +165,10 @@ function inferSelectsFromUsage(paths: string[] = []): { generatedAppends?: strin
 
 type Getter<T = any> = (ctx: FlowContext) => T | Promise<T>;
 
+export type ResolveJsonTemplateOptions = {
+  contractModelUid?: string | number | null;
+};
+
 export type FlowContextDocRef = string | { url: string; title?: string };
 
 export type FlowDeprecationDoc =
@@ -221,6 +225,8 @@ export interface MetaTreeNode {
   // 变量禁用状态与原因（用于变量选择器 UI 展示）
   disabled?: boolean | (() => boolean);
   disabledReason?: string | (() => string | undefined);
+  // 允许节点仅用于展开子级，而不能作为变量值被选中
+  selectable?: boolean;
   children?: MetaTreeNode[] | (() => Promise<MetaTreeNode[]>);
 }
 
@@ -3044,7 +3050,7 @@ class BaseFlowEngineContext extends FlowContext {
    * @deprecated use `resolveJsonTemplate` instead
    */
   declare renderJson: (template: JSONValue) => Promise<any>;
-  declare resolveJsonTemplate: (template: JSONValue) => Promise<any>;
+  declare resolveJsonTemplate: (template: JSONValue, options?: ResolveJsonTemplateOptions) => Promise<any>;
   declare getVar: (path: string) => Promise<any>;
   declare request: (options: RequestOptions) => Promise<any>;
   declare runjs: (code: string, variables?: Record<string, any>, options?: JSRunnerOptions) => Promise<any>;
@@ -3227,7 +3233,11 @@ export class FlowEngineContext extends BaseFlowEngineContext {
     this.defineMethod('renderJson', function (template: any) {
       return this.resolveJsonTemplate(template);
     });
-    this.defineMethod('resolveJsonTemplate', async function (this: BaseFlowEngineContext, template: any) {
+    const resolveJsonTemplate = async function (
+      this: BaseFlowEngineContext,
+      template: any,
+      options?: ResolveJsonTemplateOptions,
+    ) {
       // 提取模板使用到的变量及其子路径
       const used = extractUsedVariablePaths(template);
       const usedVarNames = Object.keys(used || {});
@@ -3316,6 +3326,15 @@ export class FlowEngineContext extends BaseFlowEngineContext {
         const inputFromMeta = await collectFromMeta();
         const autoInput = { ...inputFromMeta } as Record<string, any>;
 
+        const viewPaths = serverVarPaths.view || [];
+        if (
+          !autoInput.view &&
+          viewPaths.some((path) => path === 'record' || path.startsWith('record.') || path.startsWith('record['))
+        ) {
+          const recordRef = inferViewRecordRef(this);
+          if (recordRef) autoInput.view = { record: recordRef };
+        }
+
         // Special-case: formValues
         // If server needs to resolve some formValues paths but meta params only cover association anchors
         // (e.g. formValues.customer) and some top-level paths are missing (e.g. formValues.status),
@@ -3387,7 +3406,13 @@ export class FlowEngineContext extends BaseFlowEngineContext {
 
         if (this.api) {
           try {
+            const contractRd = buildFlowModelResolveDescriptor(
+              this as FlowRuntimeContext<FlowModel>,
+              options?.contractModelUid,
+            );
             serverResolved = await enqueueVariablesResolve(this as FlowRuntimeContext<FlowModel>, {
+              ...(contractRd ? { contractRd } : {}),
+              rd: buildFlowModelResolveDescriptor(this as FlowRuntimeContext<FlowModel>, this.model?.uid),
               template,
               contextParams: autoContextParams || {},
             });
@@ -3399,7 +3424,8 @@ export class FlowEngineContext extends BaseFlowEngineContext {
       }
 
       return resolveExpressions(serverResolved, this);
-    });
+    };
+    this.defineMethod('resolveJsonTemplate', resolveJsonTemplate);
 
     // Helper: resolve a single ctx expression value via resolveJsonTemplate behavior.
     // Example: await ctx.getVar('ctx.record.id')
@@ -4585,6 +4611,10 @@ export class FlowRunJSContext extends FlowContext {
   constructor(delegate: FlowContext) {
     super();
     this.addDelegate(delegate);
+    const submit = delegate.blockModel?.submitFromRunJs?.bind(delegate.blockModel);
+    if (delegate.form && submit) {
+      this.defineProperty('form', { value: { ...delegate.form, submit } });
+    }
     this.defineProperty('React', { value: React });
     this.defineProperty('antd', { value: antd });
     this.defineProperty('dayjs', {

package/src/resources/__tests__/flowResource.test.ts

@@ -79,6 +79,9 @@ describe('FlowResource - error handling', () => {
     expect(r.getError()).toBeNull();
 
     const err = new ResourceError({ response: { data: { error: { message: 'boom', code: 'X' } } } });
+    expect(err.data).toEqual({ message: 'boom', code: 'X' });
+    expect(err.message).toBe('boom');
+    expect(err.code).toBe('X');
     const ret = r.setError(err);
     expect(ret).toBe(r);
     expect(r.error).toBe(err);

package/src/resources/flowResource.ts

@@ -47,6 +47,7 @@ export class ResourceError extends Error {
   constructor(error) {
     const data = toErrMessages(error).shift();
     super(data.message);
+    this.data = data;
     this.name = 'ResponseError';
   }
 

package/src/utils/__tests__/dateVariable.test.ts

@@ -12,9 +12,12 @@ import {
   decodeBase64Url,
   encodeBase64Url,
   isCompleteCtxDatePath,
+  isCtxDatePathPrefix,
   isCtxDateExpression,
   parseCtxDateExpression,
+  parseCtxDateExpressionConfig,
   resolveCtxDatePath,
+  serializeCtxDateExpressionConfig,
   serializeCtxDateValue,
 } from '../dateVariable';
 
@@ -54,13 +57,60 @@ describe('dateVariable utils', () => {
       number: 2,
     });
 
-    const singleExpr = serializeCtxDateValue('2026-02-12')!;
+    const singleExpr = serializeCtxDateValue('2026-02-12');
+    if (!singleExpr) throw new Error('Expected exact date expression');
     expect(parseCtxDateExpression(singleExpr)).toBe('2026-02-12');
 
-    const rangeExpr = serializeCtxDateValue(['2026-02-12', '2026-02-20'])!;
+    const rangeExpr = serializeCtxDateValue(['2026-02-12', '2026-02-20']);
+    if (!rangeExpr) throw new Error('Expected exact date range expression');
     expect(parseCtxDateExpression(rangeExpr)).toEqual(['2026-02-12', '2026-02-20']);
   });
 
+  it('serializes, parses and resolves formatted expressions', () => {
+    const expression = serializeCtxDateExpressionConfig({
+      kind: 'preset',
+      preset: 'today',
+      format: 'YYYY/MM/DD',
+    });
+    if (!expression) throw new Error('Expected formatted date expression');
+
+    expect(expression).toMatch(/^\{\{ ctx\.date\.format\.v[A-Za-z0-9_-]+\.preset\.today \}\}$/);
+    expect(parseCtxDateExpressionConfig(expression)).toEqual({
+      kind: 'preset',
+      preset: 'today',
+      format: 'YYYY/MM/DD',
+    });
+    // Keep the legacy parser contract for filter-form consumers.
+    expect(parseCtxDateExpression(expression)).toEqual({ type: 'today' });
+
+    const path = expression.replace('{{ ctx.', '').replace(' }}', '').split('.');
+    expect(resolveCtxDatePath(path)).toMatch(/^\d{4}\/\d{2}\/\d{2}$/);
+    expect(isCompleteCtxDatePath(path)).toBe(true);
+  });
+
+  it('preserves significant whitespace in a custom Format', () => {
+    const expression = serializeCtxDateExpressionConfig({
+      kind: 'preset',
+      preset: 'today',
+      format: 'YYYY-MM-DD ',
+    });
+    if (!expression) throw new Error('Expected formatted date expression');
+
+    expect(parseCtxDateExpressionConfig(expression)?.format).toBe('YYYY-MM-DD ');
+  });
+
+  it('formats exact ranges element by element', () => {
+    const expression = serializeCtxDateExpressionConfig({
+      kind: 'exact',
+      value: ['2026-02-12', '2026-02-20'],
+      format: 'YYYYMMDD',
+    });
+    if (!expression) throw new Error('Expected formatted date range expression');
+    const path = expression.replace('{{ ctx.', '').replace(' }}', '').split('.');
+
+    expect(resolveCtxDatePath(path)).toEqual(['20260212', '20260220']);
+  });
+
   it('resolves preset/relative/exact path', () => {
     expect(typeof resolveCtxDatePath(['date', 'preset', 'now'])).toBe('string');
 
@@ -72,11 +122,13 @@ describe('dateVariable utils', () => {
     expect(typeof rel).toBe('string');
     expect(rel).toMatch(/^\d{4}-\d{2}-\d{2}$/);
 
-    const singleExpr = serializeCtxDateValue('2026-02-12')!;
+    const singleExpr = serializeCtxDateValue('2026-02-12');
+    if (!singleExpr) throw new Error('Expected exact date expression');
     const token = singleExpr.replace('{{ ctx.date.exact.single.date.', '').replace(' }}', '');
     expect(resolveCtxDatePath(['date', 'exact', 'single', 'date', token])).toBe('2026-02-12');
 
-    const rangeExpr = serializeCtxDateValue(['2026-02-12', '2026-02-20'])!;
+    const rangeExpr = serializeCtxDateValue(['2026-02-12', '2026-02-20']);
+    if (!rangeExpr) throw new Error('Expected exact date range expression');
     const parts = rangeExpr.replace('{{ ctx.date.exact.range.date.', '').replace(' }}', '').split('.');
     expect(resolveCtxDatePath(['date', 'exact', 'range', 'date', parts[0], parts[1]])).toEqual([
       '2026-02-12',
@@ -90,6 +142,7 @@ describe('dateVariable utils', () => {
     expect(isCompleteCtxDatePath(['date', 'exact', 'single', 'date', 'vabc'])).toBe(true);
     expect(isCompleteCtxDatePath(['date', 'exact', 'range', 'date', 'vabc', 'vdef'])).toBe(true);
     expect(isCompleteCtxDatePath(['date', 'relative', 'next', 'day'])).toBe(false);
+    expect(isCtxDatePathPrefix(['date', 'format'])).toBe(true);
     expect(isCompleteCtxDatePath(['user', 'name'])).toBe(false);
   });
 

package/src/utils/__tests__/variablesParams.test.ts

@@ -34,7 +34,8 @@ describe('variablesParams helpers', () => {
 
   it('inferRecordRef fallback to collection.getFilterByTK when resource has no filterByTk', () => {
     const engine = new FlowEngine();
-    const ds = engine.context.dataSourceManager.getDataSource('main')!;
+    const ds = engine.context.dataSourceManager.getDataSource('main');
+    if (!ds) throw new Error('main data source is required');
     ds.addCollection({
       name: 'users',
       filterTargetKey: 'id',
@@ -108,6 +109,32 @@ describe('variablesParams helpers', () => {
     });
   });
 
+  it('collectContextParamsForTemplate infers view.record when its meta has no descriptor', async () => {
+    const ctx: any = {
+      getPropertyOptions: () => undefined,
+      view: {
+        inputArgs: {
+          collectionName: 'posts',
+          dataSourceKey: 'main',
+          filterByTk: 3,
+        },
+      },
+    };
+
+    const res = await collectContextParamsForTemplate(ctx, {
+      recordId: '{{ ctx.view.record.id }}',
+      viewType: '{{ ctx.view.type }}',
+    });
+
+    expect(res).toEqual({
+      'view.record': {
+        collection: 'posts',
+        dataSourceKey: 'main',
+        filterByTk: 3,
+      },
+    });
+  });
+
   it('createRecordResolveOnServerWithLocal: no local record => always use server', () => {
     const resolver = createRecordResolveOnServerWithLocal(
       () => ({ name: 'posts', dataSourceKey: 'main' }) as any,

package/src/utils/associationObjectVariable.ts

@@ -51,13 +51,14 @@ function findFieldByName(collection: Collection | null | undefined, name?: strin
  * @param primaryKey 主键字段名
  * @returns 解析出的主键值，无法解析时返回 undefined
  */
-function toFilterByTk(value: unknown, primaryKey: string | string[]) {
+export function getAssociationFilterByTk(value: unknown, primaryKey: string | string[]) {
   if (value == null) return undefined;
   if (Array.isArray(primaryKey)) {
     if (typeof value !== 'object' || !value) return undefined;
-    const out: Record<string, any> = {};
+    const record = value as Record<string, unknown>;
+    const out: Record<string, unknown> = {};
     for (const k of primaryKey) {
-      const v = (value as any)[k];
+      const v = record[k];
       if (typeof v === 'undefined' || v === null) return undefined;
       out[k] = v;
     }
@@ -65,7 +66,7 @@ function toFilterByTk(value: unknown, primaryKey: string | string[]) {
   }
   if (typeof value === 'string' || typeof value === 'number') return value;
   if (typeof value === 'object') {
-    return (value as any)[primaryKey];
+    return (value as Record<string, unknown>)[primaryKey];
   }
   return undefined;
 }
@@ -149,7 +150,9 @@ export function createAssociationAwareObjectMetaFactory(
           if (associationValue == null) continue;
 
           if (Array.isArray(associationValue)) {
-            const ids = associationValue.map((item) => toFilterByTk(item, primaryKey)).filter((v) => v != null);
+            const ids = associationValue
+              .map((item) => getAssociationFilterByTk(item, primaryKey))
+              .filter((v) => v != null);
             if (ids.length) {
               params[name] = {
                 collection: target,
@@ -158,7 +161,7 @@ export function createAssociationAwareObjectMetaFactory(
               };
             }
           } else {
-            const id = toFilterByTk(associationValue, primaryKey);
+            const id = getAssociationFilterByTk(associationValue, primaryKey);
             if (id != null) {
               params[name] = {
                 collection: target,