Skip to content

Commit

Permalink
Fixes #182449 : Pressing Shift re-enables webview during Drag and Dro…
Browse files Browse the repository at this point in the history 
…p Events (#209211)

* added shift key listener to re-enable drag events for webview #182449

* adding drag and drag over listeners to webview iframe(s)

updating html hash

adding shift release listener to drag and drag over events

adding new custom drag event handler to allow event bubbling

adding new event types

correcting comment:

removing drag over listener from drag monitor since we are converting this to drag events

making webview drag monitor stateful and adding missing events to iframe dom html file

Revert "Merge remote-tracking branch 'microsoft/main' into swordensen"

This reverts commit 47e3877, reversing
changes made to 8f71927.

Revert "making webview drag monitor stateful and adding missing events to iframe dom html file"

This reverts commit 8f71927.

Revert "removing drag over listener from drag monitor since we are converting this to drag events"

This reverts commit bfae5f1.

Revert "correcting comment:"

This reverts commit 696facb.

Revert "Merge branch 'main' into main"

This reverts commit 78ed36c, reversing
changes made to 7b96d0e.

Revert "adding new event types"

This reverts commit 7b96d0e.

Revert "adding new custom drag event handler to allow event bubbling"

This reverts commit 39971e0.

Revert "adding shift release listener to drag and drag over events"

This reverts commit 4f5d9e8.

Revert "updating html hash"

This reverts commit 6a474cb.

Revert "adding drag and drag over listeners to webview iframe(s)"

This reverts commit 6688ec6.

adding harmless change to see if this causes smoketests and integration tests to fail

adding sha hash

Revert "adding sha hash"

This reverts commit 830baa8.

Revert "adding harmless change to see if this causes smoketests and integration tests to fail"

This reverts commit ceb55f9.

Revert "Revert "adding drag and drag over listeners to webview iframe(s)""

This reverts commit 1baf483.

Revert "Revert "adding shift release listener to drag and drag over events""

This reverts commit 40bc29c.

Revert "Revert "adding new custom drag event handler to allow event bubbling""

This reverts commit 44f4fda.

Revert "Revert "adding new event types""

This reverts commit 67f1aaa.

removing internal drag listener

removing types. Maybe it's causing build issues?

renaming drag event to WebviewDragEvent to avoid collision with native DragEvent type

resolving conflict with correcting comment

Revert "Revert "Merge branch 'main' into main""

This reverts commit 1a4d711.

Revert "Revert "Merge branch 'main' into main""

This reverts commit 8520787.

resolving conflict

Revert "resolving conflict"

This reverts commit c5b3f7f.

Revert "Merge remote-tracking branch 'microsoft/main' into swordensen"

somehow i got assigned these changes in the process of unreverting my merges

fix: serialization of newline characters

removing console log

forgot the security hash when removing console log

* updating sha
  • Loading branch information
@swordensen
swordensen committed Jun 19, 2024
1 parent 36d874f commit 51917e8
Show file tree
Hide file tree
Showing 4 changed files with 64 additions and 6 deletions.
22 changes: 19 additions & 3 deletions src/vs/workbench/contrib/webview/browser/pre/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,9 @@
<meta charset="UTF-8">

<meta http-equiv="Content-Security-Policy"
content="default-src 'none'; script-src 'sha256-noHVLQsurkONXmA3fcuAmcZ8UPYm/db88mhm9gAXcvk=' 'self'; frame-src 'self'; style-src 'unsafe-inline';">

content="default-src 'none'; script-src 'sha256-EJBlYt9sOvo6RhZZJG+duTqIZCB8pctk1a62h/ZIElc=' 'self'; frame-src 'self'; style-src 'unsafe-inline';">


<!-- Disable pinch zooming -->
<meta name="viewport"
Expand Down Expand Up @@ -791,6 +793,17 @@
}
}


function handleInnerDragEvent(/** @type {DragEvent} */ e) {
if (!e.dataTransfer) {
return;
}

hostMessaging.postMessage('drag', {
shiftKey: e.shiftKey
});
}

/**
* @param {() => void} callback
*/
Expand Down Expand Up @@ -881,7 +894,9 @@
window.addEventListener('keydown', handleInnerKeydown);
window.addEventListener('keyup', handleInnerKeyup);
window.addEventListener('dragenter', handleInnerDragStartEvent);
window.addEventListener('dragover', handleInnerDragStartEvent);
window.addEventListener('dragover', handleInnerDragEvent);
window.addEventListener('drag', handleInnerDragEvent);


