mirror of
https://github.com/alibaba/lowcode-engine.git
synced 2025-12-14 21:12:53 +00:00
feat: fix render-core leaf hoc component condition config should get from leaf exportSchema fn
This commit is contained in:
parent
4fd7f27f8e
commit
85704c3694
@ -5,6 +5,10 @@ import { Prop, IPropParent, UNSET } from './prop';
|
|||||||
import { Node } from '../node';
|
import { Node } from '../node';
|
||||||
import { TransformStage } from '../transform-stage';
|
import { TransformStage } from '../transform-stage';
|
||||||
|
|
||||||
|
interface ExtrasObject {
|
||||||
|
[key: string]: any;
|
||||||
|
}
|
||||||
|
|
||||||
export const EXTRA_KEY_PREFIX = '___';
|
export const EXTRA_KEY_PREFIX = '___';
|
||||||
export function getConvertedExtraKey(key: string): string {
|
export function getConvertedExtraKey(key: string): string {
|
||||||
if (!key) {
|
if (!key) {
|
||||||
@ -53,7 +57,7 @@ export class Props implements IPropParent {
|
|||||||
|
|
||||||
@obx type: 'map' | 'list' = 'map';
|
@obx type: 'map' | 'list' = 'map';
|
||||||
|
|
||||||
constructor(owner: Node, value?: PropsMap | PropsList | null, extras?: object) {
|
constructor(owner: Node, value?: PropsMap | PropsList | null, extras?: ExtrasObject) {
|
||||||
makeObservable(this);
|
makeObservable(this);
|
||||||
this.owner = owner;
|
this.owner = owner;
|
||||||
if (Array.isArray(value)) {
|
if (Array.isArray(value)) {
|
||||||
@ -70,7 +74,7 @@ export class Props implements IPropParent {
|
|||||||
}
|
}
|
||||||
|
|
||||||
@action
|
@action
|
||||||
import(value?: PropsMap | PropsList | null, extras?: object) {
|
import(value?: PropsMap | PropsList | null, extras?: ExtrasObject) {
|
||||||
const originItems = this.items;
|
const originItems = this.items;
|
||||||
if (Array.isArray(value)) {
|
if (Array.isArray(value)) {
|
||||||
this.type = 'list';
|
this.type = 'list';
|
||||||
@ -104,7 +108,7 @@ export class Props implements IPropParent {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
export(stage: TransformStage = TransformStage.Save): { props?: PropsMap | PropsList; extras?: object } {
|
export(stage: TransformStage = TransformStage.Save): { props?: PropsMap | PropsList; extras?: ExtrasObject } {
|
||||||
stage = compatStage(stage);
|
stage = compatStage(stage);
|
||||||
if (this.items.length < 1) {
|
if (this.items.length < 1) {
|
||||||
return {};
|
return {};
|
||||||
|
|||||||
@ -117,7 +117,7 @@ export class Selection {
|
|||||||
/**
|
/**
|
||||||
* 获取选中的节点
|
* 获取选中的节点
|
||||||
*/
|
*/
|
||||||
getNodes() {
|
getNodes(): Node[] {
|
||||||
const nodes = [];
|
const nodes = [];
|
||||||
for (const id of this._selected) {
|
for (const id of this._selected) {
|
||||||
const node = this.doc.getNode(id);
|
const node = this.doc.getNode(id);
|
||||||
|
|||||||
@ -14,23 +14,15 @@ const jestConfig = {
|
|||||||
transformIgnorePatterns: [
|
transformIgnorePatterns: [
|
||||||
`/node_modules/(?!${esModules})/`,
|
`/node_modules/(?!${esModules})/`,
|
||||||
],
|
],
|
||||||
setupFiles: ['./tests/fixtures/unhandled-rejection.ts'],
|
setupFiles: [
|
||||||
|
'./tests/fixtures/unhandled-rejection.ts',
|
||||||
|
'./tests/setup.ts',
|
||||||
|
],
|
||||||
moduleFileExtensions: ['ts', 'tsx', 'js', 'json'],
|
moduleFileExtensions: ['ts', 'tsx', 'js', 'json'],
|
||||||
collectCoverage: true,
|
collectCoverage: true,
|
||||||
collectCoverageFrom: [
|
collectCoverageFrom: [
|
||||||
'src/**/*.ts',
|
'src/**/*.ts',
|
||||||
'!src/**/*.d.ts',
|
'src/**/*.tsx',
|
||||||
'!src/icons/**',
|
|
||||||
'!src/locale/**',
|
|
||||||
'!src/builtin-simulator/utils/**',
|
|
||||||
'!src/plugin/sequencify.ts',
|
|
||||||
'!src/document/node/exclusive-group.ts',
|
|
||||||
'!src/document/node/props/value-to-source.ts',
|
|
||||||
'!src/builtin-simulator/live-editing/live-editing.ts',
|
|
||||||
'!src/designer/offset-observer.ts',
|
|
||||||
'!src/designer/clipboard.ts',
|
|
||||||
'!**/node_modules/**',
|
|
||||||
'!**/vendor/**',
|
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@ -412,11 +412,12 @@ export function leafWrapper(Comp: types.IBaseRenderComponent, {
|
|||||||
const node = leaf;
|
const node = leaf;
|
||||||
|
|
||||||
if (key === '___condition___') {
|
if (key === '___condition___') {
|
||||||
const condition = parseData(newValue, scope);
|
const { condition = true } = this.leaf?.export(TransformStage.Render) || {};
|
||||||
|
const conditionValue = parseData(condition, scope);
|
||||||
__debug(`key is ___condition___, change condition value to [${condition}]`);
|
__debug(`key is ___condition___, change condition value to [${condition}]`);
|
||||||
// 条件表达式改变
|
// 条件表达式改变
|
||||||
this.setState({
|
this.setState({
|
||||||
condition,
|
condition: conditionValue,
|
||||||
});
|
});
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -108,6 +108,9 @@ export default function rendererFactory(): IRenderComponent {
|
|||||||
if (SetComponent.patchedCatch) {
|
if (SetComponent.patchedCatch) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
if (!SetComponent.prototype) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
SetComponent.patchedCatch = true;
|
SetComponent.patchedCatch = true;
|
||||||
|
|
||||||
// Rax 的 getDerivedStateFromError 有 BUG,这里先用 componentDidCatch 来替代
|
// Rax 的 getDerivedStateFromError 有 BUG,这里先用 componentDidCatch 来替代
|
||||||
|
|||||||
@ -25,6 +25,52 @@ exports[`leafWrapper base 1`] = `
|
|||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
|
|
||||||
|
exports[`leafWrapper change ___condition___ props 1`] = `
|
||||||
|
<div
|
||||||
|
_leaf={
|
||||||
|
Node {
|
||||||
|
"emitter": EventEmitter {
|
||||||
|
"_events": Object {
|
||||||
|
"onChildrenChange": [Function],
|
||||||
|
"onPropChange": [Function],
|
||||||
|
"onVisibleChange": [Function],
|
||||||
|
},
|
||||||
|
"_eventsCount": 3,
|
||||||
|
"_maxListeners": undefined,
|
||||||
|
Symbol(kCapture): false,
|
||||||
|
},
|
||||||
|
"hasLoop": false,
|
||||||
|
"schema": Object {},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/>
|
||||||
|
`;
|
||||||
|
|
||||||
|
exports[`leafWrapper change ___condition___ props, but not hidden component 1`] = `
|
||||||
|
<div
|
||||||
|
_leaf={
|
||||||
|
Node {
|
||||||
|
"emitter": EventEmitter {
|
||||||
|
"_events": Object {
|
||||||
|
"onChildrenChange": [Function],
|
||||||
|
"onPropChange": [Function],
|
||||||
|
"onVisibleChange": [Function],
|
||||||
|
},
|
||||||
|
"_eventsCount": 3,
|
||||||
|
"_maxListeners": undefined,
|
||||||
|
Symbol(kCapture): false,
|
||||||
|
},
|
||||||
|
"hasLoop": false,
|
||||||
|
"schema": Object {},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<div>
|
||||||
|
new content
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`;
|
||||||
|
|
||||||
exports[`leafWrapper change props 1`] = `
|
exports[`leafWrapper change props 1`] = `
|
||||||
<div
|
<div
|
||||||
_leaf={
|
_leaf={
|
||||||
|
|||||||
@ -6,7 +6,6 @@ import { leafWrapper } from '../../src/hoc/leaf';
|
|||||||
import components from '../utils/components';
|
import components from '../utils/components';
|
||||||
import Node from '../utils/node';
|
import Node from '../utils/node';
|
||||||
|
|
||||||
|
|
||||||
const baseRenderer: any = {
|
const baseRenderer: any = {
|
||||||
__debug () {},
|
__debug () {},
|
||||||
__getComponentProps (schema: any) {
|
__getComponentProps (schema: any) {
|
||||||
@ -71,8 +70,29 @@ describe('leafWrapper', () => {
|
|||||||
let tree = component.toJSON();
|
let tree = component.toJSON();
|
||||||
expect(tree).toMatchSnapshot();
|
expect(tree).toMatchSnapshot();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('change ___condition___ props', () => {
|
||||||
|
TextNode.schema.condition = false;
|
||||||
|
TextNode.emitPropChange({
|
||||||
|
key: '___condition___',
|
||||||
|
newValue: false,
|
||||||
|
} as any);
|
||||||
|
|
||||||
|
let tree = component.toJSON();
|
||||||
|
expect(tree).toMatchSnapshot();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('change ___condition___ props, but not hidden component', () => {
|
||||||
|
TextNode.schema.condition = true;
|
||||||
|
TextNode.emitPropChange({
|
||||||
|
key: '___condition___',
|
||||||
|
newValue: false,
|
||||||
|
} as any);
|
||||||
|
|
||||||
|
let tree = component.toJSON();
|
||||||
|
expect(tree).toMatchSnapshot();
|
||||||
|
})
|
||||||
|
});
|
||||||
|
|
||||||
describe('loop', () => {
|
describe('loop', () => {
|
||||||
const Div = leafWrapper(components.Div as any, {
|
const Div = leafWrapper(components.Div as any, {
|
||||||
@ -105,4 +125,4 @@ describe('loop', () => {
|
|||||||
<Text _leaf={TextNode} content="content"></Text>
|
<Text _leaf={TextNode} content="content"></Text>
|
||||||
</Div>
|
</Div>
|
||||||
);
|
);
|
||||||
})
|
});
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import renderer from 'react-test-renderer';
|
import renderer from 'react-test-renderer/';
|
||||||
import schema from '../fixtures/schema/basic';
|
import schema from '../fixtures/schema/basic';
|
||||||
import '../utils/react-env-init';
|
import '../utils/react-env-init';
|
||||||
import rendererFactory from '../../src/renderer/renderer';
|
import rendererFactory from '../../src/renderer/renderer';
|
||||||
|
|||||||
@ -10,3 +10,8 @@ jest.mock('zen-logger', () => {
|
|||||||
default: Logger,
|
default: Logger,
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
|
||||||
|
export const mockConsoleWarn = jest.fn();
|
||||||
|
console.warn = mockConsoleWarn;
|
||||||
|
|
||||||
|
process.env.NODE_ENV = 'production';
|
||||||
@ -18,14 +18,14 @@ export default class Selection {
|
|||||||
/**
|
/**
|
||||||
* 返回选中的节点 id
|
* 返回选中的节点 id
|
||||||
*/
|
*/
|
||||||
get selected() {
|
get selected(): string[] {
|
||||||
return this[selectionSymbol].selected;
|
return this[selectionSymbol].selected;
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* return selected Node instance
|
* return selected Node instance
|
||||||
*/
|
*/
|
||||||
get node() {
|
get node(): Node {
|
||||||
return this.getNodes()[0];
|
return this.getNodes()[0];
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -81,7 +81,7 @@ export default class Selection {
|
|||||||
* 获取选中的节点实例
|
* 获取选中的节点实例
|
||||||
* @returns
|
* @returns
|
||||||
*/
|
*/
|
||||||
getNodes() {
|
getNodes(): Node[] {
|
||||||
return this[selectionSymbol].getNodes().map((node: InnerNode) => Node.create(node));
|
return this[selectionSymbol].getNodes().map((node: InnerNode) => Node.create(node));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user