@theia/monaco 1.77.0-next.0 → 1.77.0-next.101

package/src/browser/monaco-diff-editor.ts

@@ -17,24 +17,24 @@
 import URI from '@theia/core/lib/common/uri';
 import { Disposable } from '@theia/core/lib/common';
 import { Dimension, DiffNavigator, DeltaDecorationParams } from '@theia/editor/lib/browser';
-import { MonacoEditorModel } from './monaco-editor-model';
-import { EditorServiceOverrides, MonacoEditor, MonacoEditorServices } from './monaco-editor';
-import { MonacoDiffNavigatorFactory } from './monaco-diff-navigator-factory';
+import { MonacoEditorModel } from './monaco-editor-model.js';
+import { EditorServiceOverrides, MonacoEditor, MonacoEditorServices } from './monaco-editor.js';
+import { MonacoDiffNavigatorFactory } from './monaco-diff-navigator-factory.js';
 import { DiffUris } from '@theia/core/lib/browser/diff-uris';
 import * as monaco from '@theia/monaco-editor-core';
-import { ICodeEditor, IDiffEditorConstructionOptions } from '@theia/monaco-editor-core/esm/vs/editor/browser/editorBrowser';
+import { ICodeEditor, IDiffEditorConstructionOptions } from '@theia/monaco-editor-core/esm/vs/editor/browser/editorBrowser.js';
 import { IActionDescriptor, IStandaloneCodeEditor, IStandaloneDiffEditor, StandaloneCodeEditor, StandaloneDiffEditor2 }