onDomReady(() => {
if (!document.body) {
Expand Down Expand Up @@ -1163,7 +1178,8 @@
});

contentWindow.addEventListener('dragenter', handleInnerDragStartEvent);
contentWindow.addEventListener('dragover', handleInnerDragStartEvent);
contentWindow.addEventListener('dragover', handleInnerDragEvent);
contentWindow.addEventListener('drag', handleInnerDragEvent);

unloadMonitor.onIframeLoaded(newFrame);
}
Expand Down
17 changes: 16 additions & 1 deletion src/vs/workbench/contrib/webview/browser/webviewElement.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ import { loadLocalResource, WebviewResourceResponse } from 'vs/workbench/contrib
import { WebviewThemeDataProvider } from 'vs/workbench/contrib/webview/browser/themeing';
import { areWebviewContentOptionsEqual, IWebview, WebviewContentOptions, WebviewExtensionDescription, WebviewInitInfo, WebviewMessageReceivedEvent, WebviewOptions } from 'vs/workbench/contrib/webview/browser/webview';
import { WebviewFindDelegate, WebviewFindWidget } from 'vs/workbench/contrib/webview/browser/webviewFindWidget';
import { FromWebviewMessage, KeyEvent, ToWebviewMessage } from 'vs/workbench/contrib/webview/browser/webviewMessages';
import { FromWebviewMessage, KeyEvent, ToWebviewMessage, WebViewDragEvent } from 'vs/workbench/contrib/webview/browser/webviewMessages';
import { decodeAuthority, webviewGenericCspSource, webviewRootResourceAuthority } from 'vs/workbench/contrib/webview/common/webview';
import { IWorkbenchEnvironmentService } from 'vs/workbench/services/environment/common/environmentService';
import { CodeWindow } from 'vs/base/browser/window';
Expand Down Expand Up @@ -310,6 +310,10 @@ export class WebviewElement extends Disposable implements IWebview, WebviewFindD
this._startBlockingIframeDragEvents();
}));

this._register(this.on('drag', (event) => {
this.handleDragEvent('drag', event);
}));

if (initInfo.options.enableFindWidget) {
this._webviewFindWidget = this._register(instantiationService.createInstance(WebviewFindWidget, this));
}
Expand Down Expand Up @@ -697,6 +701,17 @@ export class WebviewElement extends Disposable implements IWebview, WebviewFindD
this.window?.dispatchEvent(emulatedKeyboardEvent);
}

private handleDragEvent(type: 'drag', event: WebViewDragEvent) {
// Create a fake DragEvent from the data provided
const emulatedDragEvent = new DragEvent(type, event);
// Force override the target
Object.defineProperty(emulatedDragEvent, 'target', {
get: () => this.element,
});
// And re-dispatch
this.window?.dispatchEvent(emulatedDragEvent);
}

windowDidDragStart(): void {
// Webview break drag and dropping around the main window (no events are generated when you are over them)
// Work around this by disabling pointer events during the drag.
Expand Down
5 changes: 5 additions & 0 deletions src/vs/workbench/contrib/webview/browser/webviewMessages.d.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,10 @@ type KeyEvent = {
repeat: boolean;
}

type WebViewDragEvent = {
shiftKey: boolean;
}

export type FromWebviewMessage = {
'onmessage': { message: any; transfer?: ArrayBuffer[] };
'did-click-link': { uri: string };
Expand All @@ -36,6 +40,7 @@ export type FromWebviewMessage = {
'did-keyup': KeyEvent;
'did-context-menu': { clientX: number; clientY: number; context: { [key: string]: unknown } };
'drag-start': void;
'drag': WebViewDragEvent
};

interface UpdateContentEvent {
Expand Down
26 changes: 24 additions & 2 deletions src/vs/workbench/contrib/webview/browser/webviewWindowDragMonitor.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,19 +18,41 @@ export class WebviewWindowDragMonitor extends Disposable {
constructor(targetWindow: CodeWindow, getWebview: () => IWebview | undefined) {
super();

this._register(DOM.addDisposableListener(targetWindow, DOM.EventType.DRAG_START, () => {
const onDragStart = () => {
getWebview()?.windowDidDragStart();
}));
};

const onDragEnd = () => {
getWebview()?.windowDidDragEnd();
};

this._register(DOM.addDisposableListener(targetWindow, DOM.EventType.DRAG_START, () => {
onDragStart();
}));

this._register(DOM.addDisposableListener(targetWindow, DOM.EventType.DRAG_END, onDragEnd));

this._register(DOM.addDisposableListener(targetWindow, DOM.EventType.MOUSE_MOVE, currentEvent => {
if (currentEvent.buttons === 0) {
onDragEnd();
}
}));

this._register(DOM.addDisposableListener(targetWindow, DOM.EventType.DRAG, (event) => {
if (event.shiftKey) {
onDragEnd();
} else {
onDragStart();
}
}));

this._register(DOM.addDisposableListener(targetWindow, DOM.EventType.DRAG_OVER, (event) => {
if (event.shiftKey) {
onDragEnd();
} else {
onDragStart();
}
}));

}
}

0 comments on commit 51917e8

Please sign in to comment.