Merge pull request #313 from mathuo/311-dnd-v180-bug

feat: external-dnd center drop when dockview is empty
This commit is contained in:
mathuo 2023-07-24 20:59:45 +01:00 committed by GitHub
commit 76d1f9ab70
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 25 additions and 3 deletions

View File

@ -3824,7 +3824,7 @@ describe('dockviewComponent', () => {
expect(el.style.width).toBe('256px'); expect(el.style.width).toBe('256px');
}); });
test('that external dnd events do not trigger the top-level center dnd target', () => { test('that external dnd events do not trigger the top-level center dnd target unless empty', () => {
const container = document.createElement('div'); const container = document.createElement('div');
const showDndOverlay = jest.fn().mockReturnValue(true); const showDndOverlay = jest.fn().mockReturnValue(true);
@ -3847,7 +3847,7 @@ describe('dockviewComponent', () => {
id: 'panel_1', id: 'panel_1',
component: 'default', component: 'default',
}); });
dockview.addPanel({ const panel2 = dockview.addPanel({
id: 'panel_2', id: 'panel_2',
component: 'default', component: 'default',
position: { direction: 'right' }, position: { direction: 'right' },
@ -3956,5 +3956,27 @@ describe('dockviewComponent', () => {
// expect not to be called for center // expect not to be called for center
expect(showDndOverlay).toBeCalledTimes(4); expect(showDndOverlay).toBeCalledTimes(4);
dockview.removePanel(panel1);
dockview.removePanel(panel2);
// center, but empty
const eventCenter2 = new KeyboardEvent('dragover');
Object.defineProperty(eventCenter2, 'clientX', {
get: () => 50,
});
Object.defineProperty(eventCenter2, 'clientY', {
get: () => 50,
});
fireEvent(dockview.element, eventCenter2);
expect(showDndOverlay).toHaveBeenCalledWith({
nativeEvent: eventTop,
position: 'center',
target: DockviewDropTargets.Edge,
getData: getPanelData,
});
expect(showDndOverlay).toBeCalledTimes(5);
}); });
}); });

View File

@ -260,7 +260,7 @@ export class DockviewComponent
} }
if (this.options.showDndOverlay) { if (this.options.showDndOverlay) {
if (position === 'center') { if (position === 'center' && this.gridview.length !== 0) {
/** /**
* for external events only show the four-corner drag overlays, disable * for external events only show the four-corner drag overlays, disable
* the center position so that external drag events can fall through to the group * the center position so that external drag events can fall through to the group