Handle multiple monaco editor instances for Painless lang (#85834) (#…

…85962) Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
elastic · Dec 15, 2020 · b3acc4b · b3acc4b
1 parent bcafd22
commit b3acc4b
Show file tree

Hide file tree

Showing 3 changed files with 38 additions and 18 deletions.
diff --git a/packages/kbn-monaco/src/painless/diagnostics_adapter.ts b/packages/kbn-monaco/src/painless/diagnostics_adapter.ts
@@ -32,25 +32,41 @@ export class DiagnosticsAdapter {
   constructor(private worker: WorkerAccessor) {
     const onModelAdd = (model: monaco.editor.IModel): void => {
       let handle: any;
-      model.onDidChangeContent(() => {
-        // Every time a new change is made, wait 500ms before validating
-        clearTimeout(handle);
-        handle = setTimeout(() => this.validate(model.uri), 500);
-      });
 
-      this.validate(model.uri);
+      if (model.getModeId() === ID) {
+        model.onDidChangeContent(() => {
+          // Do not validate if the language ID has changed
+          if (model.getModeId() !== ID) {
+            return;
+          }
+
+          // Every time a new change is made, wait 500ms before validating
+          clearTimeout(handle);
+          handle = setTimeout(() => this.validate(model.uri), 500);
+        });
+
+        model.onDidChangeLanguage(({ newLanguage }) => {
+          // Reset the model markers if the language ID has changed and is no longer "painless"
+          if (newLanguage !== ID) {
+            return monaco.editor.setModelMarkers(model, ID, []);
+          }
+        });
+
+        this.validate(model.uri);
+      }
     };
     monaco.editor.onDidCreateModel(onModelAdd);
     monaco.editor.getModels().forEach(onModelAdd);
   }
 
   private async validate(resource: monaco.Uri): Promise<void> {
     const worker = await this.worker(resource);
-    const errorMarkers = await worker.getSyntaxErrors();
-
-    const model = monaco.editor.getModel(resource);
+    const errorMarkers = await worker.getSyntaxErrors(resource.toString());
 
-    // Set the error markers and underline them with "Error" severity
-    monaco.editor.setModelMarkers(model!, ID, errorMarkers.map(toDiagnostics));
+    if (errorMarkers) {
+      const model = monaco.editor.getModel(resource);
+      // Set the error markers and underline them with "Error" severity
+      monaco.editor.setModelMarkers(model!, ID, errorMarkers.map(toDiagnostics));
+    }
   }
 }
diff --git a/packages/kbn-monaco/src/painless/worker/painless_worker.ts b/packages/kbn-monaco/src/painless/worker/painless_worker.ts
@@ -28,14 +28,18 @@ export class PainlessWorker {
     this._ctx = ctx;
   }
 
-  private getTextDocument(): string {
-    const model = this._ctx.getMirrorModels()[0];
-    return model.getValue();
+  private getTextDocument(modelUri: string): string | undefined {
+    const model = this._ctx.getMirrorModels().find((m) => m.uri.toString() === modelUri);
+
+    return model?.getValue();
   }
 
-  public async getSyntaxErrors() {
-    const code = this.getTextDocument();
-    return parseAndGetSyntaxErrors(code);
+  public async getSyntaxErrors(modelUri: string) {
+    const code = this.getTextDocument(modelUri);
+
+    if (code) {
+      return parseAndGetSyntaxErrors(code);
+    }
   }
 
   public provideAutocompleteSuggestions(

diff --git a/...ion/components/pipeline_processors_editor/components/processor_form/processors/script.tsx b/...ion/components/pipeline_processors_editor/components/processor_form/processors/script.tsx
@@ -129,7 +129,7 @@ const fieldsConfig: FieldsConfig = {
 
 export const Script: FormFieldsComponent = ({ initialFieldValues }) => {
   const [showId, setShowId] = useState(() => !!initialFieldValues?.id);
-  const [scriptLanguage, setScriptLanguage] = useState<string>('plaintext');
+  const [scriptLanguage, setScriptLanguage] = useState<string>(PainlessLang.ID);
 
   const [{ fields }] = useFormData({ watch: 'fields.lang' });