-    from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneCodeEditor';
-import { IEditorConstructionOptions } from '@theia/monaco-editor-core/esm/vs/editor/browser/config/editorConfiguration';
-import { ICodeEditorWidgetOptions } from '@theia/monaco-editor-core/esm/vs/editor/browser/widget/codeEditor/codeEditorWidget';
-import { EmbeddedDiffEditorWidget } from '@theia/monaco-editor-core/esm/vs/editor/browser/widget/diffEditor/embeddedDiffEditorWidget';
-import { IInstantiationService } from '@theia/monaco-editor-core/esm/vs/platform/instantiation/common/instantiation';
-import { ContextKeyValue, IContextKey } from '@theia/monaco-editor-core/esm/vs/platform/contextkey/common/contextkey';
-import { IDisposable } from '@theia/monaco-editor-core/esm/vs/base/common/lifecycle';
-import { ICommandHandler } from '@theia/monaco-editor-core/esm/vs/platform/commands/common/commands';
-import { EditorContextKeys } from '@theia/monaco-editor-core/esm/vs/editor/common/editorContextKeys';
-import { IEditorOptions } from '@theia/monaco-editor-core/esm/vs/editor/common/config/editorOptions';
-import { ILineChange } from '@theia/monaco-editor-core/esm/vs/editor/common/diff/legacyLinesDiffComputer';
+    from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneCodeEditor.js';
+import { IEditorConstructionOptions } from '@theia/monaco-editor-core/esm/vs/editor/browser/config/editorConfiguration.js';
+import { ICodeEditorWidgetOptions } from '@theia/monaco-editor-core/esm/vs/editor/browser/widget/codeEditor/codeEditorWidget.js';
+import { EmbeddedDiffEditorWidget } from '@theia/monaco-editor-core/esm/vs/editor/browser/widget/diffEditor/embeddedDiffEditorWidget.js';
+import { IInstantiationService } from '@theia/monaco-editor-core/esm/vs/platform/instantiation/common/instantiation.js';
+import { ContextKeyValue, IContextKey } from '@theia/monaco-editor-core/esm/vs/platform/contextkey/common/contextkey.js';
+import { IDisposable } from '@theia/monaco-editor-core/esm/vs/base/common/lifecycle.js';
+import { ICommandHandler } from '@theia/monaco-editor-core/esm/vs/platform/commands/common/commands.js';
+import { EditorContextKeys } from '@theia/monaco-editor-core/esm/vs/editor/common/editorContextKeys.js';
+import { IEditorOptions } from '@theia/monaco-editor-core/esm/vs/editor/common/config/editorOptions.js';
+import { ILineChange } from '@theia/monaco-editor-core/esm/vs/editor/common/diff/legacyLinesDiffComputer.js';
 
 export namespace MonacoDiffEditor {
     export interface IOptions extends MonacoEditor.ICommonOptions, IDiffEditorConstructionOptions {
@@ -126,7 +126,7 @@ export class MonacoDiffEditor extends MonacoEditor {
     }
 
     override handleVisibilityChanged(nowVisible: boolean): void {
-        const isFirstShow = nowVisible && !this.savedViewState;
+        const isFirstShow = nowVisible && this.detachModelOnHide && !this.savedViewState;
         super.handleVisibilityChanged(nowVisible);
         if (isFirstShow) {
             this._diffEditor.revealFirstDiff();

package/src/browser/monaco-diff-navigator-factory.ts

@@ -16,7 +16,7 @@
 
 import { injectable } from '@theia/core/shared/inversify';
 import { DiffNavigator } from '@theia/editor/lib/browser';
-import { IDiffEditor } from '@theia/monaco-editor-core/esm/vs/editor/browser/editorBrowser';
+import { IDiffEditor } from '@theia/monaco-editor-core/esm/vs/editor/browser/editorBrowser.js';
 
 @injectable()
 export class MonacoDiffNavigatorFactory {

package/src/browser/monaco-editor-content-menu.ts

@@ -20,11 +20,11 @@ import { ObservableFromEvent, ObservableUtils } from '@theia/core/lib/common/obs
 import { FrontendApplicationContribution } from '@theia/core/lib/browser';
 import { Context } from '@theia/core/lib/browser/context-key-service';
 import { EditorManager, EDITOR_CONTENT_MENU, EditorWidget } from '@theia/editor/lib/browser';
-import { ICodeEditor } from '@theia/monaco-editor-core/esm/vs/editor/browser/editorBrowser';
-import { IContextKeyService } from '@theia/monaco-editor-core/esm/vs/platform/contextkey/common/contextkey';
-import { MonacoContextKeyService } from './monaco-context-key-service';
-import { MonacoEditor } from './monaco-editor';
-import { MonacoEditorOverlayButton } from './monaco-editor-overlay-button';
+import { ICodeEditor } from '@theia/monaco-editor-core/esm/vs/editor/browser/editorBrowser.js';
+import { IContextKeyService } from '@theia/monaco-editor-core/esm/vs/platform/contextkey/common/contextkey.js';
+import { MonacoContextKeyService } from './monaco-context-key-service.js';
+import { MonacoEditor } from './monaco-editor.js';
+import { MonacoEditorOverlayButton } from './monaco-editor-overlay-button.js';
 
 /**
  * Implements {@link EDITOR_CONTENT_MENU} for {@link MonacoEditor}s.

package/src/browser/monaco-editor-model.ts

@@ -21,16 +21,16 @@ import { Emitter, Event } from '@theia/core/lib/common/event';
 import { CancellationTokenSource, CancellationToken } from '@theia/core/lib/common/cancellation';
 import { Resource, ResourceError, ResourceVersion } from '@theia/core/lib/common/resource';
 import { Saveable, SaveOptions, SaveReason } from '@theia/core/lib/browser/saveable';
-import { MonacoToProtocolConverter } from './monaco-to-protocol-converter';
-import { ProtocolToMonacoConverter } from './protocol-to-monaco-converter';
+import { MonacoToProtocolConverter } from './monaco-to-protocol-converter.js';
+import { ProtocolToMonacoConverter } from './protocol-to-monaco-converter.js';
 import { ILogger, Loggable, Log } from '@theia/core/lib/common/logger';
-import { ITextBufferFactory, ITextModel, ITextSnapshot } from '@theia/monaco-editor-core/esm/vs/editor/common/model';
-import { IResolvedTextEditorModel } from '@theia/monaco-editor-core/esm/vs/editor/common/services/resolverService';
+import { ITextBufferFactory, ITextModel, ITextSnapshot } from '@theia/monaco-editor-core/esm/vs/editor/common/model.js';
+import { IResolvedTextEditorModel } from '@theia/monaco-editor-core/esm/vs/editor/common/services/resolverService.js';
 import * as monaco from '@theia/monaco-editor-core';
-import { StandaloneServices } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneServices';
-import { ILanguageService } from '@theia/monaco-editor-core/esm/vs/editor/common/languages/language';
-import { IModelService } from '@theia/monaco-editor-core/esm/vs/editor/common/services/model';
-import { createTextBufferFactoryFromStream } from '@theia/monaco-editor-core/esm/vs/editor/common/model/textModel';
+import { StandaloneServices } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneServices.js';
+import { ILanguageService } from '@theia/monaco-editor-core/esm/vs/editor/common/languages/language.js';
+import { IModelService } from '@theia/monaco-editor-core/esm/vs/editor/common/services/model.js';
+import { createTextBufferFactoryFromStream } from '@theia/monaco-editor-core/esm/vs/editor/common/model/textModel.js';
 import { editorGeneratedPreferenceProperties } from '@theia/editor/lib/common/editor-generated-preference-schema';
 import { MarkdownString } from '@theia/core/lib/common/markdown-rendering';
 import { BinaryBuffer } from '@theia/core/lib/common/buffer';

package/src/browser/monaco-editor-overlay-button.ts

@@ -17,7 +17,7 @@
 import { Disposable, DisposableCollection, Emitter } from '@theia/core';
 import { DISABLED_CLASS, onDomEvent } from '@theia/core/lib/browser';
 import * as monaco from '@theia/monaco-editor-core';
-import { MonacoEditor } from './monaco-editor';
+import { MonacoEditor } from './monaco-editor.js';
 
 export class MonacoEditorOverlayButton implements Disposable {
 

package/src/browser/monaco-editor-peek-view-widget.ts

@@ -16,19 +16,19 @@
 
 import { Position, Range } from '@theia/core/shared/vscode-languageserver-protocol';
 import { DisposableCollection } from '@theia/core';
-import { MonacoEditor } from './monaco-editor';
+import { MonacoEditor } from './monaco-editor.js';
 import * as monaco from '@theia/monaco-editor-core';
-import { PeekViewWidget, IPeekViewOptions, IPeekViewStyles } from '@theia/monaco-editor-core/esm/vs/editor/contrib/peekView/browser/peekView';
-import { ICodeEditor } from '@theia/monaco-editor-core/esm/vs/editor/browser/editorBrowser';
-import { ActionBar } from '@theia/monaco-editor-core/esm/vs/base/browser/ui/actionbar/actionbar';
-import { Action } from '@theia/monaco-editor-core/esm/vs/base/common/actions';
-import { StandaloneServices } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneServices';
-import { IInstantiationService } from '@theia/monaco-editor-core/esm/vs/platform/instantiation/common/instantiation';
-import { IThemeService } from '@theia/monaco-editor-core/esm/vs/platform/theme/common/themeService';
-import { Color } from '@theia/monaco-editor-core/esm/vs/base/common/color';
+import { PeekViewWidget, IPeekViewOptions, IPeekViewStyles } from '@theia/monaco-editor-core/esm/vs/editor/contrib/peekView/browser/peekView.js';
+import { ICodeEditor } from '@theia/monaco-editor-core/esm/vs/editor/browser/editorBrowser.js';
+import { ActionBar } from '@theia/monaco-editor-core/esm/vs/base/browser/ui/actionbar/actionbar.js';
+import { Action } from '@theia/monaco-editor-core/esm/vs/base/common/actions.js';
+import { StandaloneServices } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneServices.js';
+import { IInstantiationService } from '@theia/monaco-editor-core/esm/vs/platform/instantiation/common/instantiation.js';
+import { IThemeService } from '@theia/monaco-editor-core/esm/vs/platform/theme/common/themeService.js';
+import { Color } from '@theia/monaco-editor-core/esm/vs/base/common/color.js';
 
 export { peekViewBorder, peekViewTitleBackground, peekViewTitleForeground, peekViewTitleInfoForeground }
-    from '@theia/monaco-editor-core/esm/vs/editor/contrib/peekView/browser/peekView';
+    from '@theia/monaco-editor-core/esm/vs/editor/contrib/peekView/browser/peekView.js';
 
 export namespace MonacoEditorPeekViewWidget {
     export interface Styles {

package/src/browser/monaco-editor-provider.ts

@@ -20,33 +20,33 @@ import { TextEditor, DiffNavigator } from '@theia/editor/lib/browser';
 import { DiffUris } from '@theia/core/lib/browser/diff-uris';
 import { inject, injectable, named, postConstruct } from '@theia/core/shared/inversify';
 import { DisposableCollection, deepClone, Disposable, CancellationToken } from '@theia/core/lib/common';
-import { MonacoDiffEditor } from './monaco-diff-editor';
-import { MonacoDiffNavigatorFactory } from './monaco-diff-navigator-factory';
-import { EditorServiceOverrides, MonacoEditor, MonacoEditorServices } from './monaco-editor';
-import { MonacoEditorModel, TextDocumentSaveReason } from './monaco-editor-model';
-import { MonacoWorkspace } from './monaco-workspace';
+import { MonacoDiffEditor } from './monaco-diff-editor.js';
+import { MonacoDiffNavigatorFactory } from './monaco-diff-navigator-factory.js';
+import { EditorServiceOverrides, MonacoEditor, MonacoEditorServices } from './monaco-editor.js';
+import { MonacoEditorModel, TextDocumentSaveReason } from './monaco-editor-model.js';
+import { MonacoWorkspace } from './monaco-workspace.js';
 import { ContributionProvider, ILogger } from '@theia/core';
 import { KeybindingRegistry, OpenerService, open, WidgetOpenerOptions, SaveOptions, FormatType } from '@theia/core/lib/browser';
-import { MonacoResolvedKeybinding } from './monaco-resolved-keybinding';
+import { MonacoResolvedKeybinding } from './monaco-resolved-keybinding.js';
 import { HttpOpenHandlerOptions } from '@theia/core/lib/browser/http-open-handler';
-import { MonacoToProtocolConverter } from './monaco-to-protocol-converter';
-import { ProtocolToMonacoConverter } from './protocol-to-monaco-converter';
+import { MonacoToProtocolConverter } from './monaco-to-protocol-converter.js';
+import { ProtocolToMonacoConverter } from './protocol-to-monaco-converter.js';
 import * as monaco from '@theia/monaco-editor-core';
-import { StandaloneServices } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneServices';
-import { IOpenerService, OpenExternalOptions, OpenInternalOptions } from '@theia/monaco-editor-core/esm/vs/platform/opener/common/opener';
-import { IKeybindingService } from '@theia/monaco-editor-core/esm/vs/platform/keybinding/common/keybinding';
-import { IContextMenuService } from '@theia/monaco-editor-core/esm/vs/platform/contextview/browser/contextView';
-import { Event } from '@theia/monaco-editor-core/esm/vs/base/common/event';
-import { KeyCodeChord } from '@theia/monaco-editor-core/esm/vs/base/common/keybindings';
-import { IContextKeyService } from '@theia/monaco-editor-core/esm/vs/platform/contextkey/common/contextkey';
-import { ITextModelService } from '@theia/monaco-editor-core/esm/vs/editor/common/services/resolverService';
-import { IReference } from '@theia/monaco-editor-core/esm/vs/base/common/lifecycle';
+import { StandaloneServices } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneServices.js';
+import { IOpenerService, OpenExternalOptions, OpenInternalOptions } from '@theia/monaco-editor-core/esm/vs/platform/opener/common/opener.js';
+import { IKeybindingService } from '@theia/monaco-editor-core/esm/vs/platform/keybinding/common/keybinding.js';
+import { IContextMenuService } from '@theia/monaco-editor-core/esm/vs/platform/contextview/browser/contextView.js';
+import { Event } from '@theia/monaco-editor-core/esm/vs/base/common/event.js';
+import { KeyCodeChord } from '@theia/monaco-editor-core/esm/vs/base/common/keybindings.js';
+import { IContextKeyService } from '@theia/monaco-editor-core/esm/vs/platform/contextkey/common/contextkey.js';
+import { ITextModelService } from '@theia/monaco-editor-core/esm/vs/editor/common/services/resolverService.js';
+import { IReference } from '@theia/monaco-editor-core/esm/vs/base/common/lifecycle.js';
 import { MarkdownString } from '@theia/core/lib/common/markdown-rendering';
-import { SimpleMonacoEditor } from './simple-monaco-editor';
-import { ICodeEditorWidgetOptions } from '@theia/monaco-editor-core/esm/vs/editor/browser/widget/codeEditor/codeEditorWidget';
+import { SimpleMonacoEditor } from './simple-monaco-editor.js';
+import { ICodeEditorWidgetOptions } from '@theia/monaco-editor-core/esm/vs/editor/browser/widget/codeEditor/codeEditorWidget.js';
 import { timeoutReject } from '@theia/core/lib/common/promise-util';
 import { FileSystemPreferences } from '@theia/filesystem/lib/common';
-import { insertFinalNewline } from './monaco-utilities';
+import { insertFinalNewline } from './monaco-utilities.js';
 import { EditorPreferenceChange, EditorPreferences } from '@theia/editor/lib/common/editor-preferences';
 
 export const MonacoEditorFactory = Symbol('MonacoEditorFactory');
@@ -311,7 +311,7 @@ export class MonacoEditorProvider {
     protected createOptions(prefixes: string[], uri: string, overrideIdentifier?: string): Record<string, any> {
         const flat: Record<string, any> = {};
         for (const preferenceName of Object.keys(this.editorPreferences)) {
-            flat[preferenceName] = (<any>this.editorPreferences).get({ preferenceName, overrideIdentifier }, undefined, uri);
+            flat[preferenceName] = (this.editorPreferences as any).get({ preferenceName, overrideIdentifier }, undefined, uri);
         }
         return Object.entries(flat).reduce((tree, [preferenceName, value]) => this.setOption(preferenceName, deepClone(value), prefixes, tree), {});
     }

package/src/browser/monaco-editor-service.ts

@@ -18,15 +18,15 @@ import { injectable, inject, decorate, named } from '@theia/core/shared/inversif
 import URI from '@theia/core/lib/common/uri';
 import { OpenerService, open, WidgetOpenMode, ApplicationShell } from '@theia/core/lib/browser';
 import { EditorWidget, EditorOpenerOptions, EditorManager, CustomEditorWidget } from '@theia/editor/lib/browser';
-import { MonacoEditor } from './monaco-editor';
-import { MonacoToProtocolConverter } from './monaco-to-protocol-converter';
-import { MonacoEditorModel } from './monaco-editor-model';
-import { IResourceEditorInput, ITextResourceEditorInput } from '@theia/monaco-editor-core/esm/vs/platform/editor/common/editor';
-import { StandaloneCodeEditorService } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneCodeEditorService';
-import { StandaloneCodeEditor } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneCodeEditor';
-import { ICodeEditor } from '@theia/monaco-editor-core/esm/vs/editor/browser/editorBrowser';
-import { IContextKeyService } from '@theia/monaco-editor-core/esm/vs/platform/contextkey/common/contextkey';
-import { IThemeService } from '@theia/monaco-editor-core/esm/vs/platform/theme/common/themeService';
+import { MonacoEditor } from './monaco-editor.js';
+import { MonacoToProtocolConverter } from './monaco-to-protocol-converter.js';
+import { MonacoEditorModel } from './monaco-editor-model.js';
+import { IResourceEditorInput, ITextResourceEditorInput } from '@theia/monaco-editor-core/esm/vs/platform/editor/common/editor.js';
+import { StandaloneCodeEditorService } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneCodeEditorService.js';
+import { StandaloneCodeEditor } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneCodeEditor.js';
+import { ICodeEditor } from '@theia/monaco-editor-core/esm/vs/editor/browser/editorBrowser.js';
+import { IContextKeyService } from '@theia/monaco-editor-core/esm/vs/platform/contextkey/common/contextkey.js';
+import { IThemeService } from '@theia/monaco-editor-core/esm/vs/platform/theme/common/themeService.js';
 import { ContributionProvider, PreferenceService } from '@theia/core';
 
 decorate(injectable(), StandaloneCodeEditorService);

package/src/browser/monaco-editor.spec.ts

@@ -0,0 +1,227 @@
+// *****************************************************************************
+// Copyright (C) 2026 EclipseSource and others.
+//
+// This program and the accompanying materials are made available under the
+// terms of the Eclipse Public License v. 2.0 which is available at
+// http://www.eclipse.org/legal/epl-2.0.
+//
+// This Source Code may also be made available under the following Secondary
+// Licenses when the conditions for such availability set forth in the Eclipse
+// Public License v. 2.0 are satisfied: GNU General Public License, version 2
+// with the GNU Classpath Exception which is available at
+// https://www.gnu.org/software/classpath/license.html.
+//
+// SPDX-License-Identifier: EPL-2.0 OR GPL-2.0-only WITH Classpath-exception-2.0
+// *****************************************************************************
+
+import { enableJSDOM } from '@theia/core/lib/browser/test/jsdom';
+let disableJSDOM = enableJSDOM();
+
+import { expect } from 'chai';
+import * as sinon from 'sinon';
+import { Disposable, Event } from '@theia/core/lib/common';
+import URI from '@theia/core/lib/common/uri';
+import { StandaloneServices } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneServices.js';
+import { IInstantiationService } from '@theia/monaco-editor-core/esm/vs/platform/instantiation/common/instantiation.js';
+import type { MonacoEditor as MonacoEditorType, MonacoEditorServices } from './monaco-editor.js';
+import type { MonacoEditorModel } from './monaco-editor-model.js';
+import type { MonacoDiffEditor as MonacoDiffEditorType } from './monaco-diff-editor.js';
+import type { MonacoToProtocolConverter as MonacoToProtocolConverterType } from './monaco-to-protocol-converter.js';
+import type { ProtocolToMonacoConverter as ProtocolToMonacoConverterType } from './protocol-to-monaco-converter.js';
+
+disableJSDOM();
+
+describe('MonacoEditor visibility', () => {
+    let MonacoEditor: typeof MonacoEditorType;
+    let MonacoDiffEditor: typeof MonacoDiffEditorType;
+    let MonacoToProtocolConverter: typeof MonacoToProtocolConverterType;
+    let ProtocolToMonacoConverter: typeof ProtocolToMonacoConverterType;
+
+    before(async () => {
+        disableJSDOM = enableJSDOM();
+        // Initialize baseline services before editor imports register additional services requiring browser CSS globals.
+        StandaloneServices.get(IInstantiationService);
+        ({ MonacoEditor } = await import('./monaco-editor.js'));
+        ({ MonacoDiffEditor } = await import('./monaco-diff-editor.js'));
+        ({ MonacoToProtocolConverter } = await import('./monaco-to-protocol-converter.js'));
+        ({ ProtocolToMonacoConverter } = await import('./protocol-to-monaco-converter.js'));
+    });
+    after(() => disableJSDOM());
+
+    const model = {
+        validatePosition: (position: object) => position,
+        getLineContent: () => '\tfoo',
+        getOptions: () => ({ tabSize: 4 })
+    };
+    const viewState = {
+        cursorState: [{ inSelectionMode: false, selectionStart: { lineNumber: 1, column: 3 }, position: { lineNumber: 1, column: 3 } }]
+    };
+    let editor: MonacoEditorType;
+    let control: ReturnType<typeof createControl>;
+
+    const createControl = (initiallyAttached = true) => {
+        let currentModel: object | undefined = initiallyAttached ? model : undefined;
+        return {
+            createContextKey: sinon.spy(),
+            setModel: sinon.spy((value: object | undefined) => currentModel = value),
+            getModel: () => currentModel,
+            getPosition: () => currentModel ? { lineNumber: 1, column: 1 } : undefined,
+            getVisibleColumnFromPosition: sinon.stub().returns(1),
+            saveViewState: sinon.stub().returns(viewState),
+            restoreViewState: sinon.spy(),
+            focus: sinon.spy(),
+            render: sinon.spy()
+        };
+    };
+
+    beforeEach(() => {
+        control = createControl();
+        editor = new class extends MonacoEditor {
+            constructor() {
+                super(new URI('file:///test.ts'), {
+                    textEditorModel: model,
+                    onDidChangeReadOnly: Event.None,
+                    onDidChangeEncoding: Event.None
+                } as unknown as MonacoEditorModel, document.createElement('div'), {
+                    m2p: new MonacoToProtocolConverter(),
+                    p2m: new ProtocolToMonacoConverter()
+                } as unknown as MonacoEditorServices);
+            }
+
+            protected override create(): Disposable {
+                this.editor = control as unknown as typeof this.editor;
+                return Disposable.NULL;
+            }
+
+            protected override addHandlers(): void { }
+        }();
+    });
+    afterEach(() => editor.dispose());
+
+    it('should detach on hide and restore the model and view state without focusing on show', () => {
+        expect(editor.detachModelOnHide).to.be.true;
+        editor.handleVisibilityChanged(false);
+        expect(control.saveViewState.calledOnce).to.be.true;
+        expect(control.setModel.calledOnce).to.be.true;
+        expect(control.getModel()).to.not.exist;
+        expect(control.focus.called).to.be.false;
+
+        editor.handleVisibilityChanged(true);
+        expect(control.setModel.secondCall.calledWithExactly(model)).to.be.true;
+        expect(control.restoreViewState.calledOnceWithExactly(viewState)).to.be.true;
+        expect(control.focus.called).to.be.false;
+        expect(control.setModel.secondCall.calledBefore(control.restoreViewState.firstCall)).to.be.true;
+    });
+
+    it('should read the cursor and its visible column from the saved view state and the document while hidden', () => {
+        editor.handleVisibilityChanged(false);
+        const cursor = editor.cursor;
+        expect(cursor).to.deep.equal({ line: 0, character: 2 });
+        // the tab before the cursor takes up 4 columns
+        expect(editor.getVisibleColumn(cursor)).to.equal(6);
+        expect(control.getVisibleColumnFromPosition.called).to.be.false;
+    });
+
+    it('should retain the model and view state without focusing when opting out', () => {
+        editor.detachModelOnHide = false;
+        for (let index = 0; index < 2; index++) {
+            editor.handleVisibilityChanged(false);
+            expect(control.getModel()).to.equal(model);
+            editor.handleVisibilityChanged(true);
+        }
+        expect(control.setModel.called).to.be.false;
+        expect(control.saveViewState.called).to.be.false;
+        expect(control.restoreViewState.called).to.be.false;
+        expect(control.focus.called).to.be.false;
+    });
+
+    it('should stage and unstage a hidden editor for preview without focusing it', () => {
+        editor.handleVisibilityChanged(false);
+        editor.stageForPreview();
+        expect(control.getModel()).to.equal(model);
+        expect(control.restoreViewState.calledOnceWithExactly(viewState)).to.be.true;
+        expect(control.render.calledOnceWithExactly(true)).to.be.true;
+        editor.unstagePreview();
+        expect(control.getModel()).to.not.exist;
+        expect(control.saveViewState.calledTwice).to.be.true;
+        expect(control.focus.called).to.be.false;
+    });
+
+    it('should keep the model attached when showing an editor staged for preview', () => {
+        editor.handleVisibilityChanged(false);
+        editor.stageForPreview();
+        editor.handleVisibilityChanged(true);
+        editor.unstagePreview();
+        expect(control.getModel()).to.equal(model);
+        expect(control.setModel.callCount).to.equal(3);
+        expect(control.focus.called).to.be.false;
+    });
+
+    it('should not stage or unstage an attached model when opting out', () => {
+        editor.detachModelOnHide = false;
+        editor.handleVisibilityChanged(false);
+        editor.stageForPreview();
+        editor.unstagePreview();
+        expect(control.getModel()).to.equal(model);
+        expect(control.setModel.called).to.be.false;
+        expect(control.saveViewState.called).to.be.false;
+        expect(control.restoreViewState.called).to.be.false;
+        expect(control.render.called).to.be.false;
+    });
+
+    it('should reveal the first diff only on the initial show by default', () => {
+        const diffControl = { ...control, revealFirstDiff: sinon.spy() };
+        const diffEditor = Object.assign(Object.create(MonacoDiffEditor.prototype) as MonacoDiffEditorType, {
+            _diffEditor: diffControl,
+            diffEditorModel: model,
+            detachModelOnHide: true
+        });
+        diffEditor.handleVisibilityChanged(true);
+        expect(diffControl.revealFirstDiff.calledOnce).to.be.true;
+        diffEditor.handleVisibilityChanged(false);
+        diffEditor.handleVisibilityChanged(true);
+        expect(diffControl.revealFirstDiff.calledOnce).to.be.true;
+        expect(control.setModel.callCount).to.equal(3);
+        expect(control.restoreViewState.secondCall.calledWithExactly(viewState)).to.be.true;
+    });
+
+    it('should initially attach a model-less diff editor without focusing when opting out', () => {
+        const diffControl = { ...createControl(false), revealFirstDiff: sinon.spy() };
+        const diffEditor = Object.assign(Object.create(MonacoDiffEditor.prototype) as MonacoDiffEditorType, {
+            _diffEditor: diffControl,
+            diffEditorModel: model,
+            detachModelOnHide: false
+        });
+        expect(diffControl.getModel()).to.be.undefined;
+        diffEditor.handleVisibilityChanged(true);
+        expect(diffControl.getModel()).to.equal(model);
+        expect(diffControl.setModel.calledOnceWithExactly(model)).to.be.true;
+
+        for (let index = 0; index < 2; index++) {
+            diffEditor.handleVisibilityChanged(false);
+            expect(diffControl.getModel()).to.equal(model);
+            diffEditor.handleVisibilityChanged(true);
+        }
+        expect(diffControl.setModel.calledOnceWithExactly(model)).to.be.true;
+        expect(diffControl.saveViewState.called).to.be.false;
+        expect(diffControl.restoreViewState.called).to.be.false;
+        expect(diffControl.revealFirstDiff.called).to.be.false;
+        expect(diffControl.focus.called).to.be.false;
+    });
+
+    it('should not reveal the first diff on each show when opting out', () => {
+        const diffControl = { ...control, revealFirstDiff: sinon.spy() };
+        const diffEditor = Object.assign(Object.create(MonacoDiffEditor.prototype) as MonacoDiffEditorType, {
+            _diffEditor: diffControl,
+            diffEditorModel: model,
+            detachModelOnHide: false
+        });
+        diffEditor.handleVisibilityChanged(false);
+        diffEditor.handleVisibilityChanged(true);
+        diffEditor.handleVisibilityChanged(false);
+        diffEditor.handleVisibilityChanged(true);
+        expect(diffControl.revealFirstDiff.called).to.be.false;
+        expect(control.setModel.called).to.be.false;
+        expect(control.restoreViewState.called).to.be.false;
+    });
+});

package/src/browser/monaco-editor.ts

@@ -38,35 +38,36 @@ import {
     EditorDecorationOptions,
     MouseTargetType
 } from '@theia/editor/lib/browser';
-import { MonacoEditorModel } from './monaco-editor-model';
-import { MonacoToProtocolConverter } from './monaco-to-protocol-converter';
-import { ProtocolToMonacoConverter } from './protocol-to-monaco-converter';
+import { MonacoEditorModel } from './monaco-editor-model.js';
+import { MonacoToProtocolConverter } from './monaco-to-protocol-converter.js';
+import { ProtocolToMonacoConverter } from './protocol-to-monaco-converter.js';
 import { TextEdit } from '@theia/core/shared/vscode-languageserver-protocol';
 import { UTF8 } from '@theia/core/lib/common/encodings';
 import * as monaco from '@theia/monaco-editor-core';
-import { StandaloneServices } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneServices';
-import { ILanguageService } from '@theia/monaco-editor-core/esm/vs/editor/common/languages/language';
-import { IInstantiationService, ServiceIdentifier } from '@theia/monaco-editor-core/esm/vs/platform/instantiation/common/instantiation';
-import { ICodeEditor, IMouseTargetMargin } from '@theia/monaco-editor-core/esm/vs/editor/browser/editorBrowser';
-import { IStandaloneEditorConstructionOptions, StandaloneCodeEditor, StandaloneEditor } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneCodeEditor';
-import { ServiceCollection } from '@theia/monaco-editor-core/esm/vs/platform/instantiation/common/serviceCollection';
+import { StandaloneServices } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneServices.js';
+import { ILanguageService } from '@theia/monaco-editor-core/esm/vs/editor/common/languages/language.js';
+import { IInstantiationService, ServiceIdentifier } from '@theia/monaco-editor-core/esm/vs/platform/instantiation/common/instantiation.js';
+import { ICodeEditor, IMouseTargetMargin } from '@theia/monaco-editor-core/esm/vs/editor/browser/editorBrowser.js';
+import { IStandaloneEditorConstructionOptions, StandaloneCodeEditor, StandaloneEditor } from '@theia/monaco-editor-core/esm/vs/editor/standalone/browser/standaloneCodeEditor.js';
+import { ServiceCollection } from '@theia/monaco-editor-core/esm/vs/platform/instantiation/common/serviceCollection.js';
 import { MarkdownString } from '@theia/core/lib/common/markdown-rendering';
-import { ConfigurationChangedEvent, IEditorOptions, ShowLightbulbIconMode } from '@theia/monaco-editor-core/esm/vs/editor/common/config/editorOptions';
-import { ICodeEditorService } from '@theia/monaco-editor-core/esm/vs/editor/browser/services/codeEditorService';
-import { ICommandService } from '@theia/monaco-editor-core/esm/vs/platform/commands/common/commands';
-import { IContextKeyService } from '@theia/monaco-editor-core/esm/vs/platform/contextkey/common/contextkey';
-import { IKeybindingService } from '@theia/monaco-editor-core/esm/vs/platform/keybinding/common/keybinding';
-import { IThemeService } from '@theia/monaco-editor-core/esm/vs/platform/theme/common/themeService';
-import { INotificationService } from '@theia/monaco-editor-core/esm/vs/platform/notification/common/notification';
-import { IAccessibilityService } from '@theia/monaco-editor-core/esm/vs/platform/accessibility/common/accessibility';
-import { ILanguageConfigurationService } from '@theia/monaco-editor-core/esm/vs/editor/common/languages/languageConfigurationRegistry';
-import { ILanguageFeaturesService } from '@theia/monaco-editor-core/esm/vs/editor/common/services/languageFeatures';
-import * as objects from '@theia/monaco-editor-core/esm/vs/base/common/objects';
+import { ConfigurationChangedEvent, IEditorOptions, ShowLightbulbIconMode } from '@theia/monaco-editor-core/esm/vs/editor/common/config/editorOptions.js';
+import { ICodeEditorService } from '@theia/monaco-editor-core/esm/vs/editor/browser/services/codeEditorService.js';
+import { CursorColumns } from '@theia/monaco-editor-core/esm/vs/editor/common/core/cursorColumns.js';
+import { ICommandService } from '@theia/monaco-editor-core/esm/vs/platform/commands/common/commands.js';
+import { IContextKeyService } from '@theia/monaco-editor-core/esm/vs/platform/contextkey/common/contextkey.js';
+import { IKeybindingService } from '@theia/monaco-editor-core/esm/vs/platform/keybinding/common/keybinding.js';
+import { IThemeService } from '@theia/monaco-editor-core/esm/vs/platform/theme/common/themeService.js';
+import { INotificationService } from '@theia/monaco-editor-core/esm/vs/platform/notification/common/notification.js';
+import { IAccessibilityService } from '@theia/monaco-editor-core/esm/vs/platform/accessibility/common/accessibility.js';
+import { ILanguageConfigurationService } from '@theia/monaco-editor-core/esm/vs/editor/common/languages/languageConfigurationRegistry.js';
+import { ILanguageFeaturesService } from '@theia/monaco-editor-core/esm/vs/editor/common/services/languageFeatures.js';
+import * as objects from '@theia/monaco-editor-core/esm/vs/base/common/objects.js';
 import { Selection } from '@theia/editor/lib/browser/editor';
-import { IHoverService, WorkbenchHoverDelegate } from '@theia/monaco-editor-core/esm/vs/platform/hover/browser/hover';
-import { setHoverDelegateFactory } from '@theia/monaco-editor-core/esm/vs/base/browser/ui/hover/hoverDelegateFactory';
-import { IMarkdownRendererService } from '@theia/monaco-editor-core/esm/vs/platform/markdown/browser/markdownRenderer';
-import { MonacoTextModelService } from './monaco-text-model-service';
+import { IHoverService, WorkbenchHoverDelegate } from '@theia/monaco-editor-core/esm/vs/platform/hover/browser/hover.js';
+import { setHoverDelegateFactory } from '@theia/monaco-editor-core/esm/vs/base/browser/ui/hover/hoverDelegateFactory.js';
+import { IMarkdownRendererService } from '@theia/monaco-editor-core/esm/vs/platform/markdown/browser/markdownRenderer.js';
+import { MonacoTextModelService } from './monaco-text-model-service.js';
 
 export type ServicePair<T> = [ServiceIdentifier<T>, T];
 
@@ -106,6 +107,9 @@ export class MonacoEditor extends MonacoEditorServices implements TextEditor {
         return instance;
     }
 
+    /** Whether hiding the editor should detach its model and save its view state for restoration on show. */
+    detachModelOnHide = true;
+
     protected readonly toDispose = new DisposableCollection();
 
     protected readonly autoSizing: boolean;
@@ -265,13 +269,15 @@ export class MonacoEditor extends MonacoEditorServices implements TextEditor {
     }
 
     handleVisibilityChanged(nowVisible: boolean): void {
+        this._stagedForPreview = false;
         if (nowVisible) {
-            this._stagedForPreview = false;
-            this.baseEditor.setModel(this.baseModel);
-            this.baseEditor.restoreViewState(this.savedViewState);
-            this.baseEditor.focus();
-        } else {
-            this._stagedForPreview = false;
+            if (this.detachModelOnHide || !this.baseEditor.getModel()) {
+                this.baseEditor.setModel(this.baseModel);
+            }
+            if (this.detachModelOnHide) {
+                this.baseEditor.restoreViewState(this.savedViewState);
+            }
+        } else if (this.detachModelOnHide) {
             this.savedViewState = this.baseEditor.saveViewState();
 
             // eslint-disable-next-line no-null/no-null
@@ -354,10 +360,17 @@ export class MonacoEditor extends MonacoEditorServices implements TextEditor {
     }
 
     get cursor(): Position {
-        const { lineNumber, column } = this.editor.getPosition()!;
+        // a hidden editor has no model, see `handleVisibilityChanged`, its cursor is kept in the saved view state then
+        const { lineNumber, column } = this.editor.getPosition() ?? this.getSavedCursorPosition() ?? { lineNumber: 1, column: 1 };
         return this.m2p.asPosition(lineNumber, column);
     }
 
+    protected getSavedCursorPosition(): monaco.IPosition | undefined {
+        const viewState = this.savedViewState;
+        const codeEditorViewState = viewState && 'modified' in viewState ? viewState.modified : viewState;
+        return codeEditorViewState?.cursorState[0]?.position;
+    }
+
     set cursor(cursor: Position) {
         const position = this.p2m.asPosition(cursor);
         this.editor.setPosition(position);
@@ -628,7 +641,14 @@ export class MonacoEditor extends MonacoEditorServices implements TextEditor {
     }
 
     getVisibleColumn(position: Position): number {
-        return this.editor.getVisibleColumnFromPosition(this.p2m.asPosition(position));
+        const monacoPosition = this.p2m.asPosition(position);
+        if (this.editor.getModel()) {
+            return this.editor.getVisibleColumnFromPosition(monacoPosition);
+        }
+        // a hidden editor has no model, see `handleVisibilityChanged`, compute the column from the document like Monaco does
+        const model = this.document.textEditorModel;
+        const { lineNumber, column } = model.validatePosition(monacoPosition);
+        return CursorColumns.visibleColumnFromColumn(model.getLineContent(lineNumber), column, model.getOptions().tabSize) + 1;
     }
 
     async replaceText(params: ReplaceTextParams): Promise<boolean> {