From bef563d46ceac8af293191de64b0c0ae371ae776 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=87=8E=E8=BF=82=E8=BF=82?= Date: Tue, 26 Dec 2023 11:18:14 +0800 Subject: [PATCH 1/4] fix(scrollBar): disable clickable when hide track --- src/components/scrollBar/style.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/components/scrollBar/style.scss b/src/components/scrollBar/style.scss index 19e88680e..63a920c30 100644 --- a/src/components/scrollBar/style.scss +++ b/src/components/scrollBar/style.scss @@ -44,6 +44,7 @@ &--hidden { opacity: 0; + pointer-events: none; transition: opacity 0.8s linear; } } @@ -74,4 +75,4 @@ display: none; } } -} +} \ No newline at end of file From ce46463581438e58915aebac97cd9806cf472ae1 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=87=8E=E8=BF=82=E8=BF=82?= Date: Tue, 26 Dec 2023 11:19:39 +0800 Subject: [PATCH 2/4] fix: fix model's value not change and add onEditorInstanceMount event --- src/controller/__tests__/editor.test.ts | 10 ++++ src/controller/editor.tsx | 8 ++++ src/model/workbench/editor.ts | 1 + .../__tests__/editorService.test.tsx | 46 +++++++++++++++---- src/services/workbench/editorService.ts | 35 +++++++++++--- stories/extensions/test/index.tsx | 4 ++ stories/extensions/test/testPane.tsx | 16 +++++++ 7 files changed, 104 insertions(+), 16 deletions(-) diff --git a/src/controller/__tests__/editor.test.ts b/src/controller/__tests__/editor.test.ts index 42dc1e35a..787803c1d 100644 --- a/src/controller/__tests__/editor.test.ts +++ b/src/controller/__tests__/editor.test.ts @@ -9,6 +9,16 @@ const editorService = container.resolve(EditorService); const statusBarService = container.resolve(StatusBarService); const builtinService = container.resolve(BuiltinService); +jest.mock('mo/monaco', () => { + const original = jest.requireActual('mo/monaco'); + return { + ...original, + editor: { + getModel: jest.fn(), + }, + }; +}); + describe('The ediotr controller', () => { test('The initEditorEvents method', () => { const editorInstance = {} as MonacoEditor.IStandaloneCodeEditor; diff --git a/src/controller/editor.tsx b/src/controller/editor.tsx index eafc8c216..011ea0e28 100644 --- a/src/controller/editor.tsx +++ b/src/controller/editor.tsx @@ -199,6 +199,8 @@ export class EditorController extends Controller implements IEditorController { tab?.data?.value!, tab?.data?.language! ); + + this.onEditorInstanceMount(editorInstance); }; public onClickActions = (action: IEditorActionsProps) => { @@ -374,4 +376,10 @@ export class EditorController extends Controller implements IEditorController { } } } + + public onEditorInstanceMount( + editorInstance: MonacoEditor.IStandaloneCodeEditor + ) { + this.emit(EditorEvent.onEditorInstanceMount, editorInstance); + } } diff --git a/src/model/workbench/editor.ts b/src/model/workbench/editor.ts index ec7c875a3..d1a206d69 100644 --- a/src/model/workbench/editor.ts +++ b/src/model/workbench/editor.ts @@ -17,6 +17,7 @@ export enum EditorEvent { OnUpdateTab = 'editor.updateTab', onActionsClick = 'editor.actionsClick', OnSplitEditorRight = 'editor.splitEditorRight', + onEditorInstanceMount = 'editor.onEditorInstanceMount', } export interface BuiltInEditorTabDataType { diff --git a/src/services/workbench/__tests__/editorService.test.tsx b/src/services/workbench/__tests__/editorService.test.tsx index 99684c68c..56c06e59c 100644 --- a/src/services/workbench/__tests__/editorService.test.tsx +++ b/src/services/workbench/__tests__/editorService.test.tsx @@ -9,6 +9,16 @@ import { editor as MonacoEditor } from 'mo/monaco'; import { cloneDeep } from 'lodash'; import { act } from 'react-dom/test-utils'; +jest.mock('mo/monaco', () => { + const original = jest.requireActual('mo/monaco'); + return { + ...original, + editor: { + getModel: jest.fn(), + }, + }; +}); + describe('Test EditorService', () => { let mockTab: IEditorTab; @@ -132,7 +142,7 @@ describe('Test EditorService', () => { expect(editor.editorInstance).toBeUndefined(); }); - test('Update the tab', () => { + test('Update the tab without model', () => { const editor = new EditorService(); editor.open(mockTab); expect(editor.getState().current?.activeTab).toBe(mockTab.id); @@ -198,14 +208,9 @@ describe('Test EditorService', () => { expect(groups?.length).toBe(1); const setValFn = jest.fn(); - const getValFn = jest.fn(() => ''); - groups![0].editorInstance = { - getModel: () => ({ - getValue: getValFn, - setValue: setValFn, - }), - }; - + (MonacoEditor.getModel as jest.Mock).mockImplementation(() => ({ + setValue: setValFn, + })); act(() => { editor.updateTab({ id: mockTab.id, @@ -217,6 +222,20 @@ describe('Test EditorService', () => { expect(setValFn).toBeCalled(); expect(setValFn.mock.calls[0][0]).toBe('test'); + + // Update editor text even not current tab + editor.setActive(1, 1); + act(() => { + editor.updateTab({ + id: mockTab.id, + data: { + value: 'test2', + }, + }); + }); + + expect(setValFn).toBeCalledTimes(2); + expect(setValFn.mock.calls[1][0]).toBe('test2'); }); test('Should prevent update editor text if current tab with renderPane', () => { @@ -614,4 +633,13 @@ describe('Test EditorService', () => { expect(testFn.mock.calls[0]).toEqual(expected); }); }); + + test('Listen to the editorInstance mount', () => { + const editor = new EditorService(); + expectFnCalled((testFn) => { + editor.onEditorInstanceMount(testFn); + editor.emit(EditorEvent.onEditorInstanceMount, {}); + expect(testFn.mock.calls[0][0]).toEqual({}); + }); + }); }); diff --git a/src/services/workbench/editorService.ts b/src/services/workbench/editorService.ts index 7664a5abe..c1fd37027 100644 --- a/src/services/workbench/editorService.ts +++ b/src/services/workbench/editorService.ts @@ -1,6 +1,6 @@ import 'reflect-metadata'; import { singleton, container } from 'tsyringe'; -import { cloneDeep, isString } from 'lodash'; +import { cloneDeep } from 'lodash'; import { Component } from 'mo/react'; import { EditorModel, @@ -205,6 +205,12 @@ export interface IEditorService extends Component { * @param tabId */ getGroupIdByTab(tabId: UniqueId): UniqueId | null; + /** + * Listen to the editor instance mount event + */ + onEditorInstanceMount( + callback: (editorInstance: MonacoEditor.IStandaloneCodeEditor) => void + ): void; } @singleton() export class EditorService @@ -325,11 +331,15 @@ export class EditorService updatedTab = Object.assign(tabData, tab); } if (group.activeTab === tab.id) { - isString(editorValue) && - !tabData?.renderPane && - this.setGroupEditorValue(group, editorValue); updatedTab = Object.assign(group.tab, tab); } + // Update model's value + const model = MonacoEditor.getModel( + Uri.parse(tab.id.toString()) + ); + if (model) { + model.setValue(editorValue || ''); + } this.updateGroup(groupId, group); if (groupId === this.state.current?.id) { @@ -345,11 +355,16 @@ export class EditorService } if (group.activeTab === tab.id) { - isString(editorValue) && - !tabData?.renderPane && - this.setGroupEditorValue(group, editorValue); updatedTab = Object.assign(group.tab, tab); } + + // Update model's value + const model = MonacoEditor.getModel( + Uri.parse(tab.id.toString()) + ); + if (model) { + model.setValue(editorValue || ''); + } }); if (current?.activeTab === tab.id) { @@ -777,4 +792,10 @@ export class EditorService ) { this.subscribe(EditorEvent.onActionsClick, callback); } + + public onEditorInstanceMount( + callback: (editorInstance: MonacoEditor.IStandaloneCodeEditor) => void + ) { + this.subscribe(EditorEvent.onEditorInstanceMount, callback); + } } diff --git a/stories/extensions/test/index.tsx b/stories/extensions/test/index.tsx index 6eeca52a4..199e8cd71 100644 --- a/stories/extensions/test/index.tsx +++ b/stories/extensions/test/index.tsx @@ -229,5 +229,9 @@ export const ExtendsTestPane: IExtension = { molecule.layout.setAuxiliaryBar(!tab); }); + + molecule.editor.onEditorInstanceMount((editorInstance) => { + console.log('editorInstance:', editorInstance); + }); }, }; diff --git a/stories/extensions/test/testPane.tsx b/stories/extensions/test/testPane.tsx index cb412c955..4a40ae6ee 100644 --- a/stories/extensions/test/testPane.tsx +++ b/stories/extensions/test/testPane.tsx @@ -238,6 +238,19 @@ export type GenericClassDecorator = (target: T) => void;`, } }; + const updateEditor = function () { + // get first inactive tab + const state = molecule.editor.getState(); + const firstInactiveTab = state.current?.data?.find( + (tab) => tab.id !== state.current?.activeTab + ); + if (firstInactiveTab) { + firstInactiveTab.data.value += + '\nconst firstInactiveTab = "test";\n'; + molecule.editor.updateTab(firstInactiveTab, state.current?.id); + } + }; + const newPane = function () { const key = shortRandomId(); const name = `pane-${key}.ts`; @@ -481,6 +494,9 @@ PARTITIONED BY (DE STRING) LIFECYCLE 1000;

