fix(editor): Skip error line highlighting if out of range (#6721)

n8n-io · Aug 3, 2023 · a4d3eaf · a4d3eaf
1 parent 8fa9263
commit a4d3eaf
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 7 deletions.
diff --git a/packages/editor-ui/src/components/CodeNodeEditor/CodeNodeEditor.vue b/packages/editor-ui/src/components/CodeNodeEditor/CodeNodeEditor.vue
@@ -30,7 +30,7 @@ import jsParser from 'prettier/parser-babel';
 import prettier from 'prettier/standalone';
 import { mapStores } from 'pinia';
 import type { LanguageSupport } from '@codemirror/language';
-import type { Extension } from '@codemirror/state';
+import type { Extension, Line } from '@codemirror/state';
 import { Compartment, EditorState } from '@codemirror/state';
 import type { ViewUpdate } from '@codemirror/view';
 import { EditorView } from '@codemirror/view';
@@ -213,18 +213,29 @@ export default defineComponent({
 				changes: { from: 0, to: this.content.length, insert: this.placeholder },
 			});
 		},
-		highlightLine(line: number | 'final') {
+		line(lineNumber: number): Line | null {
+			try {
+				return this.editor?.state.doc.line(lineNumber) ?? null;
+			} catch {
+				return null;
+			}
+		},
+		highlightLine(lineNumber: number | 'final') {
 			if (!this.editor) return;
 
-			if (line === 'final') {
+			if (lineNumber === 'final') {
 				this.editor.dispatch({
 					selection: { anchor: this.content.length },
 				});
 				return;
 			}
 
+			const line = this.line(lineNumber);
+
+			if (!line) return;
+
 			this.editor.dispatch({
-				selection: { anchor: this.editor.state.doc.line(line).from },
+				selection: { anchor: line.from },
 			});
 		},
 		formatCode() {

diff --git a/packages/editor-ui/src/components/SqlEditor/SqlEditor.vue b/packages/editor-ui/src/components/SqlEditor/SqlEditor.vue
@@ -17,6 +17,7 @@ import { acceptCompletion, autocompletion, ifNotIn } from '@codemirror/autocompl
 import { indentWithTab, history, redo, toggleComment } from '@codemirror/commands';
 import { bracketMatching, foldGutter, indentOnInput, LanguageSupport } from '@codemirror/language';
 import { EditorState } from '@codemirror/state';
+import type { Line } from '@codemirror/state';
 import type { Extension } from '@codemirror/state';
 import {
 	dropCursor,
@@ -189,18 +190,29 @@ export default defineComponent({
 		onBlur() {
 			this.isFocused = false;
 		},
-		highlightLine(line: number | 'final') {
+		line(lineNumber: number): Line | null {
+			try {
+				return this.editor?.state.doc.line(lineNumber) ?? null;
+			} catch {
+				return null;
+			}
+		},
+		highlightLine(lineNumber: number | 'final') {
 			if (!this.editor) return;
 
-			if (line === 'final') {
+			if (lineNumber === 'final') {
 				this.editor.dispatch({
 					selection: { anchor: this.query.length },
 				});
 				return;
 			}
 
+			const line = this.line(lineNumber);
+
+			if (!line) return;
+
 			this.editor.dispatch({
-				selection: { anchor: this.editor.state.doc.line(line).from },
+				selection: { anchor: line.from },
 			});
 		},
 	},