From 537258d9e6b8e90be33614e6888891eab04705f9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=8A=9B=E7=9A=93?= Date: Tue, 10 Nov 2020 14:03:11 +0800 Subject: [PATCH] =?UTF-8?q?chore:=20=E5=B0=86=E5=88=A0=E9=99=A4=E8=8A=82?= =?UTF-8?q?=E7=82=B9=E7=9A=84=20parent=20=E4=BF=9D=E7=95=99=EF=BC=8Csubtre?= =?UTF-8?q?eModified=20=E6=97=B6=E8=83=BD=E6=8B=BF=E5=88=B0=E4=B8=80?= =?UTF-8?q?=E4=BA=9B=E7=88=B6=E5=AD=90=E5=85=B3=E7=B3=BB=E4=BF=A1=E6=81=AF?= =?UTF-8?q?=20refactor:=20=E4=B8=8D=E5=86=8D=E5=9C=A8=20document=20?= =?UTF-8?q?=E5=88=9D=E5=A7=8B=E5=8C=96=E5=AE=8C=E6=88=90=E5=90=8E=E6=96=B0?= =?UTF-8?q?=E5=BB=BA=E7=9A=84=E8=8A=82=E7=82=B9=E9=83=BD=E9=BB=98=E8=AE=A4?= =?UTF-8?q?=E9=87=8D=E7=BD=AE=20id=20chore(test):=20=E8=A1=A5=E5=85=85=20p?= =?UTF-8?q?rototype=20=E9=83=A8=E5=88=86=E7=9A=84=E5=8D=95=E6=B5=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../bem-tools/border-resizing.tsx | 2 +- .../designer/src/document/document-model.ts | 2 +- packages/designer/src/document/node/node.ts | 4 +- packages/editor-core/src/di/ioc-context.ts | 4 - .../tests/bundle/prototype.test.ts | 144 +++++++++++++++++- .../src/transducers/addon-combine.ts | 2 +- packages/rax-simulator-renderer/package.json | 2 +- 7 files changed, 144 insertions(+), 16 deletions(-) diff --git a/packages/designer/src/builtin-simulator/bem-tools/border-resizing.tsx b/packages/designer/src/builtin-simulator/bem-tools/border-resizing.tsx index 12aa99174..7c60e0143 100644 --- a/packages/designer/src/builtin-simulator/bem-tools/border-resizing.tsx +++ b/packages/designer/src/builtin-simulator/bem-tools/border-resizing.tsx @@ -179,7 +179,7 @@ export class BoxResizingInstance extends Component<{ typeof metaData.experimental.callbacks.onResizeEnd === 'function' ) { (e as any).trigger = direction; - metaData.experimental.callbacks.onResizeStart(e, node); + metaData.experimental.callbacks.onResizeEnd(e, node); } const editor = globalContext.get(Editor); diff --git a/packages/designer/src/document/document-model.ts b/packages/designer/src/document/document-model.ts index 42b292880..cef2bc77e 100644 --- a/packages/designer/src/document/document-model.ts +++ b/packages/designer/src/document/document-model.ts @@ -205,7 +205,7 @@ export class DocumentModel { } let node: Node | null = null; - if (this.inited) { + if (this.hasNode(schema?.id)) { schema.id = null; } if (schema.id) { diff --git a/packages/designer/src/document/node/node.ts b/packages/designer/src/document/node/node.ts index 01ee191a2..a2deabff7 100644 --- a/packages/designer/src/document/node/node.ts +++ b/packages/designer/src/document/node/node.ts @@ -295,9 +295,9 @@ export class Node { if (useMutator) { this._parent?.didDropOut(this); } - // 建立新的父子关系 - this._parent = parent; if (parent) { + // 建立新的父子关系，尤其注意：对于 parent 为 null 的场景，不会赋值，因为 subtreeModified 等事件可能需要知道该 node 被删除前的父子关系 + this._parent = parent; this.document.removeWillPurge(this); if (!this.conditionGroup) { // initial conditionGroup diff --git a/packages/editor-core/src/di/ioc-context.ts b/packages/editor-core/src/di/ioc-context.ts index 5520230bf..27b854cab 100644 --- a/packages/editor-core/src/di/ioc-context.ts +++ b/packages/editor-core/src/di/ioc-context.ts @@ -1,9 +1,5 @@ import { IocContext } from 'power-di'; -// 原本的 canBeKey 里判断函数的方法是 instanceof Function，在某些 babel 编译 class 后的场景不满足该判断条件，此处暴力破解 -IocContext.prototype.canBeKey = (obj: any) => - typeof obj === 'function' || ['string', 'symbol'].includes(typeof obj); - export * from 'power-di'; export const globalContext = IocContext.DefaultInstance; diff --git a/packages/editor-preset-vision/tests/bundle/prototype.test.ts b/packages/editor-preset-vision/tests/bundle/prototype.test.ts index a120522a1..cc9667563 100644 --- a/packages/editor-preset-vision/tests/bundle/prototype.test.ts +++ b/packages/editor-preset-vision/tests/bundle/prototype.test.ts @@ -1,3 +1,4 @@ +import { Component } from 'react'; import set from 'lodash/set'; import cloneDeep from 'lodash/clonedeep'; import '../fixtures/window'; @@ -8,18 +9,20 @@ import divPrototypeConfig from '../fixtures/prototype/div-vision'; import divPrototypeMeta from '../fixtures/prototype/div-meta'; // import VisualEngine from '../../src'; import { designer } from '../../src/editor'; -import Prototype from '../../src/bundle/prototype'; +import Prototype, { isPrototype } from '../../src/bundle/prototype'; import { Editor } from '@ali/lowcode-editor-core'; // import { getIdsFromSchema, getNodeFromSchemaById } from '../utils'; - describe('Prototype', () => { it('构造函数 - OldPrototypeConfig', () => { const proto = new Prototype(divPrototypeConfig); + expect(isPrototype(proto)).toBeTruthy; expect(proto.getComponentName()).toBe('Div'); expect(proto.getId()).toBe('Div'); expect(proto.getCategory()).toBe('布局'); - expect(proto.getDocUrl()).toBe('http://gitlab.alibaba-inc.com/vision-components/vc-block/blob/master/README.md'); + expect(proto.getDocUrl()).toBe( + 'http://gitlab.alibaba-inc.com/vision-components/vc-block/blob/master/README.md', + ); expect(proto.getIcon()).toBeUndefined; expect(proto.getTitle()).toBe('Div'); expect(proto.isPrototype).toBeTruthy; @@ -31,7 +34,9 @@ describe('Prototype', () => { expect(proto.getComponentName()).toBe('Div'); expect(proto.getId()).toBe('Div'); expect(proto.getCategory()).toBe('布局'); - expect(proto.getDocUrl()).toBe('http://gitlab.alibaba-inc.com/vision-components/vc-block/blob/master/README.md'); + expect(proto.getDocUrl()).toBe( + 'http://gitlab.alibaba-inc.com/vision-components/vc-block/blob/master/README.md', + ); expect(proto.getIcon()).toBeUndefined; expect(proto.getTitle()).toBe('Div'); expect(proto.isPrototype).toBeTruthy; @@ -44,7 +49,9 @@ describe('Prototype', () => { expect(proto.getComponentName()).toBe('Div'); expect(proto.getId()).toBe('Div'); expect(proto.getCategory()).toBe('布局'); - expect(proto.getDocUrl()).toBe('http://gitlab.alibaba-inc.com/vision-components/vc-block/blob/master/README.md'); + expect(proto.getDocUrl()).toBe( + 'http://gitlab.alibaba-inc.com/vision-components/vc-block/blob/master/README.md', + ); expect(proto.getIcon()).toBeUndefined; expect(proto.getTitle()).toBe('Div'); expect(proto.isPrototype).toBeTruthy; @@ -56,7 +63,9 @@ describe('Prototype', () => { expect(proto.getComponentName()).toBe('Div'); expect(proto.getId()).toBe('Div'); expect(proto.getCategory()).toBe('布局'); - expect(proto.getDocUrl()).toBe('http://gitlab.alibaba-inc.com/vision-components/vc-block/blob/master/README.md'); + expect(proto.getDocUrl()).toBe( + 'http://gitlab.alibaba-inc.com/vision-components/vc-block/blob/master/README.md', + ); expect(proto.getIcon()).toBeUndefined; expect(proto.getTitle()).toBe('Div'); expect(proto.isPrototype).toBeTruthy; @@ -68,4 +77,127 @@ describe('Prototype', () => { const proto2 = Prototype.create(divPrototypeConfig, {}, true); expect(proto).toBe(proto2); }); + describe('类成员函数', () => { + let proto: Prototype = null; + beforeEach(() => { + proto = new Prototype(divPrototypeConfig); + }); + afterEach(() => { + proto = null; + }); + it('各种函数', () => { + expect(proto.componentName).toBe('Div'); + expect(proto.getComponentName()).toBe('Div'); + expect(proto.getId()).toBe('Div'); + expect(proto.getContextInfo('anything')).toBeUndefined; + expect(proto.getPropConfigs()).toBe(divPrototypeConfig); + expect(proto.getConfig()).toBe(divPrototypeConfig); + expect(proto.getConfig('componentName')).toBe('Div'); + expect(proto.getConfig('configure')).toBe(divPrototypeConfig.configure); + expect(proto.getConfig('docUrl')).toBe( + 'http://gitlab.alibaba-inc.com/vision-components/vc-block/blob/master/README.md', + ); + expect(proto.getConfig('title')).toBe('容器'); + expect(proto.getConfig('isContainer')).toBeTruthy; + + class MockView extends Component {} + + expect(proto.getView()).toBeUndefined; + proto.setView(MockView); + expect(proto.getView()).toBe(MockView); + expect(proto.meta.getMetadata().experimental?.view).toBe(MockView); + + expect(proto.getPackageName()).toBeUndefined; + proto.setPackageName('@ali/vc-div'); + expect(proto.getPackageName()).toBe('@ali/vc-div'); + + expect(proto.getConfig('category')).toBe('布局'); + proto.setCategory('布局 new'); + expect(proto.getConfig('category')).toBe('布局 new'); + + expect(proto.getConfigure()).toHaveLength(3); + expect(proto.getConfigure()[0].name).toBe('#props'); + expect(proto.getConfigure()[1].name).toBe('#styles'); + expect(proto.getConfigure()[2].name).toBe('#advanced'); + + expect(proto.getRectSelector()).toBeUndefined; + expect(proto.isAutoGenerated()).toBeFalsy; + }); + }); + + describe('类成员函数', () => { + it('addGlobalPropsConfigure', () => { + Prototype.addGlobalPropsConfigure({ + name: 'globalInsertProp1', + }); + const proto1 = new Prototype(divPrototypeConfig); + expect(proto1.getConfigure()[2].items).toHaveLength(4); + expect(proto1.getConfigure()[2].items[3].name).toBe('globalInsertProp1'); + Prototype.addGlobalPropsConfigure({ + name: 'globalInsertProp2', + }); + const proto2 = new Prototype(divPrototypeConfig); + expect(proto2.getConfigure()[2].items).toHaveLength(5); + expect(proto1.getConfigure()[2].items[4].name).toBe('globalInsertProp2'); + + Prototype.addGlobalPropsConfigure({ + name: 'globalInsertProp3', + position: 'top', + }); + + const proto3 = new Prototype(divPrototypeConfig); + expect(proto3.getConfigure()[0].items).toHaveLength(3); + expect(proto1.getConfigure()[0].items[0].name).toBe('globalInsertProp3'); + }); + + it('removeGlobalPropsConfigure', () => { + Prototype.removeGlobalPropsConfigure('globalInsertProp1'); + Prototype.removeGlobalPropsConfigure('globalInsertProp2'); + Prototype.removeGlobalPropsConfigure('globalInsertProp3'); + const proto2 = new Prototype(divPrototypeConfig); + expect(proto2.getConfigure()[0].items).toHaveLength(2); + expect(proto2.getConfigure()[2].items).toHaveLength(3); + }); + + it('overridePropsConfigure', () => { + Prototype.addGlobalPropsConfigure({ + name: 'globalInsertProp1', + title: 'globalInsertPropTitle', + position: 'top', + }); + const proto1 = new Prototype(divPrototypeConfig); + expect(proto1.getConfigure()[0].items).toHaveLength(3); + expect(proto1.getConfigure()[0].items[0].name).toBe('globalInsertProp1'); + expect(proto1.getConfigure()[0].items[0].title).toBe('globalInsertPropTitle'); + + Prototype.overridePropsConfigure('Div', [ + { + name: 'globalInsertProp1', + title: 'globalInsertPropTitleChanged', + }, + ]); + const proto2 = new Prototype(divPrototypeConfig); + expect(proto2.getConfigure()[0].name).toBe('globalInsertProp1'); + expect(proto2.getConfigure()[0].title).toBe('globalInsertPropTitleChanged'); + + Prototype.overridePropsConfigure('Div', { + globalInsertProp1: { + name: 'globalInsertProp1', + title: 'globalInsertPropTitleChanged new', + position: 'top', + }, + }); + const proto3 = new Prototype(divPrototypeConfig); + expect(proto3.getConfigure()[0].items[0].name).toBe('globalInsertProp1'); + expect(proto3.getConfigure()[0].items[0].title).toBe('globalInsertPropTitleChanged new'); + }); + + it('addGlobalExtraActions', () => { + function haha() { return 'heihei'; } + Prototype.addGlobalExtraActions(haha); + const proto1 = new Prototype(divPrototypeConfig); + expect(proto1.meta.availableActions).toHaveLength(4); + expect(proto1.meta.availableActions[3].name).toBe('haha'); + }); + }); }); diff --git a/packages/editor-skeleton/src/transducers/addon-combine.ts b/packages/editor-skeleton/src/transducers/addon-combine.ts index fa8d846f8..4a4c5b598 100644 --- a/packages/editor-skeleton/src/transducers/addon-combine.ts +++ b/packages/editor-skeleton/src/transducers/addon-combine.ts @@ -329,7 +329,7 @@ export default function (metadata: TransformedComponentMetadata): TransformedCom if (advanceGroup.length > 0) { combined.push({ name: '#advanced', - title: { type: 'i18n', 'zh-CN': '高级', 'en-US': 'Advance' }, + title: { type: 'i18n', 'zh-CN': '高级', 'en-US': 'Advanced' }, items: advanceGroup, }); } diff --git a/packages/rax-simulator-renderer/package.json b/packages/rax-simulator-renderer/package.json index 20f80bbcf..5469de810 100644 --- a/packages/rax-simulator-renderer/package.json +++ b/packages/rax-simulator-renderer/package.json @@ -57,5 +57,5 @@ "publishConfig": { "registry": "https://registry.npm.alibaba-inc.com" }, - "homepage": "https://unpkg.alibaba-inc.com/@ali/lowcode-rax-simulator-renderer@0.13.1-10/build/index.html" + "homepage": "https://unpkg.alibaba-inc.com/@ali/lowcode-rax-simulator-renderer@0.13.1-11/build/index.html" }