Simple examples:

+ From 45d9d24b677a6a037195552b806d3e2521527ef8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=87=8E=E8=BF=82=E8=BF=82?= Date: Tue, 26 Dec 2023 11:28:22 +0800 Subject: [PATCH 3/4] fix: update types --- src/components/tree/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/tree/index.tsx b/src/components/tree/index.tsx index 4727f9b90..5a4e11c59 100644 --- a/src/components/tree/index.tsx +++ b/src/components/tree/index.tsx @@ -64,7 +64,7 @@ export interface ITreeProps { expandKeys?: UniqueId[]; loadedKeys?: string[]; activeKey?: UniqueId; - onExpand?: (expandedKeys: React.Key[], node: ITreeNodeItemProps) => void; + onExpand?: (expandedKeys: UniqueId[], node: ITreeNodeItemProps) => void; onSelect?: (node: ITreeNodeItemProps, isUpdate?) => void; onTreeClick?: () => void; renderTitle?: ( From 3fe0e90ce2496d144d18a9eab23360fa71fa6158 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=87=8E=E8=BF=82=E8=BF=82?= Date: Tue, 26 Dec 2023 11:45:04 +0800 Subject: [PATCH 4/4] fix: fix stylelint --- src/components/scrollBar/style.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/scrollBar/style.scss b/src/components/scrollBar/style.scss index 63a920c30..d6c917bc1 100644 --- a/src/components/scrollBar/style.scss +++ b/src/components/scrollBar/style.scss @@ -75,4 +75,4 @@ display: none; } } -} \ No newline at end of file +}