Merge branch 'master' of https://github.com/mathuo/dockview

Author: mathuo

packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts

@@ -5052,8 +5052,13 @@ describe('dockviewComponent', () => {
                 component: 'default',
             });
 
-            await dockview.addPopoutGroup(panel2);
+            const panel3 = dockview.addPanel({
+                id: 'panel_3',
+                component: 'default',
+                renderer: 'always',
+            });
 
+            await dockview.addPopoutGroup(panel2);
             panel2.api.moveTo({ group: panel1.api.group, position: 'right' });
 
             // confirm panel is rendered on DOM
@@ -5062,6 +5067,22 @@ describe('dockviewComponent', () => {
                     '.dv-content-container > .testpanel-panel_2'
                 ).length
             ).toBe(1);
+
+            await dockview.addPopoutGroup(panel3);
+            panel3.api.moveTo({ group: panel1.api.group, position: 'right' });
+
+            // confirm panel is rendered to always overlay container
+            expect(
+                dockview.element.querySelectorAll(
+                    '.dv-render-overlay > .testpanel-panel_3'
+                ).length
+            ).toBe(1);
+            expect(
+                panel2.group.element.querySelectorAll(
+                    '.dv-content-container > .testpanel-panel_3'
+                ).length
+            ).toBe(0);
+            expect(dockview.element);
         });
 
         test('move popout group of 1 panel inside grid', async () => {

packages/dockview-core/src/dockview/dockviewComponent.ts

@@ -577,11 +577,6 @@ export class DockviewComponent
         this.updateWatermark();
     }
 
-    override dispose(): void {
-        this.clear(); // explicitly clear the layout before cleaning up
-        super.dispose();
-    }
-
     override setVisible(panel: DockviewGroupPanel, visible: boolean): void {
         switch (panel.api.location.type) {
             case 'grid':
@@ -847,32 +842,31 @@ export class DockviewComponent
                                 });
                             }
                         } else if (this.getPanel(group.id)) {
-                            const removedGroup = group;
+                            group.model.renderContainer =
+                                this.overlayRenderContainer;
+                            returnedGroup = group;
 
                             if (floatingBox) {
-                                this.addFloatingGroup(removedGroup, {
+                                this.addFloatingGroup(group, {
                                     height: floatingBox.height,
                                     width: floatingBox.width,
                                     position: floatingBox,
                                 });
                             } else {
-                                this.doRemoveGroup(removedGroup, {
+                                this.doRemoveGroup(group, {
                                     skipDispose: true,
                                     skipActive: true,
                                     skipPopoutReturn: true,
                                 });
 
-                                removedGroup.model.renderContainer =
-                                    this.overlayRenderContainer;
-                                removedGroup.model.location = { type: 'grid' };
-                                returnedGroup = removedGroup;
+                                group.model.location = { type: 'grid' };
 
                                 this.movingLock(() => {
                                     // suppress group add events since the group already exists
-                                    this.doAddGroup(removedGroup, [0]);
+                                    this.doAddGroup(group, [0]);
                                 });
                             }
-                            this.doSetGroupAndPanelActive(removedGroup);
+                            this.doSetGroupAndPanelActive(group);
                         }
                     })
                 );