Merge pull request #928 from borglin/896-restore-popout-content-on-blocked-popouts

[896] Restore Popout content for blocked popouts and emit onDidBlockPopout event
This commit is contained in:
mathuo 2025-05-24 21:07:11 +01:00 committed by GitHub
commit b76e41bd92
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 84 additions and 17 deletions

View File

@ -5791,6 +5791,54 @@ describe('dockviewComponent', () => {
]);
});
describe('when browsers block popups', () => {
let container: HTMLDivElement;
let dockview: DockviewComponent;
let panel: DockviewPanel;
beforeEach(() => {
jest.spyOn(window, 'open').mockReturnValue(null);
container = document.createElement('div');
dockview = new DockviewComponent(container, {
createComponent(options) {
switch (options.name) {
case 'default':
return new PanelContentPartTest(
options.id,
options.name
);
default:
throw new Error(`unsupported`);
}
},
});
dockview.layout(1000, 500);
panel = dockview.addPanel({
id: 'panel_1',
component: 'default',
});
});
test('onDidBlockPopout event is emitted', async () => {
const onDidBlockPopoutHandler = jest.fn();
dockview.onDidBlockPopout(onDidBlockPopoutHandler);
await dockview.addPopoutGroup(panel.group);
expect(onDidBlockPopoutHandler).toHaveBeenCalledTimes(1);
});
test('popout group is restored to its original position', async () => {
await dockview.addPopoutGroup(panel.group);
expect(panel.group.api.location.type).toBe('grid');
});
});
test('dispose of dockview instance when popup is open', async () => {
const container = document.createElement('div');

View File

@ -251,6 +251,9 @@ export class Tabs extends CompositeDisposable {
delete(id: string): void {
const index = this.indexOf(id);
const tabToRemove = this._tabs.splice(index, 1)[0];
if (!tabToRemove) {
return;
}
const { value, disposable } = tabToRemove;

View File

@ -718,27 +718,11 @@ export class DockviewComponent
return false;
}
if (popoutContainer === null) {
popoutWindowDisposable.dispose();
this._onDidBlockPopout.fire();
return false;
}
const gready = document.createElement('div');
gready.className = 'dv-overlay-render-container';
const overlayRenderContainer = new OverlayRenderContainer(
gready,
this
);
const referenceGroup =
itemToPopout instanceof DockviewPanel
? itemToPopout.group
: itemToPopout;
const referenceLocation = itemToPopout.api.location.type;
/**
* The group that is being added doesn't already exist within the DOM, the most likely occurrence
* of this case is when being called from the `fromJSON(...)` method
@ -754,9 +738,41 @@ export class DockviewComponent
group = options.overridePopoutGroup;
} else {
group = this.createGroup({ id: groupId });
this._onDidAddGroup.fire(group);
if (popoutContainer) {
this._onDidAddGroup.fire(group);
}
}
if (popoutContainer === null) {
popoutWindowDisposable.dispose();
this._onDidBlockPopout.fire();
// if the popout window was blocked, we need to move the group back to the reference group
// and set it to visible
this.movingLock(() =>
moveGroupWithoutDestroying({
from: group,
to: referenceGroup,
})
);
if (!referenceGroup.api.isVisible) {
referenceGroup.api.setVisible(true);
}
return false;
}
const gready = document.createElement('div');
gready.className = 'dv-overlay-render-container';
const overlayRenderContainer = new OverlayRenderContainer(
gready,
this
);
const referenceLocation = itemToPopout.api.location.type;
group.model.renderContainer = overlayRenderContainer;
group.layout(
_window.window!.innerWidth,