bug: grab cursor on empty spaces

This commit is contained in:
mathuo 2025-07-29 21:52:26 +01:00
parent ea62570b9a
commit 26fd23c8c7
No known key found for this signature in database
GPG Key ID: C6EEDEFD6CA07281
3 changed files with 49 additions and 1 deletions

View File

@ -70,5 +70,46 @@ describe('voidContainer', () => {
cut.updateDragAndDropState();
expect(cut.element.draggable).toBe(true);
});
test('that void container has dv-draggable class when draggable', () => {
const accessor = fromPartial<DockviewComponent>({
options: { disableDnd: false }
});
const group = fromPartial<DockviewGroupPanel>({});
const cut = new VoidContainer(accessor, group);
expect(cut.element.classList.contains('dv-draggable')).toBe(true);
});
test('that void container does not have dv-draggable class when not draggable', () => {
const accessor = fromPartial<DockviewComponent>({
options: { disableDnd: true }
});
const group = fromPartial<DockviewGroupPanel>({});
const cut = new VoidContainer(accessor, group);
expect(cut.element.classList.contains('dv-draggable')).toBe(false);
});
test('that updateDragAndDropState updates dv-draggable class based on disableDnd option', () => {
const options = { disableDnd: false };
const accessor = fromPartial<DockviewComponent>({
options
});
const group = fromPartial<DockviewGroupPanel>({});
const cut = new VoidContainer(accessor, group);
expect(cut.element.classList.contains('dv-draggable')).toBe(true);
// Simulate option change
options.disableDnd = true;
cut.updateDragAndDropState();
expect(cut.element.classList.contains('dv-draggable')).toBe(false);
// Change back
options.disableDnd = false;
cut.updateDragAndDropState();
expect(cut.element.classList.contains('dv-draggable')).toBe(true);
});
});
});

View File

@ -28,7 +28,10 @@
.dv-void-container {
display: flex;
flex-grow: 1;
cursor: grab;
&.dv-draggable {
cursor: grab;
}
}
.dv-right-actions-container {

View File

@ -10,6 +10,7 @@ import { addDisposableListener, Emitter, Event } from '../../../events';
import { CompositeDisposable } from '../../../lifecycle';
import { DockviewGroupPanel } from '../../dockviewGroupPanel';
import { DockviewGroupPanelModel } from '../../dockviewGroupPanelModel';
import { toggleClass } from '../../../dom';
export class VoidContainer extends CompositeDisposable {
private readonly _element: HTMLElement;
@ -37,6 +38,8 @@ export class VoidContainer extends CompositeDisposable {
this._element.className = 'dv-void-container';
this._element.draggable = !this.accessor.options.disableDnd;
toggleClass(this._element, 'dv-draggable', !this.accessor.options.disableDnd);
this.addDisposables(
this._onDrop,
@ -82,5 +85,6 @@ export class VoidContainer extends CompositeDisposable {
updateDragAndDropState(): void {
this._element.draggable = !this.accessor.options.disableDnd;
toggleClass(this._element, 'dv-draggable', !this.accessor.options.disableDnd);
}
}