Merge branch 'master' of https://github.com/mathuo/dockview into 597-ondidlayoutchange-callback-catches-panels-init

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);
+    });
 });

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;