Merge remote-tracking branch 'upstream/master' into pr/aymanbagabas/4220

test/playwright/MouseTracking.test.ts

@@ -4,7 +4,7 @@
  */
 import { test } from '@playwright/test';
 import { deepStrictEqual, ok, strictEqual } from 'assert';
-import type { IDisposable } from 'xterm';
+import type { IDisposable } from '@xterm/xterm';
 import { createTestContext, ITestContext, openTerminal, pollFor } from './TestUtils';
 
 let ctx: ITestContext;

test/playwright/Parser.test.ts

@@ -4,7 +4,7 @@
  */
 import { test } from '@playwright/test';
 import { deepStrictEqual, ok, strictEqual } from 'assert';
-import type { IDisposable } from 'xterm';
+import type { IDisposable } from '@xterm/xterm';
 import { createTestContext, ITestContext, openTerminal, pollFor } from './TestUtils';
 
 let ctx: ITestContext;

test/playwright/SharedRendererTests.ts

@@ -5,7 +5,7 @@
 
 import { IImage32, decodePng } from '@lunapaint/png-codec';
 import { LocatorScreenshotOptions, test } from '@playwright/test';
-import { ITheme } from 'xterm';
+import { ITheme } from '@xterm/xterm';
 import { ITestContext, MaybeAsync, openTerminal, pollFor, pollForApproximate } from './TestUtils';
 
 export interface ISharedRendererTestContext {
@@ -1171,9 +1171,35 @@ export function injectSharedRendererTests(ctx: ISharedRendererTestContext): void
       await ctx.value.proxy.selectAll();
       await pollFor(ctx.value.page, () => getCellColor(ctx.value, 1, 1), [0, 0, 255, 255]);
     });
+    test('#4799: cursor should be in the correct position', async () => {
+      const theme: ITheme = {
+        cursor: '#0000FF'
+      };
+      await ctx.value.page.evaluate(`window.term.options.theme = ${JSON.stringify(theme)};`);
+      for (let index = 0; index < 160; index++) {
+        await ctx.value.proxy.writeln(``);
+      }
+      await ctx.value.proxy.focus();
+      await ctx.value.proxy.write('\x1b[A');
+      await ctx.value.proxy.write('\x1b[A');
+      await ctx.value.proxy.scrollLines(-2);
+      const rows = await ctx.value.proxy.rows;
+      // block cursor style
+      await pollFor(ctx.value.page, () => getCellColor(ctx.value, 1, rows), [0, 0, 255, 255]);
+      await ctx.value.proxy.blur();
+      frameDetails = undefined;
+      // outlink cursor style
+      await pollFor(ctx.value.page, () => getCellColor(ctx.value, 1, rows), [0, 0, 0, 255]);
+      await pollFor(ctx.value.page, () => getCellColor(ctx.value, 1, rows, CellColorPosition.FIRST), [0, 0, 255, 255]);
+    });
   });
 }
 
+enum CellColorPosition {
+  CENTER = 0,
+  FIRST = 1
+}
+
 /**
  * Injects shared renderer tests where it's required to re-initialize the terminal for each test.
  * This is much slower than just calling `Terminal.reset` but testing some features needs this
@@ -1214,11 +1240,16 @@ export function injectSharedRendererTestsStandalone(ctx: ISharedRendererTestCont
  * @param col The 1-based column index to get the color for.
  * @param row The 1-based row index to get the color for.
  */
-function getCellColor(ctx: ITestContext, col: number, row: number): MaybeAsync<[red: number, green: number, blue: number, alpha: number]> {
+function getCellColor(ctx: ITestContext, col: number, row: number, position: CellColorPosition = CellColorPosition.CENTER): MaybeAsync<[red: number, green: number, blue: number, alpha: number]> {
   if (!frameDetails) {
     return getFrameDetails(ctx).then(frameDetails => getCellColorInner(frameDetails, col, row));
   }
-  return getCellColorInner(frameDetails, col, row);
+  switch (position) {
+    case CellColorPosition.CENTER:
+      return getCellColorInner(frameDetails, col, row);
+    case CellColorPosition.FIRST:
+      return getCellColorFirstPoint(frameDetails, col, row);
+  }
 }
 
 let frameDetails: { cols: number, rows: number, decoded: IImage32 } | undefined = undefined;
@@ -1244,6 +1275,17 @@ function getCellColorInner(frameDetails: { cols: number, rows: number, decoded:
   return Array.from(frameDetails.decoded.data.slice(i, i + 4)) as [number, number, number, number];
 }
 
+function getCellColorFirstPoint(frameDetails: { cols: number, rows: number, decoded: IImage32 }, col: number, row: number): [red: number, green: number, blue: number, alpha: number] {
+  const cellSize = {
+    width: frameDetails.decoded.width / frameDetails.cols,
+    height: frameDetails.decoded.height / frameDetails.rows
+  };
+  const x = Math.floor((col - 1/* 1- to 0-based index */) * cellSize.width);
+  const y = Math.floor((row - 1/* 1- to 0-based index */) * cellSize.height);
+  const i = (y * frameDetails.decoded.width + x) * 4/* 4 channels per pixel */;
+  return Array.from(frameDetails.decoded.data.slice(i, i + 4)) as [number, number, number, number];
+}
+
 const COLORS_16_TO_255 = [
   '#000000', '#00005f', '#000087', '#0000af', '#0000d7', '#0000ff', '#005f00', '#005f5f', '#005f87', '#005faf', '#005fd7', '#005fff', '#008700', '#00875f', '#008787', '#0087af',
   '#0087d7', '#0087ff', '#00af00', '#00af5f', '#00af87', '#00afaf', '#00afd7', '#00afff', '#00d700', '#00d75f', '#00d787', '#00d7af', '#00d7d7', '#00d7ff', '#00ff00', '#00ff5f',

test/playwright/TestUtils.ts

@@ -10,7 +10,7 @@ import type { IRenderService } from 'browser/services/Services';
 import type { ICoreTerminal, IMarker } from 'common/Types';
 import * as playwright from '@playwright/test';
 import { PageFunction } from 'playwright-core/types/structs';
-import { IBuffer, IBufferCell, IBufferLine, IBufferNamespace, IBufferRange, IDecoration, IDecorationOptions, IModes, ITerminalInitOnlyOptions, ITerminalOptions, Terminal } from 'xterm';
+import { IBuffer, IBufferCell, IBufferLine, IBufferNamespace, IBufferRange, IDecoration, IDecorationOptions, IModes, ITerminalInitOnlyOptions, ITerminalOptions, Terminal } from '@xterm/xterm';
 import { EventEmitter } from '../../out/common/EventEmitter';
 
 export interface ITestContext {