Skip to content

Commit f3c6742

Browse files
iammolaiammola
committed
✅ test: add tests
1 parent a63735f commit f3c6742

File tree

5 files changed

+115
-1
lines changed

5 files changed

+115
-1
lines changed

‎packages/dockview-core/src/__tests__/api/dockviewPanelApi.spec.ts

+2
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,7 @@ describe('groupPanelApi', () => {
4949
const accessor = fromPartial<DockviewComponent>({
5050
onDidAddPanel: jest.fn(),
5151
onDidRemovePanel: jest.fn(),
52+
onDidActivePanelChange: jest.fn(),
5253
options: {},
5354
});
5455

@@ -81,6 +82,7 @@ describe('groupPanelApi', () => {
8182
const accessor = fromPartial<DockviewComponent>({
8283
onDidAddPanel: jest.fn(),
8384
onDidRemovePanel: jest.fn(),
85+
onDidActivePanelChange: jest.fn(),
8486
options: {},
8587
});
8688

‎packages/dockview-core/src/__tests__/dockview/components/titlebar/tabsContainer.spec.ts

+13
Original file line numberDiff line numberDiff line change
@@ -16,6 +16,7 @@ describe('tabsContainer', () => {
1616
const accessor = fromPartial<DockviewComponent>({
1717
onDidAddPanel: jest.fn(),
1818
onDidRemovePanel: jest.fn(),
19+
onDidActivePanelChange: jest.fn(),
1920
options: {},
2021
});
2122

@@ -69,6 +70,7 @@ describe('tabsContainer', () => {
6970
id: 'testcomponentid',
7071
onDidAddPanel: jest.fn(),
7172
onDidRemovePanel: jest.fn(),
73+
onDidActivePanelChange: jest.fn(),
7274
options: {},
7375
});
7476

@@ -135,6 +137,7 @@ describe('tabsContainer', () => {
135137
id: 'testcomponentid',
136138
onDidAddPanel: jest.fn(),
137139
onDidRemovePanel: jest.fn(),
140+
onDidActivePanelChange: jest.fn(),
138141
options: {},
139142
});
140143

@@ -198,6 +201,7 @@ describe('tabsContainer', () => {
198201
id: 'testcomponentid',
199202
onDidAddPanel: jest.fn(),
200203
onDidRemovePanel: jest.fn(),
204+
onDidActivePanelChange: jest.fn(),
201205
options: {},
202206
});
203207

@@ -261,6 +265,7 @@ describe('tabsContainer', () => {
261265
id: 'testcomponentid',
262266
onDidAddPanel: jest.fn(),
263267
onDidRemovePanel: jest.fn(),
268+
onDidActivePanelChange: jest.fn(),
264269
options: {},
265270
});
266271

@@ -329,6 +334,7 @@ describe('tabsContainer', () => {
329334
id: 'testcomponentid',
330335
onDidAddPanel: jest.fn(),
331336
onDidRemovePanel: jest.fn(),
337+
onDidActivePanelChange: jest.fn(),
332338
options: {},
333339
});
334340

@@ -393,6 +399,7 @@ describe('tabsContainer', () => {
393399
id: 'testcomponentid',
394400
onDidAddPanel: jest.fn(),
395401
onDidRemovePanel: jest.fn(),
402+
onDidActivePanelChange: jest.fn(),
396403
options: {},
397404
});
398405

@@ -457,6 +464,7 @@ describe('tabsContainer', () => {
457464
options: {},
458465
onDidAddPanel: jest.fn(),
459466
onDidRemovePanel: jest.fn(),
467+
onDidActivePanelChange: jest.fn(),
460468
element: document.createElement('div'),
461469
addFloatingGroup: jest.fn(),
462470
});
@@ -511,6 +519,7 @@ describe('tabsContainer', () => {
511519
options: {},
512520
onDidAddPanel: jest.fn(),
513521
onDidRemovePanel: jest.fn(),
522+
onDidActivePanelChange: jest.fn(),
514523
element: document.createElement('div'),
515524
addFloatingGroup: jest.fn(),
516525
});
@@ -560,6 +569,7 @@ describe('tabsContainer', () => {
560569
options: {},
561570
onDidAddPanel: jest.fn(),
562571
onDidRemovePanel: jest.fn(),
572+
onDidActivePanelChange: jest.fn(),
563573
element: document.createElement('div'),
564574
addFloatingGroup: jest.fn(),
565575
getGroupPanel: jest.fn(),
@@ -616,6 +626,7 @@ describe('tabsContainer', () => {
616626
options: {},
617627
onDidAddPanel: jest.fn(),
618628
onDidRemovePanel: jest.fn(),
629+
onDidActivePanelChange: jest.fn(),
619630
element: document.createElement('div'),
620631
addFloatingGroup: jest.fn(),
621632
getGroupPanel: jest.fn(),
@@ -683,6 +694,7 @@ describe('tabsContainer', () => {
683694
options: {},
684695
onDidAddPanel: jest.fn(),
685696
onDidRemovePanel: jest.fn(),
697+
onDidActivePanelChange: jest.fn(),
686698
element: document.createElement('div'),
687699
addFloatingGroup: jest.fn(),
688700
getGroupPanel: jest.fn(),
@@ -750,6 +762,7 @@ describe('tabsContainer', () => {
750762
options: {},
751763
onDidAddPanel: jest.fn(),
752764
onDidRemovePanel: jest.fn(),
765+
onDidActivePanelChange: jest.fn(),
753766
element: document.createElement('div'),
754767
addFloatingGroup: jest.fn(),
755768
getGroupPanel: jest.fn(),

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

+88-1
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import { PanelUpdateEvent } from '../../panel/types';
88
import { Orientation } from '../../splitview/splitview';
99
import { CompositeDisposable } from '../../lifecycle';
1010
import { Emitter } from '../../events';
11-
import { IDockviewPanel } from '../../dockview/dockviewPanel';
11+
import { IDockviewPanel } from '../../dockview/dockviewPanel';
1212
import { DockviewGroupPanel } from '../../dockview/dockviewGroupPanel';
1313
import { fireEvent, queryByTestId } from '@testing-library/dom';
1414
import { getPanelData } from '../../dnd/dataTransfer';
@@ -5637,4 +5637,91 @@ describe('dockviewComponent', () => {
56375637
expect(dockview.gap).toBe(15);
56385638
});
56395639
});
5640+
5641+
test('that arrow keys should activate appropriate tabs', () => {
5642+
dockview.layout(500, 1000);
5643+
5644+
dockview.addPanel({
5645+
id: 'panel1',
5646+
component: 'default',
5647+
});
5648+
5649+
dockview.addPanel({
5650+
id: 'panel2',
5651+
component: 'default',
5652+
position: { referencePanel: 'panel1', direction: 'within' },
5653+
});
5654+
5655+
dockview.addPanel({
5656+
id: 'panel3',
5657+
component: 'default',
5658+
});
5659+
5660+
dockview.addPanel({
5661+
id: 'panel4',
5662+
component: 'default',
5663+
position: { referencePanel: 'panel3', direction: 'below' },
5664+
});
5665+
5666+
const panel1 = dockview.getGroupPanel('panel1')!;
5667+
const panel2 = dockview.getGroupPanel('panel2')!;
5668+
const panel3 = dockview.getGroupPanel('panel3')!;
5669+
const panel4 = dockview.getGroupPanel('panel4')!;
5670+
5671+
panel1.api.setActive();
5672+
5673+
expect(panel1.api.isActive).toBeTruthy();
5674+
expect(panel2.api.isActive).toBeFalsy();
5675+
expect(panel3.api.isActive).toBeFalsy();
5676+
expect(panel4.api.isActive).toBeFalsy();
5677+
5678+
const tabsContainer = (panel: IDockviewPanel) =>
5679+
panel.api.group.element.querySelector('.tabs-container')!;
5680+
5681+
const event = new KeyboardEvent('keydown', { key: 'ArrowRight' });
5682+
5683+
fireEvent(tabsContainer(panel1), event);
5684+
expect(panel1.api.isActive).toBeFalsy();
5685+
expect(panel2.api.isActive).toBeTruthy();
5686+
expect(panel3.api.isActive).toBeFalsy();
5687+
expect(panel4.api.isActive).toBeFalsy();
5688+
5689+
fireEvent(tabsContainer(panel1), event);
5690+
expect(panel1.api.isActive).toBeFalsy();
5691+
expect(panel2.api.isActive).toBeFalsy();
5692+
expect(panel3.api.isActive).toBeTruthy();
5693+
expect(panel4.api.isActive).toBeFalsy();
5694+
5695+
const event2 = new KeyboardEvent('keydown', { key: 'ArrowLeft' });
5696+
5697+
fireEvent(tabsContainer(panel1), event2);
5698+
expect(panel1.api.isActive).toBeFalsy();
5699+
expect(panel2.api.isActive).toBeTruthy();
5700+
expect(panel3.api.isActive).toBeFalsy();
5701+
expect(panel4.api.isActive).toBeFalsy();
5702+
5703+
fireEvent(tabsContainer(panel1), event2);
5704+
expect(panel1.api.isActive).toBeTruthy();
5705+
expect(panel2.api.isActive).toBeFalsy();
5706+
expect(panel3.api.isActive).toBeFalsy();
5707+
expect(panel4.api.isActive).toBeFalsy();
5708+
5709+
panel4.api.setActive();
5710+
expect(panel1.api.isActive).toBeFalsy();
5711+
expect(panel2.api.isActive).toBeFalsy();
5712+
expect(panel3.api.isActive).toBeFalsy();
5713+
expect(panel4.api.isActive).toBeTruthy();
5714+
5715+
fireEvent(tabsContainer(panel4), event2);
5716+
expect(panel1.api.isActive).toBeFalsy();
5717+
expect(panel2.api.isActive).toBeFalsy();
5718+
expect(panel3.api.isActive).toBeFalsy();
5719+
expect(panel4.api.isActive).toBeTruthy();
5720+
5721+
fireEvent(tabsContainer(panel4), event);
5722+
expect(panel1.api.isActive).toBeFalsy();
5723+
expect(panel2.api.isActive).toBeFalsy();
5724+
expect(panel3.api.isActive).toBeFalsy();
5725+
expect(panel4.api.isActive).toBeTruthy();
5726+
});
56405727
});

‎packages/dockview-core/src/__tests__/dockview/dockviewGroupPanelModel.spec.ts

+11
Original file line numberDiff line numberDiff line change
@@ -188,6 +188,8 @@ export class TestPanel implements IDockviewPanel {
188188
private _group: DockviewGroupPanel | undefined;
189189
private _params: IGroupPanelInitParameters | undefined;
190190
readonly view: IDockviewPanelModel;
191+
readonly componentElId: string;
192+
readonly tabComponentElId: string;
191193

192194
get title() {
193195
return '';
@@ -203,6 +205,8 @@ export class TestPanel implements IDockviewPanel {
203205

204206
constructor(public readonly id: string, public api: DockviewPanelApi) {
205207
this.view = new TestModel(id);
208+
this.tabComponentElId = `tab-${id}`;
209+
this.componentElId = `tab-panel-${id}`;
206210
this.init({
207211
title: `${id}`,
208212
params: {},
@@ -280,6 +284,7 @@ describe('dockviewGroupPanelModel', () => {
280284
removeGroup: removeGroupMock,
281285
onDidAddPanel: () => ({ dispose: jest.fn() }),
282286
onDidRemovePanel: () => ({ dispose: jest.fn() }),
287+
onDidActivePanelChange: () => ({ dispose: jest.fn() }),
283288
overlayRenderContainer: new OverlayRenderContainer(
284289
document.createElement('div'),
285290
fromPartial<DockviewComponent>({})
@@ -665,6 +670,7 @@ describe('dockviewGroupPanelModel', () => {
665670
getPanel: jest.fn(),
666671
onDidAddPanel: jest.fn(),
667672
onDidRemovePanel: jest.fn(),
673+
onDidActivePanelChange: jest.fn(),
668674
});
669675

670676
const groupviewMock = jest.fn<Partial<DockviewGroupPanelModel>, []>(
@@ -727,6 +733,7 @@ describe('dockviewGroupPanelModel', () => {
727733
getPanel: jest.fn(),
728734
onDidAddPanel: jest.fn(),
729735
onDidRemovePanel: jest.fn(),
736+
onDidActivePanelChange: jest.fn(),
730737
});
731738

732739
const groupviewMock = jest.fn<Partial<DockviewGroupPanelModel>, []>(
@@ -819,6 +826,7 @@ describe('dockviewGroupPanelModel', () => {
819826
doSetGroupActive: jest.fn(),
820827
onDidAddPanel: jest.fn(),
821828
onDidRemovePanel: jest.fn(),
829+
onDidActivePanelChange: jest.fn(),
822830
overlayRenderContainer: new OverlayRenderContainer(
823831
document.createElement('div'),
824832
fromPartial<DockviewComponent>({})
@@ -891,6 +899,7 @@ describe('dockviewGroupPanelModel', () => {
891899
doSetGroupActive: jest.fn(),
892900
onDidAddPanel: jest.fn(),
893901
onDidRemovePanel: jest.fn(),
902+
onDidActivePanelChange: jest.fn(),
894903
overlayRenderContainer: new OverlayRenderContainer(
895904
document.createElement('div'),
896905
fromPartial<DockviewComponent>({})
@@ -964,6 +973,7 @@ describe('dockviewGroupPanelModel', () => {
964973
doSetGroupActive: jest.fn(),
965974
onDidAddPanel: jest.fn(),
966975
onDidRemovePanel: jest.fn(),
976+
onDidActivePanelChange: jest.fn(),
967977
overlayRenderContainer: new OverlayRenderContainer(
968978
document.createElement('div'),
969979
fromPartial<DockviewComponent>({})
@@ -1044,6 +1054,7 @@ describe('dockviewGroupPanelModel', () => {
10441054
return {
10451055
id: 'testgroupid',
10461056
model: groupView,
1057+
dispose: jest.fn()
10471058
};
10481059
});
10491060

‎packages/dockview-core/src/__tests__/gridview/gridviewPanel.spec.ts

+1
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ describe('gridviewPanel', () => {
77
return {
88
onDidAddPanel: jest.fn(),
99
onDidRemovePanel: jest.fn(),
10+
onDidActivePanelChange: jest.fn(),
1011
options: {},
1112
} as any;
1213
});

0 commit comments

Comments
 (0)