From 37df2b8ae18a203e9c6e258d9466af94cf7b67e4 Mon Sep 17 00:00:00 2001
From: Myles Scolnick <myles@marimo.io>
Date: Fri, 6 Sep 2024 18:03:08 -0400
Subject: [PATCH] fix: dont auto-run markdown on mount, dont auto-scroll
 unfocused cells

---
 .../src/core/codemirror/cells/extensions.ts   | 26 ++++++++++++++-----
 .../src/core/codemirror/copilot/extension.ts  |  4 ++-
 frontend/src/core/codemirror/extensions.ts    | 15 ++++++++++-
 3 files changed, 36 insertions(+), 9 deletions(-)

diff --git a/frontend/src/core/codemirror/cells/extensions.ts b/frontend/src/core/codemirror/cells/extensions.ts
index 1719c0aede3..52c07e3e4fa 100644
--- a/frontend/src/core/codemirror/cells/extensions.ts
+++ b/frontend/src/core/codemirror/cells/extensions.ts
@@ -293,12 +293,12 @@ export function cellCodeEditingBundle(
   const { updateCellCode } = callbacks;
 
   const onChangePlugin = EditorView.updateListener.of((update) => {
-    // Check if the doc update was a formatting change
-    // e.g. changing from python to markdown
-    const isFormattingChange = update.transactions.some((tr) =>
-      tr.effects.some((effect) => effect.is(formattingChangeEffect)),
-    );
     if (update.docChanged) {
+      // Check if the doc update was a formatting change
+      // e.g. changing from python to markdown
+      const isFormattingChange = update.transactions.some((tr) =>
+        tr.effects.some((effect) => effect.is(formattingChangeEffect)),
+      );
       const nextCode = getEditorCodeAsPython(update.view);
       updateCellCode({
         cellId,
@@ -318,8 +318,20 @@ export function markdownAutoRunExtension(
   callbacks: MovementCallbacks,
 ): Extension {
   return EditorView.updateListener.of((update) => {
-    if (update.docChanged) {
-      callbacks.onRun();
+    // If the doc didn't change, ignore
+    if (!update.docChanged) {
+      return;
+    }
+
+    // This happens on mount when we start in markdown mode
+    const isFormattingChange = update.transactions.some((tr) =>
+      tr.effects.some((effect) => effect.is(formattingChangeEffect)),
+    );
+    if (isFormattingChange) {
+      // Ignore formatting changes
+      return;
     }
+
+    callbacks.onRun();
   });
 }
diff --git a/frontend/src/core/codemirror/copilot/extension.ts b/frontend/src/core/codemirror/copilot/extension.ts
index 3ad30672200..b3c0916f79a 100644
--- a/frontend/src/core/codemirror/copilot/extension.ts
+++ b/frontend/src/core/codemirror/copilot/extension.ts
@@ -75,7 +75,9 @@ export const copilotBundle = (config: CompletionConfig): Extension => {
             request.doc.position,
             state,
           );
-          Logger.debug("Copilot suggestion:", suggestion);
+          if (suggestion) {
+            Logger.debug("Copilot suggestion:", suggestion);
+          }
           return suggestion;
         },
       }),
diff --git a/frontend/src/core/codemirror/extensions.ts b/frontend/src/core/codemirror/extensions.ts
index 4daefa8487c..c804a106dd4 100644
--- a/frontend/src/core/codemirror/extensions.ts
+++ b/frontend/src/core/codemirror/extensions.ts
@@ -1,7 +1,7 @@
 /* Copyright 2024 Marimo. All rights reserved. */
 import { EditorView, keymap } from "@codemirror/view";
 import type { CellId } from "../cells/ids";
-import { formatEditorViews } from "./format";
+import { formatEditorViews, formattingChangeEffect } from "./format";
 import {
   getCurrentLanguageAdapter,
   toggleToLanguage,
@@ -60,8 +60,21 @@ export function formatKeymapExtension(
  */
 export function scrollActiveLineIntoView() {
   return EditorView.updateListener.of((update) => {
+    // Ignore the editor does not have focus, ignore
+    if (!update.view.hasFocus) {
+      return;
+    }
+
     // A new line was added, scroll the active line into view
     if (update.heightChanged && update.docChanged) {
+      // Ignore formatting changes
+      const isFormattingChange = update.transactions.some((tr) =>
+        tr.effects.some((effect) => effect.is(formattingChangeEffect)),
+      );
+      if (isFormattingChange) {
+        return;
+      }
+
       const activeLines = update.view.dom.getElementsByClassName(
         "cm-activeLine cm-line",
       );