@xterm/xterm 5.6.0-beta.4 → 5.6.0-beta.40

package/package.json

@@ -1,8 +1,9 @@
 {
   "name": "@xterm/xterm",
   "description": "Full xterm terminal, in your browser",
-  "version": "5.6.0-beta.4",
+  "version": "5.6.0-beta.40",
   "main": "lib/xterm.js",
+  "module": "lib/xterm.mjs",
   "style": "css/xterm.css",
   "types": "typings/xterm.d.ts",
   "repository": "https://github.com/xtermjs/xterm.js",
@@ -23,44 +24,51 @@
     "xterm"
   ],
   "scripts": {
-    "prepackage": "npm run build",
-    "package": "webpack",
-    "package-headless": "webpack --config ./webpack.config.headless.js",
-    "postpackage-headless": "node ./bin/package_headless.js",
+    "setup": "npm run build",
+    "presetup": "npm run install-addons",
+    "install-addons": "node ./bin/install-addons.js",
     "start": "node demo/start",
-    "start-server-only": "node demo/start-server-only",
     "build-demo": "webpack --config ./demo/webpack.config.js",
-    "lint": "eslint -c .eslintrc.json --max-warnings 0 --ext .ts src/ addons/",
-    "lint-api": "eslint --no-eslintrc -c .eslintrc.json.typings --max-warnings 0 --no-ignore --ext .d.ts typings/",
+    "build": "npm run tsc",
+    "watch": "npm run tsc-watch",
+    "tsc": "tsc -b ./tsconfig.all.json",
+    "tsc-watch": "tsc -b -w ./tsconfig.all.json --preserveWatchOutput",
+    "esbuild": "node bin/esbuild_all.mjs",
+    "esbuild-watch": "node bin/esbuild_all.mjs --watch",
+    "esbuild-package": "node bin/esbuild_all.mjs --prod",
+    "esbuild-package-watch": "node bin/esbuild_all.mjs --prod --watch",
+    "esbuild-package-headless-only": "node bin/esbuild.mjs --prod --headless",
+    "esbuild-demo": "node bin/esbuild.mjs --demo-client",
+    "esbuild-demo-watch": "node bin/esbuild.mjs --demo-client --watch",
     "test": "npm run test-unit",
     "posttest": "npm run lint",
-    "test-api": "npm run test-api-chromium",
-    "test-api-chromium": "node ./bin/test_api.js --browser=chromium --timeout=20000",
-    "test-api-firefox": "node ./bin/test_api.js --browser=firefox --timeout=20000",
-    "test-api-webkit": "node ./bin/test_api.js --browser=webkit --timeout=20000",
-    "test-playwright": "node ./bin/test_playwright.js --workers=75%",
-    "test-playwright-chromium": "node ./bin/test_playwright.js --workers=75% \"--project=Chrome Stable\"",
-    "test-playwright-firefox": "node ./bin/test_playwright.js --workers=75% \"--project=Firefox Stable\"",
-    "test-playwright-webkit": "node ./bin/test_playwright.js --workers=75% \"--project=WebKit\"",
-    "test-playwright-debug": "node ./bin/test_playwright.js  --workers=1 --headed --timeout=30000",
+    "lint": "eslint -c .eslintrc.json --max-warnings 0 --ext .ts src/ addons/",
+    "lint-api": "eslint --no-eslintrc -c .eslintrc.json.typings --max-warnings 0 --no-ignore --ext .d.ts typings/",
     "test-unit": "node ./bin/test.js",
     "test-unit-coverage": "node ./bin/test.js --coverage",
     "test-unit-dev": "cross-env NODE_PATH='./out' mocha",
-    "build": "tsc -b ./tsconfig.all.json",
-    "install-addons": "node ./bin/install-addons.js",
-    "presetup": "npm run install-addons",
-    "setup": "npm run build",
-    "prepublishOnly": "npm run package",
-    "watch": "tsc -b -w ./tsconfig.all.json --preserveWatchOutput",
+    "test-integration": "node ./bin/test_playwright.js --workers=75%",
+    "test-integration-chromium": "node ./bin/test_playwright.js --workers=75% \"--project=ChromeStable\"",
+    "test-integration-firefox": "node ./bin/test_playwright.js --workers=75% \"--project=FirefoxStable\"",
+    "test-integration-webkit": "node ./bin/test_playwright.js --workers=75% \"--project=WebKit\"",
+    "test-integration-debug": "node ./bin/test_playwright.js  --workers=1 --headed --timeout=30000",
     "benchmark": "NODE_PATH=./out xterm-benchmark -r 5 -c test/benchmark/benchmark.json",
-    "benchmark-baseline": "NODE_PATH=./out xterm-benchmark -r 5 -c test/benchmark/benchmark.json --baseline out-test/benchmark/test/benchmark/*benchmark.js",
-    "benchmark-eval": "NODE_PATH=./out xterm-benchmark -r 5 -c test/benchmark/benchmark.json --eval out-test/benchmark/test/benchmark/*benchmark.js",
+    "benchmark-baseline": "NODE_PATH=./out xterm-benchmark -r 5 -c test/benchmark/benchmark.json --baseline out-tsc/test-benchmark/test/benchmark/*benchmark.js",
+    "benchmark-eval": "NODE_PATH=./out xterm-benchmark -r 5 -c test/benchmark/benchmark.json --eval out-tsc/test-benchmark/test/benchmark/*benchmark.js",
     "clean": "rm -rf lib out addons/*/lib addons/*/out",
-    "vtfeatures": "node bin/extract_vtfeatures.js src/**/*.ts src/*.ts"
+    "vtfeatures": "node bin/extract_vtfeatures.js src/**/*.ts src/*.ts",
+    "prepackage": "npm run build",
+    "package": "webpack",
+    "postpackage": "npm run esbuild-package",
+    "prepackage-headless": "npm run esbuild-package-headless-only",
+    "package-headless": "webpack --config ./webpack.config.headless.js",
+    "postpackage-headless": "node ./bin/package_headless.js",
+    "prepublishOnly": "npm run package"
   },
   "devDependencies": {
     "@lunapaint/png-codec": "^0.2.0",
     "@playwright/test": "^1.37.1",
+    "@stylistic/eslint-plugin": "^2.3.0",
     "@types/chai": "^4.2.22",
     "@types/debug": "^4.1.7",
     "@types/deep-equal": "^1.0.1",
@@ -78,9 +86,10 @@
     "chai": "^4.3.4",
     "cross-env": "^7.0.3",
     "deep-equal": "^2.0.5",
+    "esbuild": "^0.23.0",
     "eslint": "^8.56.0",
     "eslint-plugin-jsdoc": "^46.9.1",
-    "express": "^4.17.1",
+    "express": "^4.19.2",
     "express-ws": "^5.0.2",
     "glob": "^7.2.0",
     "jsdom": "^18.0.1",
@@ -91,7 +100,7 @@
     "source-map-loader": "^3.0.0",
     "source-map-support": "^0.5.20",
     "ts-loader": "^9.3.1",
-    "typescript": "^5.1.6",
+    "typescript": "5.5",
     "utf8": "^3.0.0",
     "webpack": "^5.61.0",
     "webpack-cli": "^4.9.1",

package/src/browser/AccessibilityManager.ts

@@ -58,10 +58,11 @@ export class AccessibilityManager extends Disposable {
     @IRenderService private readonly _renderService: IRenderService
   ) {
     super();
-    this._accessibilityContainer = this._coreBrowserService.mainDocument.createElement('div');
+    const doc = this._coreBrowserService.mainDocument;
+    this._accessibilityContainer = doc.createElement('div');
     this._accessibilityContainer.classList.add('xterm-accessibility');
 
-    this._rowContainer = this._coreBrowserService.mainDocument.createElement('div');
+    this._rowContainer = doc.createElement('div');
     this._rowContainer.setAttribute('role', 'list');
     this._rowContainer.classList.add('xterm-accessibility-tree');
     this._rowElements = [];
@@ -75,10 +76,9 @@ export class AccessibilityManager extends Disposable {
     this._rowElements[0].addEventListener('focus', this._topBoundaryFocusListener);
     this._rowElements[this._rowElements.length - 1].addEventListener('focus', this._bottomBoundaryFocusListener);
 
-    this._refreshRowsDimensions();
     this._accessibilityContainer.appendChild(this._rowContainer);
 
-    this._liveRegion = this._coreBrowserService.mainDocument.createElement('div');
+    this._liveRegion = doc.createElement('div');
     this._liveRegion.classList.add('live-region');
     this._liveRegion.setAttribute('aria-live', 'assertive');
     this._accessibilityContainer.appendChild(this._liveRegion);
@@ -93,12 +93,12 @@ export class AccessibilityManager extends Disposable {
       this._rowContainer.classList.add('debug');
 
       // Use a `<div class="xterm">` container so that the css will still apply.
-      this._debugRootContainer = document.createElement('div');
+      this._debugRootContainer = doc.createElement('div');
       this._debugRootContainer.classList.add('xterm');
 
-      this._debugRootContainer.appendChild(document.createTextNode('------start a11y------'));
+      this._debugRootContainer.appendChild(doc.createTextNode('------start a11y------'));
       this._debugRootContainer.appendChild(this._accessibilityContainer);
-      this._debugRootContainer.appendChild(document.createTextNode('------end a11y------'));
+      this._debugRootContainer.appendChild(doc.createTextNode('------end a11y------'));
 
       this._terminal.element.insertAdjacentElement('afterend', this._debugRootContainer);
     } else {
@@ -115,9 +115,10 @@ export class AccessibilityManager extends Disposable {
     this.register(this._terminal.onKey(e => this._handleKey(e.key)));
     this.register(this._terminal.onBlur(() => this._clearLiveRegion()));
     this.register(this._renderService.onDimensionsChange(() => this._refreshRowsDimensions()));
-    this.register(addDisposableDomListener(document, 'selectionchange', () => this._handleSelectionChange()));
+    this.register(addDisposableDomListener(doc, 'selectionchange', () => this._handleSelectionChange()));
     this.register(this._coreBrowserService.onDprChange(() => this._refreshRowsDimensions()));
 
+    this._refreshRowsDimensions();
     this._refreshRows();
     this.register(toDisposable(() => {
       if (DEBUG) {
@@ -150,7 +151,7 @@ export class AccessibilityManager extends Disposable {
       if (char === '\n') {
         this._liveRegionLineCount++;
         if (this._liveRegionLineCount === MAX_ROWS_TO_READ + 1) {
-          this._liveRegion.textContent += Strings.tooMuchOutput;
+          this._liveRegion.textContent += Strings.tooMuchOutput.get();
         }
       }
     }
@@ -192,6 +193,7 @@ export class AccessibilityManager extends Disposable {
         }
         element.setAttribute('aria-posinset', posInSet);
         element.setAttribute('aria-setsize', setSize);
+        this._alignRowWidth(element);
       }
     }
     this._announceCharacters();
@@ -270,7 +272,7 @@ export class AccessibilityManager extends Disposable {
       return;
     }
 
-    const selection = document.getSelection();
+    const selection = this._coreBrowserService.mainDocument.getSelection();
     if (!selection) {
       return;
     }
@@ -389,19 +391,45 @@ export class AccessibilityManager extends Disposable {
     this._refreshRowDimensions(element);
     return element;
   }
+
   private _refreshRowsDimensions(): void {
     if (!this._renderService.dimensions.css.cell.height) {
       return;
     }
-    this._accessibilityContainer.style.width = `${this._renderService.dimensions.css.canvas.width}px`;
+    Object.assign(this._accessibilityContainer.style, {
+      width: `${this._renderService.dimensions.css.canvas.width}px`,
+      fontSize: `${this._terminal.options.fontSize}px`
+    });
     if (this._rowElements.length !== this._terminal.rows) {
       this._handleResize(this._terminal.rows);
     }
     for (let i = 0; i < this._terminal.rows; i++) {
       this._refreshRowDimensions(this._rowElements[i]);
+      this._alignRowWidth(this._rowElements[i]);
     }
   }
+
   private _refreshRowDimensions(element: HTMLElement): void {
     element.style.height = `${this._renderService.dimensions.css.cell.height}px`;
   }
+
+  /**
+   * Scale the width of a row so that each of the character is (mostly) aligned
+   * with the actual rendering. This will allow the screen reader to draw
+   * selection outline at the correct position.
+   *
+   * On top of using the "monospace" font and correct font size, the scaling
+   * here is necessary to handle characters that are not covered by the font
+   * (e.g. CJK).
+   */
+  private _alignRowWidth(element: HTMLElement): void {
+    element.style.transform = '';
+    const width = element.getBoundingClientRect().width;
+    const lastColumn = this._rowColumns.get(element)?.slice(-1)?.[0];
+    if (!lastColumn) {
+      return;
+    }
+    const targetWidth = lastColumn * this._renderService.dimensions.css.cell.width;
+    element.style.transform = `scaleX(${targetWidth / width})`;
+  }
 }

package/src/browser/{Terminal.ts → CoreBrowserTerminal.ts}

@@ -59,7 +59,7 @@ import { WindowsOptionsReportType } from '../common/InputHandler';
 import { AccessibilityManager } from './AccessibilityManager';
 import { LinkProviderService } from 'browser/services/LinkProviderService';
 
-export class Terminal extends CoreTerminal implements ITerminal {
+export class CoreBrowserTerminal extends CoreTerminal implements ITerminal {
   public textarea: HTMLTextAreaElement | undefined;
   public element: HTMLElement | undefined;
   public screenElement: HTMLElement | undefined;
@@ -443,7 +443,7 @@ export class Terminal extends CoreTerminal implements ITerminal {
 
     this.textarea = this._document.createElement('textarea');
     this.textarea.classList.add('xterm-helper-textarea');
-    this.textarea.setAttribute('aria-label', Strings.promptLabel);
+    this.textarea.setAttribute('aria-label', Strings.promptLabel.get());
     if (!Browser.isChromeOS) {
       // ChromeVox on ChromeOS does not like this. See
       // https://issuetracker.google.com/issues/260170397

package/src/browser/LocalizableStrings.ts

@@ -5,8 +5,19 @@
 
 // This file contains strings that get exported in the API so they can be localized
 
-// eslint-disable-next-line prefer-const
-export let promptLabel = 'Terminal input';
+let promptLabelInternal = 'Terminal input';
+const promptLabel = {
+  get: () => promptLabelInternal,
+  set: (value: string) => promptLabelInternal = value
+};
 
-// eslint-disable-next-line prefer-const
-export let tooMuchOutput = 'Too much output to announce, navigate to rows manually to read';
+let tooMuchOutputInternal = 'Too much output to announce, navigate to rows manually to read';
+const tooMuchOutput = {
+  get: () => tooMuchOutputInternal,
+  set: (value: string) => tooMuchOutputInternal = value
+};
+
+export {
+  promptLabel,
+  tooMuchOutput
+};

package/src/browser/{Types.d.ts → Types.ts}

@@ -7,6 +7,7 @@ import { IEvent } from 'common/EventEmitter';
 import { CharData, IColor, ICoreTerminal, ITerminalOptions } from 'common/Types';
 import { IBuffer } from 'common/buffer/Types';
 import { IDisposable, Terminal as ITerminalApi } from '@xterm/xterm';
+import { channels, css } from 'common/Color';
 
 /**
  * A portion of the public API that are implemented identially internally and simply passed through.
@@ -129,7 +130,7 @@ export interface ILinkifier2 extends IDisposable {
   readonly currentLink: ILinkWithState | undefined;
 }
 
-interface ILink {
+export interface ILink {
   range: IBufferRange;
   text: string;
   decorations?: ILinkDecorations;
@@ -139,17 +140,17 @@ interface ILink {
   dispose?(): void;
 }
 
-interface ILinkDecorations {
+export interface ILinkDecorations {
   pointerCursor: boolean;
   underline: boolean;
 }
 
-interface IBufferRange {
+export interface IBufferRange {
   start: IBufferCellPosition;
   end: IBufferCellPosition;
 }
 
-interface IBufferCellPosition {
+export interface IBufferCellPosition {
   x: number;
   y: number;
 }
@@ -172,3 +173,51 @@ export interface IRenderDebouncerWithCallback extends IRenderDebouncer {
 export interface IBufferElementProvider {
   provideBufferElements(): DocumentFragment | HTMLElement;
 }
+
+// An IIFE to generate DEFAULT_ANSI_COLORS.
+export const DEFAULT_ANSI_COLORS = Object.freeze((() => {
+  const colors = [
+    // dark:
+    css.toColor('#2e3436'),
+    css.toColor('#cc0000'),
+    css.toColor('#4e9a06'),
+    css.toColor('#c4a000'),
+    css.toColor('#3465a4'),
+    css.toColor('#75507b'),
+    css.toColor('#06989a'),
+    css.toColor('#d3d7cf'),
+    // bright:
+    css.toColor('#555753'),
+    css.toColor('#ef2929'),
+    css.toColor('#8ae234'),
+    css.toColor('#fce94f'),
+    css.toColor('#729fcf'),
+    css.toColor('#ad7fa8'),
+    css.toColor('#34e2e2'),
+    css.toColor('#eeeeec')
+  ];
+
+  // Fill in the remaining 240 ANSI colors.
+  // Generate colors (16-231)
+  const v = [0x00, 0x5f, 0x87, 0xaf, 0xd7, 0xff];
+  for (let i = 0; i < 216; i++) {
+    const r = v[(i / 36) % 6 | 0];
+    const g = v[(i / 6) % 6 | 0];
+    const b = v[i % 6];
+    colors.push({
+      css: channels.toCss(r, g, b),
+      rgba: channels.toRgba(r, g, b)
+    });
+  }
+
+  // Generate greys (232-255)
+  for (let i = 0; i < 24; i++) {
+    const c = 8 + i * 10;
+    colors.push({
+      css: channels.toCss(c, c, c),
+      rgba: channels.toRgba(c, c, c)
+    });
+  }
+
+  return colors;
+})());

package/src/browser/Viewport.ts

@@ -51,6 +51,8 @@ export class Viewport extends Disposable implements IViewport {
     target: -1
   };
 
+  private _ensureTimeout: number;
+
   private readonly _onRequestScrollLines = this.register(new EventEmitter<{ amount: number, suppressScrollEvent: boolean }>());
   public readonly onRequestScrollLines = this._onRequestScrollLines.event;
 
@@ -83,7 +85,7 @@ export class Viewport extends Disposable implements IViewport {
     this.register(this._optionsService.onSpecificOptionChange('scrollback', () => this.syncScrollArea()));
 
     // Perform this async to ensure the ICharSizeService is ready.
-    setTimeout(() => this.syncScrollArea());
+    this._ensureTimeout = window.setTimeout(() => this.syncScrollArea());
   }
 
   private _handleThemeChange(colors: ReadonlyColorSet): void {
@@ -405,4 +407,8 @@ export class Viewport extends Disposable implements IViewport {
     this._viewportElement.scrollTop += deltaY;
     return this._bubbleScroll(ev, deltaY);
   }
+
+  public dispose(): void {
+    clearTimeout(this._ensureTimeout);
+  }
 }

package/src/browser/decorations/BufferDecorationRenderer.ts

@@ -108,8 +108,13 @@ export class BufferDecorationRenderer extends Disposable {
           element!.remove();
         });
       }
-      element.style.top = `${line * this._renderService.dimensions.css.cell.height}px`;
       element.style.display = this._altBufferIsActive ? 'none' : 'block';
+      if (!this._altBufferIsActive) {
+        element.style.width = `${Math.round((decoration.options.width || 1) * this._renderService.dimensions.css.cell.width)}px`;
+        element.style.height = `${(decoration.options.height || 1) * this._renderService.dimensions.css.cell.height}px`;
+        element.style.top = `${line * this._renderService.dimensions.css.cell.height}px`;
+        element.style.lineHeight = `${this._renderService.dimensions.css.cell.height}px`;
+      }
       decoration.onRenderEmitter.fire(element);
     }
   }

package/src/browser/public/Terminal.ts

@@ -4,7 +4,7 @@
  */
 
 import * as Strings from 'browser/LocalizableStrings';
-import { Terminal as TerminalCore } from 'browser/Terminal';
+import { CoreBrowserTerminal as TerminalCore } from 'browser/CoreBrowserTerminal';
 import { IBufferRange, ITerminal } from 'browser/Types';
 import { IEvent } from 'common/EventEmitter';
 import { Disposable } from 'common/Lifecycle';
@@ -20,6 +20,8 @@ import { IBufferNamespace as IBufferNamespaceApi, IDecoration, IDecorationOption
  */
 const CONSTRUCTOR_ONLY_OPTIONS = ['cols', 'rows'];
 
+let $value = 0;
+
 export class Terminal extends Disposable implements ITerminalApi {
   private _core: ITerminal;
   private _addonManager: AddonManager;
@@ -245,20 +247,26 @@ export class Terminal extends Disposable implements ITerminalApi {
     this._addonManager.loadAddon(this, addon);
   }
   public static get strings(): ILocalizableStrings {
-    return Strings;
+    // A wrapper is required here because esbuild prevents setting an `export let`
+    return {
+      get promptLabel(): string { return Strings.promptLabel.get(); },
+      set promptLabel(value: string) { Strings.promptLabel.set(value); },
+      get tooMuchOutput(): string { return Strings.tooMuchOutput.get(); },
+      set tooMuchOutput(value: string) { Strings.tooMuchOutput.set(value); }
+    };
   }
 
   private _verifyIntegers(...values: number[]): void {
-    for (const value of values) {
-      if (value === Infinity || isNaN(value) || value % 1 !== 0) {
+    for ($value of values) {
+      if ($value === Infinity || isNaN($value) || $value % 1 !== 0) {
         throw new Error('This API only accepts integers');
       }
     }
   }
 
   private _verifyPositiveIntegers(...values: number[]): void {
-    for (const value of values) {
-      if (value && (value === Infinity || isNaN(value) || value % 1 !== 0 || value < 0)) {
+    for ($value of values) {
+      if ($value && ($value === Infinity || isNaN($value) || $value % 1 !== 0 || $value < 0)) {
         throw new Error('This API only accepts positive integers');
       }
     }

package/src/browser/renderer/dom/DomRenderer.ts

@@ -343,6 +343,9 @@ export class DomRenderer extends Disposable implements IRenderer {
     }
 
     this._selectionRenderModel.update(this._terminal, start, end, columnSelectMode);
+    if (!this._selectionRenderModel.hasSelection) {
+      return;
+    }
 
     // Translate from buffer position to viewport position
     const viewportStartRow = this._selectionRenderModel.viewportStartRow;
@@ -350,11 +353,6 @@ export class DomRenderer extends Disposable implements IRenderer {
     const viewportCappedStartRow = this._selectionRenderModel.viewportCappedStartRow;
     const viewportCappedEndRow = this._selectionRenderModel.viewportCappedEndRow;
 
-    // No need to draw the selection
-    if (viewportCappedStartRow >= this._bufferService.rows || viewportCappedEndRow < 0) {
-      return;
-    }
-
     // Create the selections
     const documentFragment = this._document.createDocumentFragment();
 

package/src/browser/renderer/shared/CustomGlyphs.ts

@@ -355,6 +355,12 @@ const enum VectorType {
  * Original symbols defined in https://github.com/powerline/fontpatcher
  */
 export const powerlineDefinitions: { [index: string]: IVectorShape } = {
+  // Git branch
+  '\u{E0A0}': { d: 'M.3,1 L.03,1 L.03,.88 C.03,.82,.06,.78,.11,.73 C.15,.7,.2,.68,.28,.65 L.43,.6 C.49,.58,.53,.56,.56,.53 C.59,.5,.6,.47,.6,.43 L.6,.27 L.4,.27 L.69,.1 L.98,.27 L.78,.27 L.78,.46 C.78,.52,.76,.56,.72,.61 C.68,.66,.63,.67,.56,.7 L.48,.72 C.42,.74,.38,.76,.35,.78 C.32,.8,.31,.84,.31,.88 L.31,1 M.3,.5 L.03,.59 L.03,.09 L.3,.09 L.3,.655', type: VectorType.FILL },
+  // L N
+  '\u{E0A1}': { d: 'M.7,.4 L.7,.47 L.2,.47 L.2,.03 L.355,.03 L.355,.4 L.705,.4 M.7,.5 L.86,.5 L.86,.95 L.69,.95 L.44,.66 L.46,.86 L.46,.95 L.3,.95 L.3,.49 L.46,.49 L.71,.78 L.69,.565 L.69,.5', type: VectorType.FILL },
+  // Lock
+  '\u{E0A2}': { d: 'M.25,.94 C.16,.94,.11,.92,.11,.87 L.11,.53 C.11,.48,.15,.455,.23,.45 L.23,.3 C.23,.25,.26,.22,.31,.19 C.36,.16,.43,.15,.51,.15 C.59,.15,.66,.16,.71,.19 C.77,.22,.79,.26,.79,.3 L.79,.45 C.87,.45,.91,.48,.91,.53 L.91,.87 C.91,.92,.86,.94,.77,.94 L.24,.94 M.53,.2 C.49,.2,.45,.21,.42,.23 C.39,.25,.38,.27,.38,.3 L.38,.45 L.68,.45 L.68,.3 C.68,.27,.67,.25,.64,.23 C.61,.21,.58,.2,.53,.2 M.58,.82 L.58,.66 C.63,.65,.65,.63,.65,.6 C.65,.58,.64,.57,.61,.56 C.58,.55,.56,.54,.52,.54 C.48,.54,.46,.55,.43,.56 C.4,.57,.39,.59,.39,.6 C.39,.63,.41,.64,.46,.66 L.46,.82 L.57,.82', type: VectorType.FILL },
   // Right triangle solid
   '\u{E0B0}': { d: 'M0,0 L1,.5 L0,1', type: VectorType.FILL, rightPadding: 2 },
   // Right triangle line

package/src/browser/services/CoreBrowserService.ts

@@ -13,7 +13,7 @@ export class CoreBrowserService extends Disposable implements ICoreBrowserServic
 
   private _isFocused = false;
   private _cachedIsFocused: boolean | undefined = undefined;
-  private _screenDprMonitor = new ScreenDprMonitor(this._window);
+  private _screenDprMonitor = this.register(new ScreenDprMonitor(this._window));
 
   private readonly _onDprChange = this.register(new EventEmitter<number>());
   public readonly onDprChange = this._onDprChange.event;
@@ -31,8 +31,12 @@ export class CoreBrowserService extends Disposable implements ICoreBrowserServic
     this.register(this.onWindowChange(w => this._screenDprMonitor.setWindow(w)));
     this.register(forwardEvent(this._screenDprMonitor.onDprChange, this._onDprChange));
 
-    this._textarea.addEventListener('focus', () => this._isFocused = true);
-    this._textarea.addEventListener('blur', () => this._isFocused = false);
+    this.register(
+      addDisposableDomListener(this._textarea, 'focus', () => (this._isFocused = true))
+    );
+    this.register(
+      addDisposableDomListener(this._textarea, 'blur', () => (this._isFocused = false))
+    );
   }
 
   public get window(): Window & typeof globalThis {

package/src/browser/services/ThemeService.ts

@@ -5,8 +5,8 @@
 
 import { ColorContrastCache } from 'browser/ColorContrastCache';
 import { IThemeService } from 'browser/services/Services';
-import { IColorContrastCache, IColorSet, ReadonlyColorSet } from 'browser/Types';
-import { channels, color, css, NULL_COLOR } from 'common/Color';
+import { DEFAULT_ANSI_COLORS, IColorContrastCache, IColorSet, ReadonlyColorSet } from 'browser/Types';
+import { color, css, NULL_COLOR } from 'common/Color';
 import { EventEmitter } from 'common/EventEmitter';
 import { Disposable } from 'common/Lifecycle';
 import { IOptionsService, ITheme } from 'common/services/Services';
@@ -29,54 +29,6 @@ const DEFAULT_SELECTION = {
   rgba: 0xFFFFFF4D
 };
 
-// An IIFE to generate DEFAULT_ANSI_COLORS.
-export const DEFAULT_ANSI_COLORS = Object.freeze((() => {
-  const colors = [
-    // dark:
-    css.toColor('#2e3436'),
-    css.toColor('#cc0000'),
-    css.toColor('#4e9a06'),
-    css.toColor('#c4a000'),
-    css.toColor('#3465a4'),
-    css.toColor('#75507b'),
-    css.toColor('#06989a'),
-    css.toColor('#d3d7cf'),
-    // bright:
-    css.toColor('#555753'),
-    css.toColor('#ef2929'),
-    css.toColor('#8ae234'),
-    css.toColor('#fce94f'),
-    css.toColor('#729fcf'),
-    css.toColor('#ad7fa8'),
-    css.toColor('#34e2e2'),
-    css.toColor('#eeeeec')
-  ];
-
-  // Fill in the remaining 240 ANSI colors.
-  // Generate colors (16-231)
-  const v = [0x00, 0x5f, 0x87, 0xaf, 0xd7, 0xff];
-  for (let i = 0; i < 216; i++) {
-    const r = v[(i / 36) % 6 | 0];
-    const g = v[(i / 6) % 6 | 0];
-    const b = v[i % 6];
-    colors.push({
-      css: channels.toCss(r, g, b),
-      rgba: channels.toRgba(r, g, b)
-    });
-  }
-
-  // Generate greys (232-255)
-  for (let i = 0; i < 24; i++) {
-    const c = 8 + i * 10;
-    colors.push({
-      css: channels.toCss(c, c, c),
-      rgba: channels.toRgba(c, c, c)
-    });
-  }
-
-  return colors;
-})());
-
 export class ThemeService extends Disposable implements IThemeService {
   public serviceBrand: undefined;
 

package/src/common/EventEmitter.ts

@@ -20,23 +20,18 @@ export interface IEventEmitter<T, U = void> {
 }
 
 export class EventEmitter<T, U = void> implements IEventEmitter<T, U> {
-  private _listeners: IListener<T, U>[] = [];
+  private _listeners: Set<IListener<T, U>> = new Set();
   private _event?: IEvent<T, U>;
   private _disposed: boolean = false;
 
   public get event(): IEvent<T, U> {
     if (!this._event) {
       this._event = (listener: (arg1: T, arg2: U) => any) => {
-        this._listeners.push(listener);
+        this._listeners.add(listener);
         const disposable = {
           dispose: () => {
             if (!this._disposed) {
-              for (let i = 0; i < this._listeners.length; i++) {
-                if (this._listeners[i] === listener) {
-                  this._listeners.splice(i, 1);
-                  return;
-                }
-              }
+              this._listeners.delete(listener);
             }
           }
         };
@@ -48,8 +43,8 @@ export class EventEmitter<T, U = void> implements IEventEmitter<T, U> {
 
   public fire(arg1: T, arg2: U): void {
     const queue: IListener<T, U>[] = [];
-    for (let i = 0; i < this._listeners.length; i++) {
-      queue.push(this._listeners[i]);
+    for (const l of this._listeners.values()) {
+      queue.push(l);
     }
     for (let i = 0; i < queue.length; i++) {
       queue[i].call(undefined, arg1, arg2);
@@ -63,7 +58,7 @@ export class EventEmitter<T, U = void> implements IEventEmitter<T, U> {
 
   public clearListeners(): void {
     if (this._listeners) {
-      this._listeners.length = 0;
+      this._listeners.clear();
     }
   }
 }