diff --git a/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts b/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts index b429a32be..4827137de 100644 --- a/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts +++ b/packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts @@ -5385,4 +5385,48 @@ describe('dockviewComponent', () => { expect(a).toBe(1); expect(b).toBe(0); }); + + test('addGroup with absolute position', () => { + const container = document.createElement('div'); + + const dockview = new DockviewComponent({ + parentElement: container, + createComponent(options) { + switch (options.name) { + case 'default': + return new PanelContentPartTest( + options.id, + options.name + ); + default: + throw new Error(`unsupported`); + } + }, + }); + const api = new DockviewApi(dockview); + + dockview.layout(1000, 1000); + + api.addPanel({ + id: 'panel_1', + component: 'default', + }); + api.addPanel({ + id: 'panel_2', + component: 'default', + }); + const panel3 = api.addPanel({ + id: 'panel_3', + component: 'default', + position: { direction: 'right' }, + }); + + expect(api.panels.length).toBe(3); + expect(api.groups.length).toBe(2); + + api.addGroup({ direction: 'left' }); + + expect(api.panels.length).toBe(3); + expect(api.groups.length).toBe(3); + }); }); diff --git a/packages/dockview-core/src/dockview/dockviewComponent.ts b/packages/dockview-core/src/dockview/dockviewComponent.ts index 5cf56d801..34670cd7a 100644 --- a/packages/dockview-core/src/dockview/dockviewComponent.ts +++ b/packages/dockview-core/src/dockview/dockviewComponent.ts @@ -1620,8 +1620,6 @@ export class DockviewComponent } addGroup(options?: AddGroupOptions): DockviewGroupPanel { - const group = this.createGroup(options); - if (options) { let referenceGroup: DockviewGroupPanel | undefined; @@ -1675,12 +1673,16 @@ export class DockviewComponent location, target ); + + const group = this.createGroup(options); this.doAddGroup(group, relativeLocation); if (!options.skipSetActive) { this.doSetGroupAndPanelActive(group); } return group; } else { + const group = this.createGroup(options); + this.doAddGroup(group); this.doSetGroupAndPanelActive(group); return group;