Add option for disabling overflowing widgets in the editor (microsoft#256123)

Author: alexdima

src/vs/editor/browser/viewParts/contentWidgets/contentWidgets.ts

@@ -215,14 +215,15 @@ class Widget {
 		this._viewDomNode = viewDomNode;
 		this._actual = actual;
 
+		const options = this._context.configuration.options;
+		const layoutInfo = options.get(EditorOption.layoutInfo);
+		const allowOverflow = options.get(EditorOption.allowOverflow);
+
 		this.domNode = createFastDomNode(this._actual.getDomNode());
 		this.id = this._actual.getId();
-		this.allowEditorOverflow = this._actual.allowEditorOverflow || false;
+		this.allowEditorOverflow = (this._actual.allowEditorOverflow || false) && allowOverflow;
 		this.suppressMouseDown = this._actual.suppressMouseDown || false;
 
-		const options = this._context.configuration.options;
-		const layoutInfo = options.get(EditorOption.layoutInfo);
-
 		this._fixedOverflowWidgets = options.get(EditorOption.fixedOverflowWidgets);
 		this._contentWidth = layoutInfo.contentWidth;
 		this._contentLeft = layoutInfo.contentLeft;

src/vs/editor/browser/viewParts/overlayWidgets/overlayWidgets.ts

@@ -92,6 +92,12 @@ export class ViewOverlayWidgets extends ViewPart {
 
 	// ---- end view event handlers
 
+	private _widgetCanOverflow(widget: IOverlayWidget): boolean {
+		const options = this._context.configuration.options;
+		const allowOverflow = options.get(EditorOption.allowOverflow);
+		return (widget.allowEditorOverflow || false) && allowOverflow;
+	}
+
 	public addWidget(widget: IOverlayWidget): void {
 		const domNode = createFastDomNode(widget.getDomNode());
 
@@ -105,7 +111,7 @@ export class ViewOverlayWidgets extends ViewPart {
 		domNode.setPosition('absolute');
 		domNode.setAttribute('widgetId', widget.getId());
 
-		if (widget.allowEditorOverflow) {
+		if (this._widgetCanOverflow(widget)) {
 			this.overflowingOverlayWidgetsDomNode.appendChild(domNode);
 		} else {
 			this._domNode.appendChild(domNode);
@@ -193,7 +199,7 @@ export class ViewOverlayWidgets extends ViewPart {
 		} else {
 			const { top, left } = widgetData.preference;
 			const fixedOverflowWidgets = this._context.configuration.options.get(EditorOption.fixedOverflowWidgets);
-			if (fixedOverflowWidgets && widgetData.widget.allowEditorOverflow) {
+			if (fixedOverflowWidgets && this._widgetCanOverflow(widgetData.widget)) {
 				// top, left are computed relative to the editor and we need them relative to the page
 				const editorBoundingBox = this._viewDomNodeRect;
 				domNode.setTop(top + editorBoundingBox.top);

src/vs/editor/common/config/editorOptions.ts

@@ -219,6 +219,11 @@ export interface IEditorOptions {
 	 * Defaults to `false`.
 	 */
 	fixedOverflowWidgets?: boolean;
+	/**
+	 * Allow content widgets and overflow widgets to overflow the editor viewport.
+	 * Defaults to `true`.
+	 */
+	allowOverflow?: boolean;
 	/**
 	 * The number of vertical lanes the overview ruler should render.
 	 * Defaults to 3.
@@ -5577,6 +5582,7 @@ export const enum EditorOption {
 	acceptSuggestionOnEnter,
 	accessibilitySupport,
 	accessibilityPageSize,
+	allowOverflow,
 	allowVariableLineHeights,
 	allowVariableFonts,
 	allowVariableFontsInAccessibilityMode,
@@ -5767,7 +5773,11 @@ export const EditorOptions = {
 		{
 			description: nls.localize('accessibilityPageSize', "Controls the number of lines in the editor that can be read out by a screen reader at once. When we detect a screen reader we automatically set the default to be 500. Warning: this has a performance implication for numbers larger than the default."),
 			tags: ['accessibility']
-		})),
+		}
+	)),
+	allowOverflow: register(new EditorBooleanOption(
+		EditorOption.allowOverflow, 'allowOverflow', true,
+	)),
 	allowVariableLineHeights: register(new EditorBooleanOption(
 		EditorOption.allowVariableLineHeights, 'allowVariableLineHeights', true,
 		{