Merge pull request #829 from jupyter-lsp/completion/cleanup-when-disabled

Completion/cleanup when disabled

Author: krassowski

CHANGELOG.md

@@ -7,6 +7,7 @@
   - implement settings UI using native JupyterLab 3.3 UI ([#778])
 - bug fixes
   - use correct websocket URL if configured as different from base URL ([#820], thanks @MikeSem)
+  - clean up all completer styles when compelter feature is disabled ([#829]).
 - refactoring:
   - move client capabilities to features ([#738])
 - documentation:
@@ -26,6 +27,7 @@
 [#814]: https://github.com/jupyter-lsp/jupyterlab-lsp/pull/814
 [#820]: https://github.com/jupyter-lsp/jupyterlab-lsp/pull/820
 [#826]: https://github.com/jupyter-lsp/jupyterlab-lsp/pull/826
+[#829]: https://github.com/jupyter-lsp/jupyterlab-lsp/pull/829
 
 ### `@krassowski/jupyterlab-lsp 3.10.1` (2022-03-21)
 

packages/completion-theme/src/index.ts

@@ -118,7 +118,9 @@ export class CompletionThemeManager implements ILSPCompletionThemeManager {
       );
     }
     this.current_theme_id = id;
-    document.body.classList.add(this.current_theme_class);
+    if (id !== null) {
+      document.body.classList.add(this.current_theme_class);
+    }
     this.update_icons_set();
   }
 

packages/completion-theme/style/index.css

@@ -20,24 +20,24 @@
 /* a workaround for scrollbars being always on in the completer documentation panel, see
  https://github.com/jupyter-lsp/jupyterlab-lsp/pull/322#issuecomment-682724175
  */
-.jp-Completer-docpanel {
+.lsp-completer .jp-Completer-docpanel {
   overflow: auto;
 }
 
-.jp-Completer {
+.lsp-completer.jp-Completer {
   --lsp-completer-max-label-width: 300px;
   --lsp-completer-max-detail-width: 200px;
 }
 
-.jp-Completer-match {
+.lsp-completer .jp-Completer-match {
   max-width: var(--lsp-completer-max-label-width);
   overflow-x: hidden;
   white-space: nowrap;
   display: block;
   text-overflow: ellipsis;
 }
 
-.jp-mod-active .jp-Completer-match {
+.lsp-completer .jp-mod-active .jp-Completer-match {
   text-overflow: clip;
 }
 
@@ -47,7 +47,7 @@
 }
 
 /* a workaround for code being larger font size than text in markdown-rendered panel */
-.jp-Completer-docpanel pre code {
+.lsp-completer .jp-Completer-docpanel pre code {
   font-size: 90%;
 }
 
@@ -81,15 +81,15 @@ body[data-lsp-completer-layout='detail-below'] .jp-Completer-match {
   height: var(--lsp-completer-label-height);
 }
 
-.jp-Completer-item .jp-Completer-typeExtended {
+.lsp-completer .jp-Completer-item .jp-Completer-typeExtended {
   max-width: var(--lsp-completer-max-detail-width);
   min-height: 50px;
   overflow-x: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
 
-.jp-mod-active .jp-Completer-typeExtended {
+.lsp-completer .jp-mod-active .jp-Completer-typeExtended {
   text-overflow: clip;
 }
 

packages/jupyterlab-lsp/src/features/completion/completion.ts

@@ -1,6 +1,10 @@
 import { JupyterFrontEnd } from '@jupyterlab/application';
 import { CodeEditor } from '@jupyterlab/codeeditor';
-import { CompletionHandler, ICompletionManager } from '@jupyterlab/completer';
+import {
+  CompletionHandler,
+  ICompletionManager,
+  CompleterModel
+} from '@jupyterlab/completer';
 import { IDocumentWidget } from '@jupyterlab/docregistry';
 import { NotebookPanel } from '@jupyterlab/notebook';
 import { IRenderMimeRegistry } from '@jupyterlab/rendermime';
@@ -27,6 +31,7 @@ import { ICompletionData, LSPCompletionRenderer } from './renderer';
 
 const DOC_PANEL_SELECTOR = '.jp-Completer-docpanel';
 const DOC_PANEL_PLACEHOLDER_CLASS = 'lsp-completer-placeholder';
+const LSP_COMPLETER_CLASS = 'lsp-completer';
 
 export class CompletionCM extends CodeMirrorIntegration {
   private _completionCharacters: string[];
@@ -88,6 +93,8 @@ export class CompletionLabIntegration implements IFeatureLabIntegration {
   protected current_adapter: WidgetAdapter<IDocumentWidget> | null = null;
   protected renderer: LSPCompletionRenderer;
   private _latestActiveItem: LazyCompletionItem | null = null;
+  private _signalConnected: boolean = false;
+  private _disabled: boolean;
 
   constructor(
     private app: JupyterFrontEnd,
@@ -108,24 +115,40 @@ export class CompletionLabIntegration implements IFeatureLabIntegration {
     });
     this.renderer.activeChanged.connect(this.active_completion_changed, this);
     this.renderer.itemShown.connect(this.resolve_and_update, this);
+    this._signalConnected = false;
+    this._disabled = false;
     // TODO: figure out a better way to disable lab integration elements (postpone initialization?)
     settings.ready
       .then(() => {
+        this._disabled = settings.composite.disable;
         if (!settings.composite.disable) {
           adapterManager.adapterChanged.connect(this.swap_adapter, this);
+          this._signalConnected = true;
         }
       })
       .catch(console.warn);
+
     settings.changed.connect(() => {
-      completionThemeManager.set_theme(this.settings.composite.theme);
-      completionThemeManager.set_icons_overrides(
-        this.settings.composite.typesMap
-      );
+      this._disabled = settings.composite.disable;
       if (!settings.composite.disable) {
         document.body.dataset.lspCompleterLayout =
           this.settings.composite.layout;
+        completionThemeManager.set_theme(this.settings.composite.theme);
+        completionThemeManager.set_icons_overrides(
+          this.settings.composite.typesMap
+        );
+        if (!this._signalConnected) {
+          adapterManager.adapterChanged.connect(this.swap_adapter, this);
+          this._signalConnected = true;
+        }
+      } else {
+        completionThemeManager.set_theme(null);
+        delete document.body.dataset.lspCompleterLayout;
       }
-      if (this.current_completion_handler) {
+      if (
+        this.current_completion_handler &&
+        this.model instanceof LSPCompleterModel
+      ) {
         this.model.settings.caseSensitive =
           this.settings.composite.caseSensitive;
         this.model.settings.includePerfectMatches =
@@ -284,21 +307,26 @@ export class CompletionLabIntegration implements IFeatureLabIntegration {
       this.renderer
     ) as CompletionHandler;
     let completer = this.completer;
-    completer.addClass('lsp-completer');
-    completer.model = new LSPCompleterModel({
-      caseSensitive: this.settings.composite.caseSensitive,
-      includePerfectMatches: this.settings.composite.includePerfectMatches,
-      preFilterMatches: this.settings.composite.preFilterMatches
-    });
+    if (this._disabled) {
+      completer.removeClass(LSP_COMPLETER_CLASS);
+      completer.model = new CompleterModel();
+    } else {
+      completer.addClass(LSP_COMPLETER_CLASS);
+      completer.model = new LSPCompleterModel({
+        caseSensitive: this.settings.composite.caseSensitive,
+        includePerfectMatches: this.settings.composite.includePerfectMatches,
+        preFilterMatches: this.settings.composite.preFilterMatches
+      });
+    }
   }
 
   protected get completer() {
     // TODO upstream: make completer public?
     return this.current_completion_handler.completer;
   }
 
-  protected get model(): LSPCompleterModel {
-    return this.completer.model as LSPCompleterModel;
+  protected get model(): LSPCompleterModel | CompleterModel {
+    return this.completer.model as LSPCompleterModel | CompleterModel;
   }
 
   invoke_completer(kind: ExtendedCompletionTriggerKind) {
@@ -336,6 +364,9 @@ export class CompletionLabIntegration implements IFeatureLabIntegration {
   private get current_items() {
     // TODO upstream: allow to get completionItems() without markup
     //   (note: not trivial as _markup() does filtering too)
+    if (!(this.model instanceof LSPCompleterModel)) {
+      return [];
+    }
     return this.model.completionItems();
   }