From 007b2a8feaac0151072e2196d1250ff562d90335 Mon Sep 17 00:00:00 2001 From: mathuo <6710312+mathuo@users.noreply.github.com> Date: Mon, 28 Aug 2023 20:02:48 +0100 Subject: [PATCH] tests: test locked behaviours --- .../src/__tests__/__test_utils__/utils.ts | 13 +++ .../src/__tests__/dnd/droptarget.spec.ts | 14 +-- .../dockview/dockviewGroupPanelModel.spec.ts | 94 ++++++++++++++++++- 3 files changed, 107 insertions(+), 14 deletions(-) diff --git a/packages/dockview-core/src/__tests__/__test_utils__/utils.ts b/packages/dockview-core/src/__tests__/__test_utils__/utils.ts index ab8dc0a9e..8204d797e 100644 --- a/packages/dockview-core/src/__tests__/__test_utils__/utils.ts +++ b/packages/dockview-core/src/__tests__/__test_utils__/utils.ts @@ -12,3 +12,16 @@ export function setMockRefElement(node: Partial): void { jest.spyOn(React, 'useRef').mockReturnValueOnce(mockRef); } + +export function createOffsetDragOverEvent(params: { + clientX: number; + clientY: number; +}): Event { + const event = new Event('dragover', { + bubbles: true, + cancelable: true, + }); + Object.defineProperty(event, 'clientX', { get: () => params.clientX }); + Object.defineProperty(event, 'clientY', { get: () => params.clientY }); + return event; +} diff --git a/packages/dockview-core/src/__tests__/dnd/droptarget.spec.ts b/packages/dockview-core/src/__tests__/dnd/droptarget.spec.ts index 32de9729e..517fa40aa 100644 --- a/packages/dockview-core/src/__tests__/dnd/droptarget.spec.ts +++ b/packages/dockview-core/src/__tests__/dnd/droptarget.spec.ts @@ -7,19 +7,7 @@ import { positionToDirection, } from '../../dnd/droptarget'; import { fireEvent } from '@testing-library/dom'; - -function createOffsetDragOverEvent(params: { - clientX: number; - clientY: number; -}): Event { - const event = new Event('dragover', { - bubbles: true, - cancelable: true, - }); - Object.defineProperty(event, 'clientX', { get: () => params.clientX }); - Object.defineProperty(event, 'clientY', { get: () => params.clientY }); - return event; -} +import { createOffsetDragOverEvent } from '../__test_utils__/utils'; describe('droptarget', () => { let element: HTMLElement; diff --git a/packages/dockview-core/src/__tests__/dockview/dockviewGroupPanelModel.spec.ts b/packages/dockview-core/src/__tests__/dockview/dockviewGroupPanelModel.spec.ts index cd1ba209b..2052ef1be 100644 --- a/packages/dockview-core/src/__tests__/dockview/dockviewGroupPanelModel.spec.ts +++ b/packages/dockview-core/src/__tests__/dockview/dockviewGroupPanelModel.spec.ts @@ -1,4 +1,4 @@ -import {DockviewComponent} from '../../dockview/dockviewComponent'; +import { DockviewComponent } from '../../dockview/dockviewComponent'; import { GroupviewPanelState, IGroupPanelInitParameters, @@ -20,6 +20,7 @@ import { IDockviewPanel } from '../../dockview/dockviewPanel'; import { IDockviewPanelModel } from '../../dockview/dockviewPanelModel'; import { DockviewGroupPanel } from '../../dockview/dockviewGroupPanel'; import { WatermarkRendererInitParameters } from '../../dockview/types'; +import { createOffsetDragOverEvent } from '../__test_utils__/utils'; enum GroupChangeKind2 { ADD_PANEL, @@ -658,6 +659,97 @@ describe('groupview', () => { ).toBe(0); }); + test('that the .locked behaviour is as', () => { + const accessorMock = jest.fn, []>(() => { + return { + id: 'testcomponentid', + options: { + showDndOverlay: () => true, + }, + getPanel: jest.fn(), + onDidAddPanel: jest.fn(), + onDidRemovePanel: jest.fn(), + }; + }); + const accessor = new accessorMock() as DockviewComponent; + const groupviewMock = jest.fn, []>( + () => { + return { + canDisplayOverlay: jest.fn(), + }; + } + ); + + const groupView = new groupviewMock() as DockviewGroupPanelModel; + + const groupPanelMock = jest.fn, []>( + () => { + return { + id: 'testgroupid', + model: groupView, + }; + } + ); + + const container = document.createElement('div'); + const cut = new DockviewGroupPanelModel( + container, + accessor, + 'groupviewid', + {}, + new groupPanelMock() as DockviewGroupPanel + ); + + const element = container + .getElementsByClassName('content-container') + .item(0)!; + + jest.spyOn(element, 'clientHeight', 'get').mockImplementation( + () => 100 + ); + jest.spyOn(element, 'clientWidth', 'get').mockImplementation(() => 100); + + function run(value: number) { + fireEvent.dragEnter(element); + fireEvent( + element, + createOffsetDragOverEvent({ clientX: value, clientY: value }) + ); + } + + // base case - not locked + cut.locked = false; + run(10); + expect( + element.getElementsByClassName('drop-target-dropzone').length + ).toBe(1); + fireEvent.dragEnd(element); + + // special case - locked with no possible target + cut.locked = 'no-drop-target'; + run(10); + expect( + element.getElementsByClassName('drop-target-dropzone').length + ).toBe(0); + fireEvent.dragEnd(element); + + // standard locked - only show if not center target + cut.locked = true; + run(10); + expect( + element.getElementsByClassName('drop-target-dropzone').length + ).toBe(1); + fireEvent.dragEnd(element); + + // standard locked but for center target - expect not shown + cut.locked = true; + run(25); + expect( + element.getElementsByClassName('drop-target-dropzone').length + ).toBe(0); + fireEvent.dragEnd(element); + }); + test('that should not show drop target if dropping on self', () => { const accessorMock = jest.fn, []>(() => { return {