From 52e458772e0759d143dec9473f2c8d59df3b6cd7 Mon Sep 17 00:00:00 2001 From: mathuo <6710312+mathuo@users.noreply.github.com> Date: Mon, 6 Mar 2023 23:12:51 +0800 Subject: [PATCH] tests: fix tests --- .../__mocks__/mockDockviewPanelMode.ts | 39 +++++ .../dockview/dockviewComponent.spec.ts | 141 ++++++----------- .../__tests__/dockview/dockviewPanel.spec.ts | 63 +++++--- .../dockview/dockviewPanelModel.spec.ts | 142 +++++++++++------- .../src/__tests__/groupview/groupview.spec.ts | 80 +++++----- .../__tests__/groupview/panel/content.spec.ts | 6 +- packages/dockview-core/src/groupview/types.ts | 2 +- .../react/dockview/reactHeaderPart.spec.ts | 24 --- 8 files changed, 269 insertions(+), 228 deletions(-) create mode 100644 packages/dockview-core/src/__tests__/__mocks__/mockDockviewPanelMode.ts delete mode 100644 packages/dockview/src/__tests__/react/dockview/reactHeaderPart.spec.ts diff --git a/packages/dockview-core/src/__tests__/__mocks__/mockDockviewPanelMode.ts b/packages/dockview-core/src/__tests__/__mocks__/mockDockviewPanelMode.ts new file mode 100644 index 000000000..9b85e2feb --- /dev/null +++ b/packages/dockview-core/src/__tests__/__mocks__/mockDockviewPanelMode.ts @@ -0,0 +1,39 @@ +import { IDockviewPanelModel } from '../../dockview/dockviewPanelModel'; +import { GroupPanel } from '../../groupview/groupviewPanel'; +import { + GroupPanelPartInitParameters, + GroupPanelUpdateEvent, + IContentRenderer, + ITabRenderer, +} from '../../groupview/types'; + +export class DockviewPanelModelMock implements IDockviewPanelModel { + constructor( + readonly contentComponent: string, + readonly content: IContentRenderer, + readonly tabComponent?: string, + readonly tab?: ITabRenderer + ) { + // + } + + init(params: GroupPanelPartInitParameters): void { + // + } + + update(event: GroupPanelUpdateEvent): void { + // + } + + layout(width: number, height: number): void { + // + } + + updateParentGroup(group: GroupPanel, isPanelVisible: boolean): void { + // + } + + dispose(): void { + // + } +} diff --git a/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts b/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts index 7e04afc83..346abb44f 100644 --- a/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts +++ b/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts @@ -13,8 +13,6 @@ import { GroupviewPanelState, IGroupPanelInitParameters, } from '../../groupview/types'; -import { IGroupPanelView } from '../../dockview/defaultGroupPanelView'; -import { DefaultTab } from '../../dockview/components/tab/defaultTab'; import { Emitter } from '../../events'; import { IDockviewPanel } from '../../dockview/dockviewPanel'; import { @@ -22,6 +20,9 @@ import { DockviewPanelApiImpl, } from '../../api/dockviewPanelApi'; import { DefaultDockviewDeserialzier } from '../../dockview/deserializer'; +import { IDockviewPanelModel } from '../../dockview/dockviewPanelModel'; +import { DockviewPanelModelMock } from '../__mocks__/mockDockviewPanelMode'; +import { DefaultTab } from '../../dockview/components/tab/defaultTab'; class PanelContentPartTest implements IContentRenderer { element: HTMLElement = document.createElement('div'); @@ -93,10 +94,6 @@ class PanelTabPartTest implements ITabRenderer { //noop } - toJSON(): object { - return { id: this.id }; - } - focus(): void { //noop } @@ -107,43 +104,11 @@ class PanelTabPartTest implements ITabRenderer { } } -class TestGroupPanelView implements IGroupPanelView { - readonly tab: ITabRenderer = new DefaultTab(); - - constructor(public readonly content: IContentRenderer) { - // - } - - update(event: GroupPanelUpdateEvent): void { - // - } - - layout(width: number, height: number): void { - // - } - - init(params: GroupPanelPartInitParameters): void { - // - } - - updateParentGroup(group: GroupPanel, isPanelVisible: boolean): void { - // - } - - toJSON(): {} { - return {}; - } - - dispose(): void { - // - } -} - class TestGroupPanel implements IDockviewPanel { private _group: GroupPanel | undefined; - readonly view: IGroupPanelView; readonly api: DockviewPanelApi; + readonly view: IDockviewPanelModel; constructor( public readonly id: string, @@ -152,8 +117,11 @@ class TestGroupPanel implements IDockviewPanel { ) { this.api = new DockviewPanelApiImpl(this, this._group!); this._group = new GroupPanel(accessor, id, {}); - this.view = new TestGroupPanelView( - new PanelContentPartTest(id, 'component') + this.view = new DockviewPanelModelMock( + 'component', + new PanelContentPartTest(id, 'component'), + 'tabComponent', + new DefaultTab() ); } @@ -562,27 +530,27 @@ describe('dockviewComponent', () => { panels: { panel1: { id: 'panel1', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel1', }, panel2: { id: 'panel2', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel2', }, panel3: { id: 'panel3', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel3', }, panel4: { id: 'panel4', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel4', }, panel5: { id: 'panel5', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel5', }, }, @@ -647,27 +615,27 @@ describe('dockviewComponent', () => { panels: { panel1: { id: 'panel1', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel1', }, panel2: { id: 'panel2', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel2', }, panel3: { id: 'panel3', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel3', }, panel4: { id: 'panel4', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel4', }, panel5: { id: 'panel5', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel5', }, }, @@ -1098,17 +1066,14 @@ describe('dockviewComponent', () => { view_1: { id: 'view_1', title: 'view_1_title', - view: {}, }, view_2: { id: 'view_2', title: 'view_2_title', - view: {}, }, view_3: { id: 'view_3', title: 'view_3_title', - view: {}, }, }, options: {}, @@ -1602,27 +1567,27 @@ describe('dockviewComponent', () => { panels: { panel1: { id: 'panel1', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel1', }, panel2: { id: 'panel2', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel2', }, panel3: { id: 'panel3', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel3', }, panel4: { id: 'panel4', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel4', }, panel5: { id: 'panel5', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel5', }, }, @@ -1736,30 +1701,28 @@ describe('dockviewComponent', () => { panels: { panel1: { id: 'panel1', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel1', }, panel2: { id: 'panel2', - view: { - content: { id: 'default' }, - tab: { id: '__non__existant_tab__' }, - }, + contentComponent: 'default', + tabComponent: '__non__existant_tab__', title: 'panel2', }, panel3: { id: 'panel3', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel3', }, panel4: { id: 'panel4', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel4', }, panel5: { id: 'panel5', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel5', }, }, @@ -1863,15 +1826,13 @@ describe('dockviewComponent', () => { panels: { panel1: { id: 'panel1', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel1', }, panel2: { id: 'panel2', - view: { - content: { id: 'default' }, - tab: { id: 'test_tab_id' }, - }, + contentComponent: 'default', + tabComponent: 'test_tab_id', title: 'panel2', }, }, @@ -1926,20 +1887,18 @@ describe('dockviewComponent', () => { panels: { panel1: { id: 'panel1', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel1', }, panel2: { id: 'panel2', - view: { - content: { id: 'default' }, - tab: { id: 'test_tab_id' }, - }, + contentComponent: 'default', + tabComponent: 'test_tab_id', title: 'panel2', }, panel3: { id: 'panel3', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel3', }, }, @@ -1959,7 +1918,7 @@ describe('dockviewComponent', () => { expect(viewQuery2.length).toBe(1); const viewQuery3 = group.element.querySelectorAll( - '.groupview > .tabs-and-actions-container > .tabs-container > .tab > .panel-tab-part-test_tab_id' + '.groupview > .tabs-and-actions-container > .tabs-container > .tab > .panel-tab-part-panel2' ); expect(viewQuery3.length).toBe(1); }); @@ -2009,7 +1968,7 @@ describe('dockviewComponent', () => { panels: { panel1: { id: 'panel1', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel1', }, }, @@ -2061,12 +2020,12 @@ describe('dockviewComponent', () => { panels: { panel1: { id: 'panel1', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel1', }, panel2: { id: 'panel2', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel2', }, }, @@ -2124,12 +2083,12 @@ describe('dockviewComponent', () => { panels: { panel1: { id: 'panel1', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel1', }, panel2: { id: 'panel2', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel2', }, }, @@ -2196,18 +2155,18 @@ describe('dockviewComponent', () => { panels: { panel1: { id: 'panel1', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel1', }, panel2: { id: 'panel2', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel2', }, panel3: { id: 'panel3', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel3', }, }, @@ -2256,7 +2215,7 @@ describe('dockviewComponent', () => { panels: { panel1: { id: 'panel1', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel1', }, }, @@ -2325,17 +2284,17 @@ describe('dockviewComponent', () => { panels: { panel1: { id: 'panel1', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel1', }, panel2: { id: 'panel2', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel2', }, panel3: { id: 'panel3', - view: { content: { id: 'default' } }, + contentComponent: 'default', title: 'panel3', }, }, diff --git a/packages/dockview-core/src/__tests__/dockview/dockviewPanel.spec.ts b/packages/dockview-core/src/__tests__/dockview/dockviewPanel.spec.ts index 23846480b..3d13adb4b 100644 --- a/packages/dockview-core/src/__tests__/dockview/dockviewPanel.spec.ts +++ b/packages/dockview-core/src/__tests__/dockview/dockviewPanel.spec.ts @@ -1,8 +1,8 @@ import { DockviewComponent } from '../../dockview/dockviewComponent'; import { DockviewApi } from '../../api/component.api'; -import { IGroupPanelView } from '../../dockview/defaultGroupPanelView'; import { DockviewPanel } from '../../dockview/dockviewPanel'; import { GroupPanel } from '../../groupview/groupviewPanel'; +import { IDockviewPanelModel } from '../../dockview/dockviewPanelModel'; describe('dockviewPanel', () => { test('update title', () => { @@ -17,10 +17,19 @@ describe('dockviewPanel', () => { const groupMock = jest.fn(() => { return {} as any; }); + const panelModelMock = jest.fn, []>(() => { + return { + update: jest.fn(), + init: jest.fn(), + }; + }); + const api = new dockviewApiMock(); const accessor = new accessorMock(); const group = new groupMock(); - const cut = new DockviewPanel('fake-id', accessor, api, group); + const model = new panelModelMock(); + + const cut = new DockviewPanel('fake-id', accessor, api, group, model); let latestTitle: string | undefined = undefined; @@ -30,7 +39,7 @@ describe('dockviewPanel', () => { expect(cut.title).toBe(''); - cut.init({ title: 'new title', params: {}, view: null }); + cut.init({ title: 'new title', params: {} }); expect(latestTitle).toBe('new title'); expect(cut.title).toBe('new title'); @@ -51,26 +60,26 @@ describe('dockviewPanel', () => { const groupMock = jest.fn(() => { return {} as any; }); + const panelModelMock = jest.fn, []>(() => { + return { + update: jest.fn(), + init: jest.fn(), + dispose: jest.fn(), + }; + }); + const api = new dockviewApiMock(); const accessor = new accessorMock(); const group = new groupMock(); + const model = new panelModelMock(); - const cut = new DockviewPanel('fake-id', accessor, api, group); + const cut = new DockviewPanel('fake-id', accessor, api, group, model); - const viewMock = jest.fn(() => { - return { - init: jest.fn(), - dispose: jest.fn(), - update: jest.fn(), - } as any; - }); - const view = new viewMock(); - - cut.init({ params: {}, view, title: 'title' }); + cut.init({ params: {}, title: 'title' }); cut.dispose(); - expect(view.dispose).toHaveBeenCalled(); + expect(model.dispose).toHaveBeenCalled(); }); test('get params', () => { @@ -83,10 +92,20 @@ describe('dockviewPanel', () => { const groupMock = jest.fn(() => { return {} as any; }); + const panelModelMock = jest.fn, []>(() => { + return { + update: jest.fn(), + init: jest.fn(), + dispose: jest.fn(), + }; + }); + const api = new dockviewApiMock(); const accessor = new accessorMock(); const group = new groupMock(); - const cut = new DockviewPanel('fake-id', accessor, api, group); + const model = new panelModelMock(); + + const cut = new DockviewPanel('fake-id', accessor, api, group, model); expect(cut.params).toEqual(undefined); @@ -109,10 +128,20 @@ describe('dockviewPanel', () => { }, } as any; }); + const panelModelMock = jest.fn, []>(() => { + return { + update: jest.fn(), + init: jest.fn(), + dispose: jest.fn(), + }; + }); + const api = new dockviewApiMock(); const accessor = new accessorMock(); const group = new groupMock(); - const cut = new DockviewPanel('fake-id', accessor, api, group); + const model = new panelModelMock(); + + const cut = new DockviewPanel('fake-id', accessor, api, group, model); cut.api.setSize({ height: 123, width: 456 }); diff --git a/packages/dockview-core/src/__tests__/dockview/dockviewPanelModel.spec.ts b/packages/dockview-core/src/__tests__/dockview/dockviewPanelModel.spec.ts index f0ca53db1..28c1e17d8 100644 --- a/packages/dockview-core/src/__tests__/dockview/dockviewPanelModel.spec.ts +++ b/packages/dockview-core/src/__tests__/dockview/dockviewPanelModel.spec.ts @@ -1,5 +1,8 @@ -import { DockviewGroupPanel } from '../../dockview/dockviewGroupPanel'; -import { GroupPanel } from '../../groupview/groupviewPanel'; +import { + DockviewComponent, + IDockviewComponent, +} from '../../dockview/dockviewComponent'; +import { DockviewPanelModel } from '../../dockview/dockviewPanelModel'; import { IContentRenderer, ITabRenderer } from '../../groupview/types'; describe('dockviewGroupPanel', () => { @@ -20,19 +23,30 @@ describe('dockviewGroupPanel', () => { return partial as IContentRenderer; }); - const content = new contentMock(); - const tab = new tabMock(); - - const cut = new DockviewGroupPanel({ - content, - tab, - contentComponent: 'contentComponent', + const accessorMock = jest.fn, []>(() => { + return { + options: { + components: { + contentComponent: contentMock, + }, + tabComponents: { + tabComponent: tabMock, + }, + }, + }; }); + const cut = new DockviewPanelModel( + new accessorMock(), + 'id', + 'contentComponent', + 'tabComponent' + ); + cut.dispose(); - expect(content.dispose).toHaveBeenCalled(); - expect(tab.dispose).toHaveBeenCalled(); + expect(cut.content.dispose).toHaveBeenCalled(); + expect(cut.tab.dispose).toHaveBeenCalled(); }); test('that update is called on content and tab renderers when present', () => { @@ -52,24 +66,34 @@ describe('dockviewGroupPanel', () => { return partial as IContentRenderer; }); - const content = new contentMock(); - const tab = new tabMock(); - - const cut = new DockviewGroupPanel({ - content, - tab, - contentComponent: 'contentComponent', + const accessorMock = jest.fn, []>(() => { + return { + options: { + components: { + contentComponent: contentMock, + }, + tabComponents: { + tabComponent: tabMock, + }, + }, + }; }); + const cut = new DockviewPanelModel( + new accessorMock(), + 'id', + 'contentComponent', + 'tabComponent' + ); cut.update({ params: {}, }); - expect(content.update).toHaveBeenCalled(); - expect(tab.update).toHaveBeenCalled(); + expect(cut.content.update).toHaveBeenCalled(); + expect(cut.tab.update).toHaveBeenCalled(); }); - test('test1', () => { + test('that events are fired', () => { const contentMock = jest.fn(() => { const partial: Partial = { element: document.createElement('div'), @@ -88,44 +112,60 @@ describe('dockviewGroupPanel', () => { return partial as IContentRenderer; }); - const content = new contentMock(); - const tab = new tabMock(); - - let cut = new DockviewGroupPanel({ - content, - tab, - contentComponent: 'contentComponent', + const accessorMock = jest.fn, []>(() => { + return { + options: { + components: { + contentComponent: contentMock, + }, + tabComponents: { + tabComponent: tabMock, + }, + }, + }; }); + const cut = new DockviewPanelModel( + new accessorMock(), + 'id', + 'contentComponent', + 'tabComponent' + ); const group1 = jest.fn() as any; const group2 = jest.fn() as any; - cut.updateParentGroup(group1 as GroupPanel, false); + cut.updateParentGroup(group1, false); - expect(content.onGroupChange).toHaveBeenNthCalledWith(1, group1); - expect(tab.onGroupChange).toHaveBeenNthCalledWith(1, group1); - expect(content.onPanelVisibleChange).toHaveBeenNthCalledWith(1, false); - expect(tab.onPanelVisibleChange).toHaveBeenNthCalledWith(1, false); - expect(content.onGroupChange).toHaveBeenCalledTimes(1); - expect(tab.onGroupChange).toHaveBeenCalledTimes(1); - expect(content.onPanelVisibleChange).toHaveBeenCalledTimes(1); - expect(tab.onPanelVisibleChange).toHaveBeenCalledTimes(1); + expect(cut.content.onGroupChange).toHaveBeenNthCalledWith(1, group1); + expect(cut.tab.onGroupChange).toHaveBeenNthCalledWith(1, group1); + expect(cut.content.onPanelVisibleChange).toHaveBeenNthCalledWith( + 1, + false + ); + expect(cut.tab.onPanelVisibleChange).toHaveBeenNthCalledWith(1, false); + expect(cut.content.onGroupChange).toHaveBeenCalledTimes(1); + expect(cut.tab.onGroupChange).toHaveBeenCalledTimes(1); + expect(cut.content.onPanelVisibleChange).toHaveBeenCalledTimes(1); + expect(cut.tab.onPanelVisibleChange).toHaveBeenCalledTimes(1); - cut.updateParentGroup(group1 as GroupPanel, true); + cut.updateParentGroup(group1, true); - expect(content.onPanelVisibleChange).toHaveBeenNthCalledWith(2, true); - expect(tab.onPanelVisibleChange).toHaveBeenNthCalledWith(2, true); - expect(content.onGroupChange).toHaveBeenCalledTimes(1); - expect(tab.onGroupChange).toHaveBeenCalledTimes(1); - expect(content.onPanelVisibleChange).toHaveBeenCalledTimes(2); - expect(tab.onPanelVisibleChange).toHaveBeenCalledTimes(2); + expect(cut.content.onPanelVisibleChange).toHaveBeenNthCalledWith( + 2, + true + ); + expect(cut.tab.onPanelVisibleChange).toHaveBeenNthCalledWith(2, true); + expect(cut.content.onGroupChange).toHaveBeenCalledTimes(1); + expect(cut.tab.onGroupChange).toHaveBeenCalledTimes(1); + expect(cut.content.onPanelVisibleChange).toHaveBeenCalledTimes(2); + expect(cut.tab.onPanelVisibleChange).toHaveBeenCalledTimes(2); - cut.updateParentGroup(group2 as GroupPanel, true); + cut.updateParentGroup(group2, true); - expect(content.onGroupChange).toHaveBeenNthCalledWith(2, group2); - expect(tab.onGroupChange).toHaveBeenNthCalledWith(2, group2); - expect(content.onGroupChange).toHaveBeenCalledTimes(2); - expect(tab.onGroupChange).toHaveBeenCalledTimes(2); - expect(content.onPanelVisibleChange).toHaveBeenCalledTimes(2); - expect(tab.onPanelVisibleChange).toHaveBeenCalledTimes(2); + expect(cut.content.onGroupChange).toHaveBeenNthCalledWith(2, group2); + expect(cut.tab.onGroupChange).toHaveBeenNthCalledWith(2, group2); + expect(cut.content.onGroupChange).toHaveBeenCalledTimes(2); + expect(cut.tab.onGroupChange).toHaveBeenCalledTimes(2); + expect(cut.content.onPanelVisibleChange).toHaveBeenCalledTimes(2); + expect(cut.tab.onPanelVisibleChange).toHaveBeenCalledTimes(2); }); }); diff --git a/packages/dockview-core/src/__tests__/groupview/groupview.spec.ts b/packages/dockview-core/src/__tests__/groupview/groupview.spec.ts index 9df238d59..36d4193c9 100644 --- a/packages/dockview-core/src/__tests__/groupview/groupview.spec.ts +++ b/packages/dockview-core/src/__tests__/groupview/groupview.spec.ts @@ -1,5 +1,6 @@ import { DockviewComponent } from '../../dockview/dockviewComponent'; import { + GroupPanelUpdateEvent, GroupviewPanelState, IGroupPanelInitParameters, } from '../../groupview/types'; @@ -11,16 +12,16 @@ import { } from '../../groupview/types'; import { PanelUpdateEvent } from '../../panel/types'; import { GroupOptions, Groupview } from '../../groupview/groupview'; -import { - DefaultGroupPanelView, - IGroupPanelView, -} from '../../dockview/defaultGroupPanelView'; import { GroupPanel } from '../../groupview/groupviewPanel'; import { fireEvent } from '@testing-library/dom'; import { LocalSelectionTransfer, PanelTransfer } from '../../dnd/dataTransfer'; import { CompositeDisposable } from '../../lifecycle'; import { DockviewPanelApi } from '../../api/dockviewPanelApi'; import { IDockviewPanel } from '../../dockview/dockviewPanel'; +import { + IDockviewPanelModel, + DockviewPanelModel, +} from '../../dockview/dockviewPanelModel'; enum GroupChangeKind2 { ADD_PANEL, @@ -28,6 +29,38 @@ enum GroupChangeKind2 { PANEL_ACTIVE, } +class TestModel implements IDockviewPanelModel { + readonly content: IContentRenderer; + readonly contentComponent: string; + readonly tab: ITabRenderer; + + constructor(id: string) { + this.content = new TestHeaderPart(id); + this.contentComponent = id; + this.tab = new TestContentPart(id); + } + + update(event: GroupPanelUpdateEvent): void { + // + } + + layout(width: number, height: number): void { + // + } + + init(params: GroupPanelPartInitParameters): void { + // + } + + updateParentGroup(group: GroupPanel, isPanelVisible: boolean): void { + // + } + + dispose(): void { + // + } +} + class Watermark implements IWatermarkRenderer { public readonly element = document.createElement('div'); @@ -140,9 +173,9 @@ class TestHeaderPart implements ITabRenderer { } export class TestPanel implements IDockviewPanel { - private _view: IGroupPanelView | undefined; private _group: GroupPanel | undefined; private _params: IGroupPanelInitParameters; + readonly view: IDockviewPanelModel; get title() { return ''; @@ -152,28 +185,19 @@ export class TestPanel implements IDockviewPanel { return this._group!; } - get view() { - return this._view; - } - get params(): Record { return {}; } constructor(public readonly id: string, public api: DockviewPanelApi) { + this.view = new TestModel(id); this.init({ - view: new DefaultGroupPanelView({ - tab: new TestHeaderPart(id), - content: new TestContentPart(id), - }), title: `${id}`, params: {}, }); } init(params: IGroupPanelInitParameters) { - this._view = params.view; - this._params = params; } @@ -196,7 +220,6 @@ export class TestPanel implements IDockviewPanel { toJSON(): GroupviewPanelState { return { id: this.id, - view: this._view?.toJSON(), title: this._params?.title, }; } @@ -236,31 +259,6 @@ describe('groupview', () => { groupview.initialize(); }); - test('serialized layout shows active panel', () => { - const panel1 = new TestPanel('panel1', jest.fn() as any); - const panel2 = new TestPanel('panel2', jest.fn() as any); - const panel3 = new TestPanel('panel3', jest.fn() as any); - - const groupview2 = new GroupPanel(dockview, 'groupview-2', { - tabHeight: 25, - panels: [panel1, panel2, panel3], - activePanel: panel2, - }); - groupview2.initialize(); - - expect(groupview2.model.activePanel).toBe(panel2); - - expect( - groupview2.element.querySelector('.content-part-panel1') - ).toBeFalsy(); - expect( - groupview2.element.querySelector('.content-part-panel2') - ).toBeTruthy(); - expect( - groupview2.element.querySelector('.content-part-panel3') - ).toBeFalsy(); - }); - test('panel events are captured during de-serialization', () => { const panel1 = new TestPanel('panel1', jest.fn() as any); const panel2 = new TestPanel('panel2', jest.fn() as any); diff --git a/packages/dockview-core/src/__tests__/groupview/panel/content.spec.ts b/packages/dockview-core/src/__tests__/groupview/panel/content.spec.ts index 136b34352..5ddaafb11 100644 --- a/packages/dockview-core/src/__tests__/groupview/panel/content.spec.ts +++ b/packages/dockview-core/src/__tests__/groupview/panel/content.spec.ts @@ -7,9 +7,9 @@ import { } from '../../../groupview/types'; import { CompositeDisposable } from '../../../lifecycle'; import { PanelUpdateEvent } from '../../../panel/types'; -import { IGroupPanelView } from '../../../dockview/defaultGroupPanelView'; import { GroupPanel } from '../../../groupview/groupviewPanel'; import { IDockviewPanel } from '../../../dockview/dockviewPanel'; +import { IDockviewPanelModel } from '../../../dockview/dockviewPanelModel'; class TestContentRenderer extends CompositeDisposable @@ -77,7 +77,7 @@ describe('contentContainer', () => { const panel = { view: { content: contentRenderer, - } as Partial, + } as Partial, } as Partial; cut.openPanel(panel as IDockviewPanel); @@ -111,7 +111,7 @@ describe('contentContainer', () => { const panel2 = { view: { content: contentRenderer2, - } as Partial, + } as Partial, } as Partial; cut.openPanel(panel2 as IDockviewPanel); diff --git a/packages/dockview-core/src/groupview/types.ts b/packages/dockview-core/src/groupview/types.ts index cacebb5b6..dcda379ba 100644 --- a/packages/dockview-core/src/groupview/types.ts +++ b/packages/dockview-core/src/groupview/types.ts @@ -94,5 +94,5 @@ export interface GroupviewPanelState { tabComponent?: string; title?: string; params?: { [key: string]: any }; - view: SerializedGroupPanelView; // depreciated + view?: SerializedGroupPanelView; // depreciated } diff --git a/packages/dockview/src/__tests__/react/dockview/reactHeaderPart.spec.ts b/packages/dockview/src/__tests__/react/dockview/reactHeaderPart.spec.ts deleted file mode 100644 index 9ba01ba0f..000000000 --- a/packages/dockview/src/__tests__/react/dockview/reactHeaderPart.spec.ts +++ /dev/null @@ -1,24 +0,0 @@ -import { DEFAULT_TAB_IDENTIFIER } from 'dockview-core'; -import { ReactPanelHeaderPart } from '../../../dockview/reactHeaderPart'; - -describe('reactHeaderPart', () => { - test('that tab id is present in toJSON when not the default tab', () => { - const cut = new ReactPanelHeaderPart( - 'test-id', - jest.fn(), - jest.fn() - ); - - expect(cut.toJSON()).toEqual({ id: 'test-id' }); - }); - - test('that tab id is not present in the toJSON when is default tab', () => { - const cut = new ReactPanelHeaderPart( - DEFAULT_TAB_IDENTIFIER, - jest.fn(), - jest.fn() - ); - - expect(cut.toJSON()).toEqual({}); - }); -});