Re-detect indentation in editor when the unchanged content is <200 chars

[email protected]

Fixed: 377820803
Change-Id: I0a52c209fd04a076270776516972efa917bc6d77
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6049060
Commit-Queue: Benedikt Meurer <[email protected]>
Reviewed-by: Benedikt Meurer <[email protected]>
Reviewed-by: Simon Zünd <[email protected]>

Author: marijnh

front_end/ui/components/text_editor/config.ts

@@ -15,6 +15,7 @@ import * as Icon from '../icon_button/icon_button.js';
 import {editorTheme} from './theme.js';
 
 const LINES_TO_SCAN_FOR_INDENTATION_GUESSING = 1000;
+const RECOMPUTE_INDENT_MAX_SIZE = 200;
 
 const UIStrings = {
   /**
@@ -209,13 +210,30 @@ export const codeFolding = DynamicSetting.bool('text-editor-code-folding', [
   CM.keymap.of(CM.foldKeymap),
 ]);
 
-const deriveIndentUnit = CM.Prec.highest(CM.indentUnit.compute([], (state: CM.EditorState) => {
-  const lines = state.doc.iterLines(1, Math.min(state.doc.lines + 1, LINES_TO_SCAN_FOR_INDENTATION_GUESSING));
+const AutoDetectIndent = CM.StateField.define<string>({
+  create: state => detectIndentation(state.doc),
+  update: (indent, tr) => {
+    return tr.docChanged && preservedLength(tr.changes) <= RECOMPUTE_INDENT_MAX_SIZE ? detectIndentation(tr.state.doc) :
+                                                                                       indent;
+  },
+  provide: f => CM.Prec.highest(CM.indentUnit.from(f)),
+});
+
+function preservedLength(ch: CM.ChangeDesc): number {
+  let len = 0;
+  ch.iterGaps((from, to, l) => {
+    len += l;
+  });
+  return len;
+}
+
+function detectIndentation(doc: CM.Text): string {
+  const lines = doc.iterLines(1, Math.min(doc.lines + 1, LINES_TO_SCAN_FOR_INDENTATION_GUESSING));
   const indentUnit = TextUtils.TextUtils.detectIndentation(lines);
   return indentUnit ?? Common.Settings.Settings.instance().moduleSetting('text-editor-indent').get();
-}));
+}
 
-export const autoDetectIndent = DynamicSetting.bool('text-editor-auto-detect-indent', deriveIndentUnit);
+export const autoDetectIndent = DynamicSetting.bool('text-editor-auto-detect-indent', AutoDetectIndent);
 
 function matcher(decorator: CM.MatchDecorator): CM.Extension {
   return CM.ViewPlugin.define(