Prevent text from being fully selected after replace value (#8262)

Author: ahuang11

panel/models/ace.ts

@@ -84,7 +84,28 @@ export class AcePlotView extends HTMLBoxView {
 
   _update_code_from_model(): void {
     if (this._editor && this._editor.getValue() != this.model.code) {
-      this._editor.setValue(this.model.code)
+      // Save the current cursor position
+      const cursorPosition = this._editor.getCursorPosition()
+      const scrollTop = this._editor.session.getScrollTop()
+      const scrollLeft = this._editor.session.getScrollLeft()
+
+      // Update the value without selecting all text
+      // The second parameter (-1) keeps cursor where it is
+      this._editor.setValue(this.model.code, -1)
+
+      // Restore cursor position only if it's valid in the new content
+      const newRowCount = this._editor.session.getLength()
+      if (cursorPosition.row < newRowCount) {
+        const newRowLength = this._editor.session.getLine(cursorPosition.row).length
+        const newColumn = Math.min(cursorPosition.column, newRowLength)
+        this._editor.moveCursorToPosition({row: cursorPosition.row, column: newColumn})
+      } else {
+        // If the cursor was beyond the new document length, move to end
+        this._editor.moveCursorToPosition({row: newRowCount - 1, column: this._editor.session.getLine(newRowCount - 1).length})
+      }
+      this._editor.clearSelection()
+      this._editor.session.setScrollTop(scrollTop)
+      this._editor.session.setScrollLeft(scrollLeft)
     }
   }
 

panel/tests/ui/widgets/test_codeeditor.py

@@ -41,6 +41,69 @@ def test_code_editor_on_keyup(page):
     wait_until(lambda: editor.value == "print(\"Hello UI!\")", page)
 
 
+def test_code_editor_value_update_no_selection(page):
+    """Test that updating editor value programmatically doesn't select all text."""
+    editor = CodeEditor(value="foo", on_keyup=True)
+    serve_component(page, editor)
+    ace_input = page.locator(".ace_content")
+    expect(ace_input).to_have_count(1)
+
+    # Click in the editor and position cursor after 'f' (position 1)
+    ace_input.click()
+    page.keyboard.press('End')  # Go to end
+    page.keyboard.press('ArrowLeft')  # Move left twice to be after 'f'
+    page.keyboard.press('ArrowLeft')
+
+    # Type 'X' to verify cursor position (should result in "fXoo")
+    page.keyboard.type('X')
+    wait_until(lambda: editor.value == "fXoo", page)
+
+    # Update the value programmatically (simulating periodic callback)
+    # This should preserve cursor position at index 2 (after "fX")
+    editor.value = "fXoo bar"
+    wait_until(lambda: editor.value == "fXoo bar", page)
+    expect(page.locator(".ace_content")).to_have_text("fXoo bar", use_inner_text=True)
+
+    # Type some more text - cursor should still be at position 2
+    # If cursor position was preserved, typing 'Y' should give "fXYoo bar"
+    # If cursor moved to end, typing 'Y' would give "fXoo barY"
+    page.keyboard.type('Y')
+
+    # Check that cursor was preserved (Y inserted at original position)
+    wait_until(lambda: editor.value == "fXYoo bar", page)
+
+
+def test_code_editor_value_update_cursor_to_end_when_invalid(page):
+    """Test that cursor moves to end when its position becomes invalid after update."""
+    editor = CodeEditor(value="line1\nline2\nline3\nline4", on_keyup=True)
+    serve_component(page, editor)
+    ace_input = page.locator(".ace_content")
+    expect(ace_input).to_have_count(1)
+
+    # Click in the editor and position cursor on line 3
+    ace_input.click()
+    page.keyboard.press('End')  # Go to end of document
+    page.keyboard.press('ArrowUp')  # Move up to line 3
+    page.keyboard.press('Home')  # Go to start of line 3
+
+    # Type 'X' to verify cursor position (should be at start of line 3)
+    page.keyboard.type('X')
+    wait_until(lambda: "Xline3" in editor.value, page)
+
+    # Update the value programmatically to something with fewer lines
+    # The cursor was on line 3 (row 2), but now there's only 1 line
+    editor.value = "short"
+    wait_until(lambda: editor.value == "short", page)
+    expect(page.locator(".ace_content")).to_have_text("short", use_inner_text=True)
+
+    # Type some text - cursor should now be at the end since old position is invalid
+    # Typing 'Y' should give "shortY"
+    page.keyboard.type('Y')
+
+    # Check that cursor moved to end (Y appended at end)
+    wait_until(lambda: editor.value == "shortY", page)
+
+
 def test_code_editor_not_on_keyup(page):
 
     editor = CodeEditor(value="print('Hello World!')", on_keyup=False)