mirror of
https://github.com/mathuo/dockview
synced 2025-05-02 17:48:25 +00:00
feat: update component state before add/remove events
This commit is contained in:
parent
367db9fa40
commit
3b2214d6b6
@ -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);
|
||||
|
||||
|
@ -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) {
|
||||
|
@ -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);
|
||||
|
Loading…
Reference in New Issue
Block a user