Skip to content

Commit e999796

Browse files
committed
feat: events cleanup
1 parent 89fe866 commit e999796

12 files changed

+524
-432
lines changed

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

+144-171
Large diffs are not rendered by default.

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

+8-1
Original file line numberDiff line numberDiff line change
@@ -196,7 +196,14 @@ export class TestPanel implements IDockviewPanel {
196196
this._params = params;
197197
}
198198

199-
updateParentGroup(group: DockviewGroupPanel, isGroupActive: boolean): void {
199+
updateParentGroup(
200+
group: DockviewGroupPanel,
201+
options: { isGroupActive: boolean }
202+
): void {
203+
//
204+
}
205+
206+
runEvents(): void {
200207
//
201208
}
202209

packages/dockview-core/src/__tests__/dockview/dockviewPanelModel.spec.ts

+49-49
Original file line numberDiff line numberDiff line change
@@ -18,8 +18,8 @@ describe('dockviewGroupPanel', () => {
1818
element: document.createElement('div'),
1919
dispose: jest.fn(),
2020
update: jest.fn(),
21-
onGroupChange: jest.fn(),
22-
onPanelVisibleChange: jest.fn(),
21+
// onGroupChange: jest.fn(),
22+
// onPanelVisibleChange: jest.fn(),
2323
};
2424
return partial as IContentRenderer;
2525
});
@@ -29,8 +29,8 @@ describe('dockviewGroupPanel', () => {
2929
element: document.createElement('div'),
3030
dispose: jest.fn(),
3131
update: jest.fn(),
32-
onGroupChange: jest.fn(),
33-
onPanelVisibleChange: jest.fn(),
32+
// onGroupChange: jest.fn(),
33+
// onPanelVisibleChange: jest.fn(),
3434
};
3535
return partial as IContentRenderer;
3636
});
@@ -82,51 +82,51 @@ describe('dockviewGroupPanel', () => {
8282
expect(cut.tab.update).toHaveBeenCalled();
8383
});
8484

