Skip to content

Commit

Permalink
✅ test: add tests
Browse files Browse the repository at this point in the history
  • Loading branch information
@iammola
iammola committed Aug 28, 2024
1 parent 692588c commit 23a7bbe
Show file tree
Hide file tree
Showing 5 changed files with 115 additions and 1 deletion.
2 changes: 2 additions & 0 deletions packages/dockview-core/src/__tests__/api/dockviewPanelApi.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,7 @@ describe('groupPanelApi', () => {
const accessor = fromPartial<DockviewComponent>({
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
options: {},
});

Expand Down Expand Up @@ -81,6 +82,7 @@ describe('groupPanelApi', () => {
const accessor = fromPartial<DockviewComponent>({
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
options: {},
});

Expand Down
13 changes: 13 additions & 0 deletions packages/dockview-core/src/__tests__/dockview/components/titlebar/tabsContainer.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ describe('tabsContainer', () => {
const accessor = fromPartial<DockviewComponent>({
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
options: {},
});

Expand Down Expand Up @@ -69,6 +70,7 @@ describe('tabsContainer', () => {
id: 'testcomponentid',
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
options: {},
});

Expand Down Expand Up @@ -135,6 +137,7 @@ describe('tabsContainer', () => {
id: 'testcomponentid',
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
options: {},
});

Expand Down Expand Up @@ -198,6 +201,7 @@ describe('tabsContainer', () => {
id: 'testcomponentid',
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
options: {},
});

Expand Down Expand Up @@ -261,6 +265,7 @@ describe('tabsContainer', () => {
id: 'testcomponentid',
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
options: {},
});

Expand Down Expand Up @@ -329,6 +334,7 @@ describe('tabsContainer', () => {
id: 'testcomponentid',
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
options: {},
});

Expand Down Expand Up @@ -393,6 +399,7 @@ describe('tabsContainer', () => {
id: 'testcomponentid',
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
options: {},
});

Expand Down Expand Up @@ -457,6 +464,7 @@ describe('tabsContainer', () => {
options: {},
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
element: document.createElement('div'),
addFloatingGroup: jest.fn(),
});
Expand Down Expand Up @@ -511,6 +519,7 @@ describe('tabsContainer', () => {
options: {},
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
element: document.createElement('div'),
addFloatingGroup: jest.fn(),
});
Expand Down Expand Up @@ -560,6 +569,7 @@ describe('tabsContainer', () => {
options: {},
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
element: document.createElement('div'),
addFloatingGroup: jest.fn(),
getGroupPanel: jest.fn(),
Expand Down Expand Up @@ -616,6 +626,7 @@ describe('tabsContainer', () => {
options: {},
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
element: document.createElement('div'),
addFloatingGroup: jest.fn(),
getGroupPanel: jest.fn(),
Expand Down Expand Up @@ -683,6 +694,7 @@ describe('tabsContainer', () => {
options: {},
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
element: document.createElement('div'),
addFloatingGroup: jest.fn(),
getGroupPanel: jest.fn(),
Expand Down Expand Up @@ -750,6 +762,7 @@ describe('tabsContainer', () => {
options: {},
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
element: document.createElement('div'),
addFloatingGroup: jest.fn(),
getGroupPanel: jest.fn(),
Expand Down
89 changes: 88 additions & 1 deletion packages/dockview-core/src/__tests__/dockview/dockviewComponent.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import { PanelUpdateEvent } from '../../panel/types';
import { Orientation } from '../../splitview/splitview';
import { CompositeDisposable } from '../../lifecycle';
import { Emitter } from '../../events';
import { IDockviewPanel } from '../../dockview/dockviewPanel';
import { IDockviewPanel } from '../../dockview/dockviewPanel';
import { DockviewGroupPanel } from '../../dockview/dockviewGroupPanel';
import { fireEvent, queryByTestId } from '@testing-library/dom';
import { getPanelData } from '../../dnd/dataTransfer';
Expand Down Expand Up @@ -5637,4 +5637,91 @@ describe('dockviewComponent', () => {
expect(dockview.gap).toBe(15);
});
});

test('that arrow keys should activate appropriate tabs', () => {
dockview.layout(500, 1000);

dockview.addPanel({
id: 'panel1',
component: 'default',
});

dockview.addPanel({
id: 'panel2',
component: 'default',
position: { referencePanel: 'panel1', direction: 'within' },
});

dockview.addPanel({
id: 'panel3',
component: 'default',
});

dockview.addPanel({
id: 'panel4',
component: 'default',
position: { referencePanel: 'panel3', direction: 'below' },
});

const panel1 = dockview.getGroupPanel('panel1')!;
const panel2 = dockview.getGroupPanel('panel2')!;
const panel3 = dockview.getGroupPanel('panel3')!;
const panel4 = dockview.getGroupPanel('panel4')!;

panel1.api.setActive();

expect(panel1.api.isActive).toBeTruthy();
expect(panel2.api.isActive).toBeFalsy();
expect(panel3.api.isActive).toBeFalsy();
expect(panel4.api.isActive).toBeFalsy();

const tabsContainer = (panel: IDockviewPanel) =>
panel.api.group.element.querySelector('.tabs-container')!;

const event = new KeyboardEvent('keydown', { key: 'ArrowRight' });

fireEvent(tabsContainer(panel1), event);
expect(panel1.api.isActive).toBeFalsy();
expect(panel2.api.isActive).toBeTruthy();
expect(panel3.api.isActive).toBeFalsy();
expect(panel4.api.isActive).toBeFalsy();

fireEvent(tabsContainer(panel1), event);
expect(panel1.api.isActive).toBeFalsy();
expect(panel2.api.isActive).toBeFalsy();
expect(panel3.api.isActive).toBeTruthy();
expect(panel4.api.isActive).toBeFalsy();

const event2 = new KeyboardEvent('keydown', { key: 'ArrowLeft' });

fireEvent(tabsContainer(panel1), event2);
expect(panel1.api.isActive).toBeFalsy();
expect(panel2.api.isActive).toBeTruthy();
expect(panel3.api.isActive).toBeFalsy();
expect(panel4.api.isActive).toBeFalsy();

fireEvent(tabsContainer(panel1), event2);
expect(panel1.api.isActive).toBeTruthy();
expect(panel2.api.isActive).toBeFalsy();
expect(panel3.api.isActive).toBeFalsy();
expect(panel4.api.isActive).toBeFalsy();

panel4.api.setActive();
expect(panel1.api.isActive).toBeFalsy();
expect(panel2.api.isActive).toBeFalsy();
expect(panel3.api.isActive).toBeFalsy();
expect(panel4.api.isActive).toBeTruthy();

fireEvent(tabsContainer(panel4), event2);
expect(panel1.api.isActive).toBeFalsy();
expect(panel2.api.isActive).toBeFalsy();
expect(panel3.api.isActive).toBeFalsy();
expect(panel4.api.isActive).toBeTruthy();

fireEvent(tabsContainer(panel4), event);
expect(panel1.api.isActive).toBeFalsy();
expect(panel2.api.isActive).toBeFalsy();
expect(panel3.api.isActive).toBeFalsy();
expect(panel4.api.isActive).toBeTruthy();
});
});
11 changes: 11 additions & 0 deletions packages/dockview-core/src/__tests__/dockview/dockviewGroupPanelModel.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -188,6 +188,8 @@ export class TestPanel implements IDockviewPanel {
private _group: DockviewGroupPanel | undefined;
private _params: IGroupPanelInitParameters | undefined;
readonly view: IDockviewPanelModel;
readonly componentElId: string;
readonly tabComponentElId: string;

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

constructor(public readonly id: string, public api: DockviewPanelApi) {
this.view = new TestModel(id);
this.tabComponentElId = `tab-${id}`;
this.componentElId = `tab-panel-${id}`;
this.init({
title: `${id}`,
params: {},
Expand Down Expand Up @@ -280,6 +284,7 @@ describe('dockviewGroupPanelModel', () => {
removeGroup: removeGroupMock,
onDidAddPanel: () => ({ dispose: jest.fn() }),
onDidRemovePanel: () => ({ dispose: jest.fn() }),
onDidActivePanelChange: () => ({ dispose: jest.fn() }),
overlayRenderContainer: new OverlayRenderContainer(
document.createElement('div'),
fromPartial<DockviewComponent>({})
Expand Down Expand Up @@ -665,6 +670,7 @@ describe('dockviewGroupPanelModel', () => {
getPanel: jest.fn(),
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
});

const groupviewMock = jest.fn<Partial<DockviewGroupPanelModel>, []>(
Expand Down Expand Up @@ -727,6 +733,7 @@ describe('dockviewGroupPanelModel', () => {
getPanel: jest.fn(),
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
});

const groupviewMock = jest.fn<Partial<DockviewGroupPanelModel>, []>(
Expand Down Expand Up @@ -819,6 +826,7 @@ describe('dockviewGroupPanelModel', () => {
doSetGroupActive: jest.fn(),
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
overlayRenderContainer: new OverlayRenderContainer(
document.createElement('div'),
fromPartial<DockviewComponent>({})
Expand Down Expand Up @@ -891,6 +899,7 @@ describe('dockviewGroupPanelModel', () => {
doSetGroupActive: jest.fn(),
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
overlayRenderContainer: new OverlayRenderContainer(
document.createElement('div'),
fromPartial<DockviewComponent>({})
Expand Down Expand Up @@ -964,6 +973,7 @@ describe('dockviewGroupPanelModel', () => {
doSetGroupActive: jest.fn(),
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
overlayRenderContainer: new OverlayRenderContainer(
document.createElement('div'),
fromPartial<DockviewComponent>({})
Expand Down Expand Up @@ -1044,6 +1054,7 @@ describe('dockviewGroupPanelModel', () => {
return {
id: 'testgroupid',
model: groupView,
dispose: jest.fn()
};
});

Expand Down
1 change: 1 addition & 0 deletions packages/dockview-core/src/__tests__/gridview/gridviewPanel.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ describe('gridviewPanel', () => {
return {
onDidAddPanel: jest.fn(),
onDidRemovePanel: jest.fn(),
onDidActivePanelChange: jest.fn(),
options: {},
} as any;
});
Expand Down

0 comments on commit 23a7bbe

Please sign in to comment.