feat: fix render-core leaf hoc component condition config should get from leaf exportSchema fn

This commit is contained in:
liujuping 2022-05-10 13:04:08 +08:00 committed by LeoYuan 袁力皓
parent 4fd7f27f8e
commit 85704c3694
10 changed files with 98 additions and 27 deletions

View File

@ -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 {};

View File

@ -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);

View File

@ -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/**',
], ],
}; };

View File

@ -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;
} }

View File

@ -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 来替代

View File

@ -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={

View File

@ -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>
); );
}) });

View File

@ -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';

View File

@ -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';

View File

@ -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));
} }
} }