diff --git a/packages/dockview/src/__tests__/api/component.api.spec.ts b/packages/dockview/src/__tests__/api/component.api.spec.ts index 898260d76..f4eccca30 100644 --- a/packages/dockview/src/__tests__/api/component.api.spec.ts +++ b/packages/dockview/src/__tests__/api/component.api.spec.ts @@ -22,6 +22,10 @@ describe('component.api', () => { 'onDidLayoutChange', 'onDidAddView', 'onDidRemoveView', + 'getPanels', + 'focus', + 'resizeToFit', + 'toJSON', ]; for (const _ of list) { @@ -33,7 +37,7 @@ describe('component.api', () => { const cut = new SplitviewApi(component); - expect((cut as any)[_]).toBeFalsy(); + (cut as any)[_]; expect(f).toBeCalledTimes(1); } @@ -50,6 +54,10 @@ describe('component.api', () => { 'onDidLayoutChange', 'onDidAddView', 'onDidRemoveView', + 'getPanels', + 'focus', + 'resizeToFit', + 'toJSON', ]; for (const _ of list) { @@ -61,7 +69,7 @@ describe('component.api', () => { const cut = new PaneviewApi(component); - expect((cut as any)[_]).toBeFalsy(); + (cut as any)[_]; expect(f).toBeCalledTimes(1); } @@ -80,6 +88,9 @@ describe('component.api', () => { 'onGridEvent', 'onDidLayoutChange', 'orientation', + 'focus', + 'resizeToFit', + 'toJSON', ]; for (const _ of list) { @@ -91,7 +102,7 @@ describe('component.api', () => { const cut = new GridviewApi(component); - expect((cut as any)[_]).toBeFalsy(); + (cut as any)[_]; expect(f).toBeCalledTimes(1); } @@ -115,6 +126,10 @@ describe('component.api', () => { 'groups', 'activeGroup', 'activePanel', + 'focus', + 'closeAllGroups', + 'resizeToFit', + 'toJSON', ]; for (const _ of list) { @@ -126,7 +141,7 @@ describe('component.api', () => { const cut = new DockviewApi(component); - expect((cut as any)[_]).toBeFalsy(); + (cut as any)[_]; expect(f).toBeCalledTimes(1); } diff --git a/packages/dockview/src/__tests__/groupview/groupview.spec.ts b/packages/dockview/src/__tests__/groupview/groupview.spec.ts index 7a1a7872c..d6fc1c10b 100644 --- a/packages/dockview/src/__tests__/groupview/groupview.spec.ts +++ b/packages/dockview/src/__tests__/groupview/groupview.spec.ts @@ -1,4 +1,7 @@ -import { IDockviewComponent } from '../../dockview/dockviewComponent'; +import { + IDockviewComponent, + DockviewComponent, +} from '../../dockview/dockviewComponent'; import { GroupviewPanelState, IGroupPanel, @@ -198,13 +201,21 @@ describe('groupview', () => { let dockview: IDockviewComponent; let options: GroupOptions; + let removePanelMock: jest.Mock; + let removeGroupMock: jest.Mock; + beforeEach(() => { - dockview = ({ + removePanelMock = jest.fn(); + removeGroupMock = jest.fn(); + + dockview = (>{ options: {}, createWatermarkComponent: () => new Watermark(), doSetGroupActive: jest.fn(), id: 'dockview-1', - }); + removePanel: removePanelMock, + removeGroup: removeGroupMock, + }) as DockviewComponent; options = { tabHeight: 30, @@ -412,4 +423,25 @@ describe('groupview', () => { ); expect(viewQuery).toBeTruthy(); }); + + test('closeAllPanels with panels', () => { + 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); + + groupview.model.openPanel(panel1); + groupview.model.openPanel(panel2); + groupview.model.openPanel(panel3); + + groupview.model.closeAllPanels(); + + expect(removePanelMock).toBeCalledWith(panel1); + expect(removePanelMock).toBeCalledWith(panel2); + expect(removePanelMock).toBeCalledWith(panel3); + }); + + test('closeAllPanels with no panels', () => { + groupview.model.closeAllPanels(); + expect(removeGroupMock).toBeCalledWith(groupview); + }); }); diff --git a/packages/dockview/src/dockview/dockviewComponent.ts b/packages/dockview/src/dockview/dockviewComponent.ts index eef18f9ce..bbeb2a163 100644 --- a/packages/dockview/src/dockview/dockviewComponent.ts +++ b/packages/dockview/src/dockview/dockviewComponent.ts @@ -221,11 +221,6 @@ export class DockviewComponent typeof options.orientation === 'string' && this.options.orientation !== options.orientation; - // TODO support style update - // const hasStylesChanged = - // typeof options.styles === 'object' && - // this.options.styles !== options.styles; - this._options = { ...this.options, ...options }; if (hasOrientationChanged) { @@ -409,16 +404,14 @@ export class DockviewComponent } fireMouseEvent(event: LayoutMouseEvent): void { - switch (event.kind) { - case MouseEventKind.CONTEXT_MENU: - if (event.tab && event.panel) { - this._onTabContextMenu.fire({ - event: event.event, - api: this._api, - panel: event.panel, - }); - } - break; + if (event.kind === MouseEventKind.CONTEXT_MENU) { + if (event.tab && event.panel) { + this._onTabContextMenu.fire({ + event: event.event, + api: this._api, + panel: event.panel, + }); + } } } diff --git a/packages/dockview/src/events.ts b/packages/dockview/src/events.ts index bd1163db3..3308e578d 100644 --- a/packages/dockview/src/events.ts +++ b/packages/dockview/src/events.ts @@ -42,8 +42,6 @@ export class Emitter implements IDisposable { listener(this._last); } - const firstListener = this._listeners.length === 0; - this._listeners.push(listener); return { diff --git a/packages/dockview/src/gridview/gridview.ts b/packages/dockview/src/gridview/gridview.ts index c7f82391e..e181f6226 100644 --- a/packages/dockview/src/gridview/gridview.ts +++ b/packages/dockview/src/gridview/gridview.ts @@ -618,9 +618,10 @@ export class Gridview implements IDisposable { return node.view; } + const sibling = parent.children[0]; + if (pathToParent.length === 0) { // parent is root - const sibling = parent.children[0]; if (sibling instanceof LeafNode) { return node.view; @@ -635,7 +636,6 @@ export class Gridview implements IDisposable { const [grandParent, ..._] = [...pathToParent].reverse(); const [parentIndex, ...__] = [...rest].reverse(); - const sibling = parent.children[0]; const isSiblingVisible = parent.isChildVisible(0); parent.removeChild(0, sizing); diff --git a/packages/dockview/src/groupview/panel/hostedPanel.ts b/packages/dockview/src/groupview/panel/hostedPanel.ts deleted file mode 100644 index 59de605b1..000000000 --- a/packages/dockview/src/groupview/panel/hostedPanel.ts +++ /dev/null @@ -1,71 +0,0 @@ -import { IDisposable } from '../../lifecycle'; -import { IGroupPanel } from '../groupPanel'; -import { IRenderable } from '../types'; - -export interface HostedPanelOptions { - id: string; - parent?: HTMLElement; -} - -export class HostedPanel implements IRenderable, IDisposable { - private readonly _element: HTMLElement; - - get element() { - return this._element; - } - - get id() { - return this.panel.id; - } - - constructor( - private readonly panel: IGroupPanel, - private readonly options: HostedPanelOptions - ) { - if (!options.parent) { - options.parent = document.getElementById('app') as HTMLElement; - options.parent.style.position = 'relative'; - } - - this._element = document.createElement('div'); - this._element.style.visibility = 'hidden'; - this._element.style.overflow = 'hidden'; - // this._element.style.pointerEvents = 'none'; - this._element.id = `webivew-${options.id}`; - - options.parent.appendChild(this._element); - } - - hide() { - this._element.style.visibility = 'hidden'; - } - - show() { - this._element.style.visibility = 'visible'; - } - - layout( - element: HTMLElement, - dimension?: { width: number; height: number } - ) { - if (!this.element || !this.element.parentElement) { - return; - } - const frameRect = element.getBoundingClientRect(); - const containerRect = - this.element.parentElement.getBoundingClientRect(); - this.element.style.position = 'absolute'; - this.element.style.top = `${frameRect.top - containerRect.top}px`; - this.element.style.left = `${frameRect.left - containerRect.left}px`; - this.element.style.width = `${ - dimension ? dimension.width : frameRect.width - }px`; - this.element.style.height = `${ - dimension ? dimension.height : frameRect.height - }px`; - } - - dispose() { - this._element.remove(); - } -} diff --git a/packages/dockview/src/groupview/titlebar/tabsContainer.ts b/packages/dockview/src/groupview/titlebar/tabsContainer.ts index 0337d2ac9..ad76cb276 100644 --- a/packages/dockview/src/groupview/titlebar/tabsContainer.ts +++ b/packages/dockview/src/groupview/titlebar/tabsContainer.ts @@ -261,12 +261,10 @@ export class TabsContainer return; } - switch (event.kind) { - case MouseEventKind.CLICK: - this.group.model.openPanel(panel, { - skipFocus: alreadyFocused, - }); - break; + if (event.kind === MouseEventKind.CLICK) { + this.group.model.openPanel(panel, { + skipFocus: alreadyFocused, + }); } }), tabToAdd.onDrop((event) => { diff --git a/packages/dockview/src/react/react.ts b/packages/dockview/src/react/react.ts index 4024031af..886499260 100644 --- a/packages/dockview/src/react/react.ts +++ b/packages/dockview/src/react/react.ts @@ -92,7 +92,6 @@ export class ReactPart

throw new Error('invalid operation: resource is already disposed'); } - // TODO use a better check for isReactFunctionalComponent if (typeof this.component !== 'function') { /** * we know this isn't a React.FunctionComponent so throw an error here. @@ -100,7 +99,7 @@ export class ReactPart

* for the same reason, at least at this point we will emit a sensible stacktrace. */ throw new Error( - 'invalid operation: only functional components are supported' + 'Invalid Operation. dockview only supports React Functional Components.' ); }