85-
test('that events are fired', () => {
86-
const cut = new DockviewPanelModel(
87-
<IDockviewComponent>new accessorMock(),
88-
'id',
89-
'contentComponent',
90-
'tabComponent'
91-
);
92-
93-
const group1 = jest.fn() as any;
94-
const group2 = jest.fn() as any;
95-
cut.updateParentGroup(group1, false);
96-
97-
expect(cut.content.onGroupChange).toHaveBeenNthCalledWith(1, group1);
98-
expect(cut.tab.onGroupChange).toHaveBeenNthCalledWith(1, group1);
99-
expect(cut.content.onPanelVisibleChange).toHaveBeenNthCalledWith(
100-
1,
101-
false
102-
);
103-
expect(cut.tab.onPanelVisibleChange).toHaveBeenNthCalledWith(1, false);
104-
expect(cut.content.onGroupChange).toHaveBeenCalledTimes(1);
105-
expect(cut.tab.onGroupChange).toHaveBeenCalledTimes(1);
106-
expect(cut.content.onPanelVisibleChange).toHaveBeenCalledTimes(1);
107-
expect(cut.tab.onPanelVisibleChange).toHaveBeenCalledTimes(1);
108-
109-
cut.updateParentGroup(group1, true);
110-
111-
expect(cut.content.onPanelVisibleChange).toHaveBeenNthCalledWith(
112-
2,
113-
true
114-
);
115-
expect(cut.tab.onPanelVisibleChange).toHaveBeenNthCalledWith(2, true);
116-
expect(cut.content.onGroupChange).toHaveBeenCalledTimes(1);
117-
expect(cut.tab.onGroupChange).toHaveBeenCalledTimes(1);
118-
expect(cut.content.onPanelVisibleChange).toHaveBeenCalledTimes(2);
119-
expect(cut.tab.onPanelVisibleChange).toHaveBeenCalledTimes(2);
120-
121-
cut.updateParentGroup(group2, true);
122-
123-
expect(cut.content.onGroupChange).toHaveBeenNthCalledWith(2, group2);
124-
expect(cut.tab.onGroupChange).toHaveBeenNthCalledWith(2, group2);
125-
expect(cut.content.onGroupChange).toHaveBeenCalledTimes(2);
126-
expect(cut.tab.onGroupChange).toHaveBeenCalledTimes(2);
127-
expect(cut.content.onPanelVisibleChange).toHaveBeenCalledTimes(2);
128-
expect(cut.tab.onPanelVisibleChange).toHaveBeenCalledTimes(2);
129-
});
85+
// test('that events are fired', () => {
86+
// const cut = new DockviewPanelModel(
87+
// <IDockviewComponent>new accessorMock(),
88+
// 'id',
89+
// 'contentComponent',
90+
// 'tabComponent'
91+
// );
92+
93+
// const group1 = jest.fn() as any;
94+
// const group2 = jest.fn() as any;
95+
// cut.updateParentGroup(group1, false);
96+
97+
// expect(cut.content.onGroupChange).toHaveBeenNthCalledWith(1, group1);
98+
// expect(cut.tab.onGroupChange).toHaveBeenNthCalledWith(1, group1);
99+
// expect(cut.content.onPanelVisibleChange).toHaveBeenNthCalledWith(
100+
// 1,
101+
// false
102+
// );
103+
// expect(cut.tab.onPanelVisibleChange).toHaveBeenNthCalledWith(1, false);
104+
// expect(cut.content.onGroupChange).toHaveBeenCalledTimes(1);
105+
// expect(cut.tab.onGroupChange).toHaveBeenCalledTimes(1);
106+
// expect(cut.content.onPanelVisibleChange).toHaveBeenCalledTimes(1);
107+
// expect(cut.tab.onPanelVisibleChange).toHaveBeenCalledTimes(1);
108+
109+
// cut.updateParentGroup(group1, true);
110+
111+
// expect(cut.content.onPanelVisibleChange).toHaveBeenNthCalledWith(
112+
// 2,
113+
// true
114+
// );
115+
// expect(cut.tab.onPanelVisibleChange).toHaveBeenNthCalledWith(2, true);
116+
// expect(cut.content.onGroupChange).toHaveBeenCalledTimes(1);
117+
// expect(cut.tab.onGroupChange).toHaveBeenCalledTimes(1);
118+
// expect(cut.content.onPanelVisibleChange).toHaveBeenCalledTimes(2);
119+
// expect(cut.tab.onPanelVisibleChange).toHaveBeenCalledTimes(2);
120+
121+
// cut.updateParentGroup(group2, true);
122+
123+
// expect(cut.content.onGroupChange).toHaveBeenNthCalledWith(2, group2);
124+
// expect(cut.tab.onGroupChange).toHaveBeenNthCalledWith(2, group2);
125+
// expect(cut.content.onGroupChange).toHaveBeenCalledTimes(2);
126+
// expect(cut.tab.onGroupChange).toHaveBeenCalledTimes(2);
127+
// expect(cut.content.onPanelVisibleChange).toHaveBeenCalledTimes(2);
128+
// expect(cut.tab.onPanelVisibleChange).toHaveBeenCalledTimes(2);
129+
// });
130130

