Add reflowCursorLine option

Author: jtbandes

demo/client.ts

@@ -366,14 +366,19 @@ function createTerminal(): void {
     // Set terminal size again to set the specific dimensions on the demo
     updateTerminalSize();
 
-    const res = await fetch('/terminals?cols=' + term.cols + '&rows=' + term.rows, { method: 'POST' });
-    const processId = await res.text();
-    pid = processId;
-    socketURL += processId;
-    socket = new WebSocket(socketURL);
-    socket.onopen = runRealTerminal;
-    socket.onclose = runFakeTerminal;
-    socket.onerror = runFakeTerminal;
+    const useRealTerminal = document.getElementById('use-real-terminal');
+    if (useRealTerminal instanceof HTMLInputElement && !useRealTerminal.checked) {
+      runFakeTerminal();
+    } else {
+      const res = await fetch('/terminals?cols=' + term.cols + '&rows=' + term.rows, { method: 'POST' });
+      const processId = await res.text();
+      pid = processId;
+      socketURL += processId;
+      socket = new WebSocket(socketURL);
+      socket.onopen = runRealTerminal;
+      socket.onclose = runFakeTerminal;
+      socket.onerror = runFakeTerminal;
+    }
   }, 0);
 }
 

demo/index.html

@@ -81,6 +81,7 @@ <h3>Test</h3>
           <div style="display: inline-block; margin-right: 16px;">
             <dl>
               <dt>Lifecycle</dt>
+              <dd><label for="use-real-terminal"><input type="checkbox" checked id="use-real-terminal" title="This is used to real vs fake terminals" />Use real terminal</label></dd>
               <dd><button id="dispose" title="This is used to testing memory leaks">Dispose terminal</button></dd>
               <dd><button id="create-new-window" title="This is used to test rendering in other windows">Create terminal in new window</button></dd>
 

src/common/buffer/Buffer.ts

@@ -315,7 +315,7 @@ export class Buffer implements IBuffer {
   }
 
   private _reflowLarger(newCols: number, newRows: number): void {
-    const toRemove: number[] = reflowLargerGetLinesToRemove(this.lines, this._cols, newCols, this.ybase + this.y, this.getNullCell(DEFAULT_ATTR_DATA));
+    const toRemove: number[] = reflowLargerGetLinesToRemove(this.lines, this._cols, newCols, this.ybase + this.y, this.getNullCell(DEFAULT_ATTR_DATA), this._optionsService.rawOptions.reflowCursorLine);
     if (toRemove.length > 0) {
       const newLayoutResult = reflowLargerCreateNewLayout(this.lines, toRemove);
       reflowLargerApplyNewLayout(this.lines, newLayoutResult.layout);
@@ -347,6 +347,7 @@ export class Buffer implements IBuffer {
   }
 
   private _reflowSmaller(newCols: number, newRows: number): void {
+    const reflowCursorLine = this._optionsService.rawOptions.reflowCursorLine;
     const nullCell = this.getNullCell(DEFAULT_ATTR_DATA);
     // Gather all BufferLines that need to be inserted into the Buffer here so that they can be
     // batched up and only committed once
@@ -367,11 +368,13 @@ export class Buffer implements IBuffer {
         wrappedLines.unshift(nextLine);
       }
 
-      // If these lines contain the cursor don't touch them, the program will handle fixing up
-      // wrapped lines with the cursor
-      const absoluteY = this.ybase + this.y;
-      if (absoluteY >= y && absoluteY < y + wrappedLines.length) {
-        continue;
+      if (!reflowCursorLine) {
+        // If these lines contain the cursor don't touch them, the program will handle fixing up
+        // wrapped lines with the cursor
+        const absoluteY = this.ybase + this.y;
+        if (absoluteY >= y && absoluteY < y + wrappedLines.length) {
+          continue;
+        }
       }
 
       const lastLineLength = wrappedLines[wrappedLines.length - 1].getTrimmedLength();

src/common/buffer/BufferReflow.ts

@@ -20,8 +20,9 @@ export interface INewLayoutResult {
  * @param newCols The columns after resize.
  * @param bufferAbsoluteY The absolute y position of the cursor (baseY + cursorY).
  * @param nullCell The cell data to use when filling in empty cells.
+ * @param reflowCursorLine Whether to reflow the line containing the cursor.
  */
-export function reflowLargerGetLinesToRemove(lines: CircularList<IBufferLine>, oldCols: number, newCols: number, bufferAbsoluteY: number, nullCell: ICellData): number[] {
+export function reflowLargerGetLinesToRemove(lines: CircularList<IBufferLine>, oldCols: number, newCols: number, bufferAbsoluteY: number, nullCell: ICellData,reflowCursorLine: boolean): number[] {
   // Gather all BufferLines that need to be removed from the Buffer here so that they can be
   // batched up and only committed once
   const toRemove: number[] = [];
@@ -41,11 +42,13 @@ export function reflowLargerGetLinesToRemove(lines: CircularList<IBufferLine>, o
       nextLine = lines.get(++i) as BufferLine;
     }
 
-    // If these lines contain the cursor don't touch them, the program will handle fixing up wrapped
-    // lines with the cursor
-    if (bufferAbsoluteY >= y && bufferAbsoluteY < i) {
-      y += wrappedLines.length - 1;
-      continue;
+    if (!reflowCursorLine) {
+      // If these lines contain the cursor don't touch them, the program will handle fixing up
+      // wrapped lines with the cursor
+      if (bufferAbsoluteY >= y && bufferAbsoluteY < i) {
+        y += wrappedLines.length - 1;
+        continue;
+      }
     }
 
     // Copy buffer data to new locations

src/common/services/OptionsService.ts

@@ -44,6 +44,7 @@ export const DEFAULT_OPTIONS: Readonly<Required<ITerminalOptions>> = {
   allowTransparency: false,
   tabStopWidth: 8,
   theme: {},
+  reflowCursorLine: false,
   rescaleOverlappingGlyphs: false,
   rightClickSelectsWord: isMac,
   windowOptions: {},

src/common/services/Services.ts

@@ -237,6 +237,7 @@ export interface ITerminalOptions {
   macOptionIsMeta?: boolean;
   macOptionClickForcesSelection?: boolean;
   minimumContrastRatio?: number;
+  reflowCursorLine?: boolean;
   rescaleOverlappingGlyphs?: boolean;
   rightClickSelectsWord?: boolean;
   rows?: number;

typings/xterm-headless.d.ts

@@ -142,6 +142,12 @@ declare module '@xterm/headless' {
      */
     minimumContrastRatio?: number;
 
+    /**
+     * Whether to reflow the line containing the cursor when the terminal is resized. Defaults to
+     * false, because shells usually handle this themselves.
+     */
+    reflowCursorLine?: boolean;
+
     /**
      * Whether to rescale glyphs horizontally that are a single cell wide but
      * have glyphs that would overlap following cell(s). This typically happens

typings/xterm.d.ts

@@ -213,6 +213,12 @@ declare module '@xterm/xterm' {
      */
     minimumContrastRatio?: number;
 
+    /**
+     * Whether to reflow the line containing the cursor when the terminal is resized. Defaults to
+     * false, because shells usually handle this themselves.
+     */
+    reflowCursorLine?: boolean;
+
     /**
      * Whether to rescale glyphs horizontally that are a single cell wide but
      * have glyphs that would overlap following cell(s). This typically happens