feat: update component state before add/remove events

This commit is contained in:
mathuo 2021-11-16 21:25:57 +00:00
parent 367db9fa40
commit 3b2214d6b6
No known key found for this signature in database
GPG Key ID: C6EEDEFD6CA07281
3 changed files with 102 additions and 6 deletions

View File

@ -621,6 +621,90 @@ describe('dockviewComponent', () => {
disposable.dispose();
});
test('totalPanels is updated before panel event fires', () => {
dockview.layout(1000, 1000);
let counter = 0;
const disposable = dockview.onGridEvent((e) => {
switch (e.kind) {
case GroupChangeKind.ADD_PANEL:
counter++;
expect(counter).toBe(dockview.totalPanels);
break;
case GroupChangeKind.REMOVE_PANEL:
counter--;
expect(counter).toBe(dockview.totalPanels);
break;
}
});
const panel1 = dockview.addPanel({
id: 'panel1',
component: 'default',
});
const panel2 = dockview.addPanel({
id: 'panel2',
component: 'default',
position: { referencePanel: 'panel1', direction: 'within' },
});
const panel3 = dockview.addPanel({
id: 'panel3',
component: 'default',
position: { referencePanel: 'panel1', direction: 'right' },
});
dockview.removePanel(panel1);
dockview.removePanel(panel3);
dockview.removePanel(panel2);
disposable.dispose();
});
test('size is updated before group event fires', () => {
dockview.layout(1000, 1000);
let counter = 0;
const disposable = dockview.onGridEvent((e) => {
switch (e.kind) {
case GroupChangeKind.ADD_GROUP:
counter++;
expect(counter).toBe(dockview.size);
break;
case GroupChangeKind.REMOVE_GROUP:
counter--;
expect(counter).toBe(dockview.size);
break;
}
});
const panel1 = dockview.addPanel({
id: 'panel1',
component: 'default',
});
const panel2 = dockview.addPanel({
id: 'panel2',
component: 'default',
position: { referencePanel: 'panel1', direction: 'within' },
});
const panel3 = dockview.addPanel({
id: 'panel3',
component: 'default',
position: { referencePanel: 'panel1', direction: 'right' },
});
dockview.removePanel(panel1);
dockview.removePanel(panel3);
dockview.removePanel(panel2);
disposable.dispose();
});
test('events flow', () => {
dockview.layout(1000, 1000);

View File

@ -291,7 +291,7 @@ export class DockviewComponent
}
}
registerPanel(panel: IGroupPanel): void {
private registerPanel(panel: IGroupPanel): void {
if (this._panels.has(panel.id)) {
throw new Error(`panel ${panel.id} already exists`);
}
@ -303,7 +303,7 @@ export class DockviewComponent
this._panels.set(panel.id, { value: panel, disposable });
}
unregisterPanel(panel: IGroupPanel): void {
private unregisterPanel(panel: IGroupPanel): void {
if (!this._panels.has(panel.id)) {
throw new Error(`panel ${panel.id} doesn't exist`);
}
@ -460,7 +460,20 @@ export class DockviewComponent
}
removePanel(panel: IGroupPanel): void {
panel.group?.model.removePanel(panel);
this.unregisterPanel(panel);
const group = panel.group;
if (!group) {
throw new Error(
`cannot remove panel ${panel.id}. it's missing a group.`
);
}
group.model.removePanel(panel);
if (group.model.size === 0) {
this.removeGroup(group);
}
}
createWatermarkComponent(): IWatermarkRenderer {
@ -516,8 +529,7 @@ export class DockviewComponent
removeGroup(group: GroupviewPanel): void {
const panels = [...group.model.panels]; // reassign since group panels will mutate
panels.forEach((panel) => {
group.model.removePanel(panel);
this.unregisterPanel(panel);
this.removePanel(panel);
});
if (this._groups.size === 1) {

View File

@ -436,8 +436,8 @@ export class Groupview extends CompositeDisposable implements IGroupview {
};
private doClose(panel: IGroupPanel) {
this.removePanel(panel);
this._removePanel(panel);
(this.accessor as DockviewComponent).unregisterPanel(panel);
if (this.panels.length === 0) {
this.accessor.removeGroup(this.parent);