131131
test('that the default tab is created', () => {
132132
accessorMock = jest.fn<DockviewComponent, []>(() => {

packages/dockview-core/src/api/dockviewGroupPanelApi.ts

+9-6
Original file line numberDiff line numberDiff line change
@@ -63,12 +63,15 @@ export class DockviewGroupPanelApiImpl extends GridviewPanelApiImpl {
6363
direction: positionToDirection(options.position ?? 'right'),
6464
});
6565

66-
this.accessor.moveGroupOrPanel(
67-
group,
68-
this._group.id,
69-
undefined,
70-
options.group ? options.position ?? 'center' : 'center'
71-
);
66+
this.accessor.moveGroupOrPanel({
67+
from: { groupId: this._group.id },
68+
to: {
69+
group,
70+
position: options.group
71+
? options.position ?? 'center'
72+
: 'center',
73+
},
74+
});
7275
}
7376

7477
maximize(): void {

packages/dockview-core/src/api/dockviewPanelApi.ts

+38-19
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,11 @@ export interface TitleEvent {
1414
}
1515

1616
export interface RendererChangedEvent {
17-
renderer: DockviewPanelRenderer;
17+
readonly renderer: DockviewPanelRenderer;
18+
}
19+
20+
export interface ActiveGroupEvent {
21+
readonly isActive: boolean;
1822
}
1923

2024
export interface DockviewPanelApi
@@ -27,7 +31,7 @@ export interface DockviewPanelApi
2731
readonly isGroupActive: boolean;
2832
readonly renderer: DockviewPanelRenderer;
2933
readonly title: string | undefined;
30-
readonly onDidActiveGroupChange: Event<void>;
34+
readonly onDidActiveGroupChange: Event<ActiveGroupEvent>;
3135
readonly onDidGroupChange: Event<void>;
3236
readonly onDidRendererChange: Event<RendererChangedEvent>;
3337
readonly location: DockviewGroupLocation;
@@ -58,7 +62,7 @@ export class DockviewPanelApiImpl
5862
readonly _onDidTitleChange = new Emitter<TitleEvent>();
5963
readonly onDidTitleChange = this._onDidTitleChange.event;
6064

61-
private readonly _onDidActiveGroupChange = new Emitter<void>();
65+
private readonly _onDidActiveGroupChange = new Emitter<ActiveGroupEvent>();
6266
readonly onDidActiveGroupChange = this._onDidActiveGroupChange.event;
6367

6468
private readonly _onDidGroupChange = new Emitter<void>();
@@ -93,23 +97,39 @@ export class DockviewPanelApiImpl
9397
set group(value: DockviewGroupPanel) {
9498
const isOldGroupActive = this.isGroupActive;
9599

96-
this._group = value;
100+
if (this._group !== value) {
101+
this._group = value;
102+
103+
this._onDidGroupChange.fire();
97104

98-
this._onDidGroupChange.fire();
105+
let _trackGroupActive = isOldGroupActive; // prevent duplicate events with same state
99106

100-
if (this._group) {
101107
this.groupEventsDisposable.value = new CompositeDisposable(
102108
this.group.api.onDidLocationChange((event) => {
109+
if (this.group !== this.panel.group) {
110+
return;
111+
}
103112
this._onDidLocationChange.fire(event);
104113
}),
105114
this.group.api.onDidActiveChange(() => {
106-
this._onDidActiveGroupChange.fire();
115+
if (this.group !== this.panel.group) {
116+
return;
117+
}
118+
119+
if (_trackGroupActive !== this.isGroupActive) {
120+
_trackGroupActive = this.isGroupActive;
121+
this._onDidActiveGroupChange.fire({
122+
isActive: this.isGroupActive,
123+
});
124+
}
107125
})
108126
);
109127

110-
if (this.isGroupActive !== isOldGroupActive) {
111-
this._onDidActiveGroupChange.fire();
112-
}
128+
// if (this.isGroupActive !== isOldGroupActive) {
129+
// this._onDidActiveGroupChange.fire({
130+
// isActive: this.isGroupActive,
131+
// });
132+
// }
113133

114134
this._onDidLocationChange.fire({
115135
location: this.group.api.location,
@@ -132,8 +152,6 @@ export class DockviewPanelApiImpl
132152

133153
this._group = group;
134154

135-
136-
137155
this.addDisposables(
138156
this.groupEventsDisposable,
139157
this._onDidRendererChange,
@@ -153,13 +171,14 @@ export class DockviewPanelApiImpl
153171
position?: Position;
154172
index?: number;
155173
}): void {
156-
this.accessor.moveGroupOrPanel(
157-
options.group,
158-
this._group.id,
159-
this.panel.id,
160-
options.position ?? 'center',
161-
options.index
162-
);
174+
this.accessor.moveGroupOrPanel({
175+
from: { groupId: this._group.id, panelId: this.panel.id },
176+
to: {
177+
group: options.group,
178+
position: options.position ?? 'center',
179+
index: options.index,
180+
},
181+
});
163182
}
164183

165184
setTitle(title: string): void {

packages/dockview-core/src/dockview/components/titlebar/tabsContainer.ts

+3-5
Original file line numberDiff line numberDiff line change
@@ -390,17 +390,15 @@ export class TabsContainer
390390
return;
391391
}
392392

393-
const alreadyFocused =
394-
panel.id === this.group.model.activePanel?.id &&
395-
this.group.model.isContentFocused;
396-
397393
const isLeftClick = event.button === 0;
398394

399395
if (!isLeftClick || event.defaultPrevented) {
400396
return;
401397
}
402398

403-
this.group.model.openPanel(panel);
399+
if (this.group.activePanel !== panel) {
400+
this.group.model.openPanel(panel);
401+
}
404402
}),
405403
tab.onDrop((event) => {
406404
this._onDrop.fire({

0 commit comments

Comments
 (0)