Merge pull request #3084 from Tyriar/release490

v4.9.0
2020-09-08 16:36:32 -07:00 · 2020-09-08 09:35:05 -07:00 · 2020-09-08 06:25:40 -07:00 · 2020-09-08 06:21:38 -07:00 · 2020-09-08 06:18:37 -07:00 · 2020-09-07 11:32:28 -07:00
62 changed files with 1403 additions and 892 deletions
@@ -1,16 +0,0 @@
-node_modules/
-*.swp
-.lock-wscript
-lib/
-Makefile.gyp
-*.Makefile
-*.target.gyp.mk
-*.node
-example/*.log
-docs/
-npm-debug.log
-/.idea/
-.env
-build/
-.vscode/
-.git/
@@ -32,6 +32,7 @@
    "@typescript-eslint"
  ],
  "rules": {
+    "no-extra-semi": "error",
    "@typescript-eslint/array-type": [
      "warn",
      {
@@ -39,7 +40,6 @@
        "readonly": "generic"
      }
    ],
-    "@typescript-eslint/class-name-casing": "warn",
    "@typescript-eslint/consistent-type-definitions": "warn",
    "@typescript-eslint/explicit-function-return-type": [
      "warn",
@@ -60,10 +60,6 @@
      "warn",
      2
    ],
-    "@typescript-eslint/interface-name-prefix": [
-      "warn",
-      "always"
-    ],
    "@typescript-eslint/member-delimiter-style": [
      "warn",
      {
@@ -1,19 +0,0 @@
-FROM node:8
-MAINTAINER Paris Kasidiaris <paris@sourcelair.com>
-
-# Set the working directory
-WORKDIR /usr/src/app
-
-# Set an entrypoint, to automatically install node modules
-ENTRYPOINT ["/bin/bash", "-c", "if [[ ! -d node_modules ]]; then npm install; fi; exec \"${@:0}\";"]
-CMD ["npm", "run", "start"]
-
-# First, install dependencies to improve layer caching
-COPY package.json /usr/src/app/
-RUN npm install
-
-# Add the code
-COPY . /usr/src/app
-
-# Run the tests and build, to make sure everything is working nicely
-RUN npm run build && npm run test
@@ -162,7 +162,12 @@ Xterm.js is used in several world-class applications to provide great terminal e
 - [**x-terminal**](https://atom.io/packages/x-terminal): Atom plugin for providing terminals inside your Atom workspace.
 - [**CoCalc**](https://cocalc.com/): Lots of free software pre-installed, to chat, collaborate, develop, program, publish, research, share, teach, in C++, HTML, Julia, Jupyter, LaTeX, Markdown, Python, R, SageMath, Scala, ...
 - [**Dank Domain**](https://www.DDgame.us/): Open source multiuser medieval game supporting old & new terminal emulation.
-
+- [**DockerStacks**](https://docker-stacks.com/): Local LAMP/LEMP development studio
+- [**Codecademy**](https://codecademy.com/): Uses xterm.js in its courses on Bash. 
+- [**Laravel Ssh Web Client**](https://github.com/roke22/Laravel-ssh-client): Laravel server inventory with ssh web client to connect at server using xterm.js
+- [**Repl.it**](https://repl.it): Collaborative browser based IDE with support for 50+ different languages.
+- [**TeleType**](https://github.com/akshaykmr/TeleType): cli tool that allows you to share your terminal online conveniently. Show off mad cli-fu, help a colleague, teach, or troubleshoot.
+- [**Intervue**](https://www.intervue.io): Pair programming for interviews. Multiple programming languages supported, with results displayed by xterm.js.
 [And much more...](https://github.com/xtermjs/xterm.js/network/dependents)

 Do you use xterm.js in your application as well? Please [open a Pull Request](https://github.com/sourcelair/xterm.js/pulls) to include it here. We would love to have it in our list. Note: Please add any new contributions to the end of the list only.
@@ -12,7 +12,7 @@ const mkdirp = require('mkdirp');
 const yauzl = require('yauzl');

 const urls = {
-  fira: 'https://github.com/tonsky/FiraCode/raw/master/distr/otf/FiraCode-Regular.otf',
+  fira: 'https://github.com/tonsky/FiraCode/raw/d42e7276fa925e5f82748f3ec9ea429736611b48/distr/otf/FiraCode-Regular.otf',
  iosevka: 'https://github.com/be5invis/Iosevka/releases/download/v1.14.3/01-iosevka-1.14.3.zip'
 };

@@ -32,13 +32,13 @@
  "license": "MIT",
  "dependencies": {
    "font-finder": "^1.0.4",
-    "font-ligatures": "^1.3.2"
+    "font-ligatures": "^1.3.3"
  },
  "devDependencies": {
    "@types/sinon": "^5.0.1",
    "axios": "^0.18.0",
-    "mkdirp": "^0.5.1",
-    "sinon": "^6.1.3",
+    "mkdirp": "0.5.5",
+    "sinon": "6.3.5",
    "yauzl": "^2.10.0"
  },
  "peerDependencies": {
@@ -2,20 +2,49 @@
 # yarn lockfile v1


-"@sinonjs/formatio@^2.0.0":
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/@sinonjs/formatio/-/formatio-2.0.0.tgz#84db7e9eb5531df18a8c5e0bfb6e449e55e654b2"
+"@sinonjs/commons@^1", "@sinonjs/commons@^1.0.2", "@sinonjs/commons@^1.3.0", "@sinonjs/commons@^1.7.0":
+  version "1.8.0"
+  resolved "https://registry.yarnpkg.com/@sinonjs/commons/-/commons-1.8.0.tgz#c8d68821a854c555bba172f3b06959a0039b236d"
+  integrity sha512-wEj54PfsZ5jGSwMX68G8ZXFawcSglQSXqCftWX3ec8MDUzQdHgcKvw97awHbY0efQEL5iKUOAmmVtoYgmrSG4Q==
  dependencies:
-    samsam "1.3.0"
+    type-detect "4.0.8"

-"@sinonjs/samsam@^2.0.0":
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/@sinonjs/samsam/-/samsam-2.0.0.tgz#9163742ac35c12d3602dece74317643b35db6a80"
+"@sinonjs/formatio@^3.0.0", "@sinonjs/formatio@^3.2.1":
+  version "3.2.2"
+  resolved "https://registry.yarnpkg.com/@sinonjs/formatio/-/formatio-3.2.2.tgz#771c60dfa75ea7f2d68e3b94c7e888a78781372c"
+  integrity sha512-B8SEsgd8gArBLMD6zpRw3juQ2FVSsmdd7qlevyDqzS9WTCtvF55/gAL+h6gue8ZvPYcdiPdvueM/qm//9XzyTQ==
+  dependencies:
+    "@sinonjs/commons" "^1"
+    "@sinonjs/samsam" "^3.1.0"
+
+"@sinonjs/samsam@^2.1.2":
+  version "2.1.3"
+  resolved "https://registry.yarnpkg.com/@sinonjs/samsam/-/samsam-2.1.3.tgz#62cf2a9b624edc795134135fe37fc2ae8ea36be3"
+  integrity sha512-8zNeBkSKhU9a5cRNbpCKau2WWPfan+Q2zDlcXvXyhn9EsMqgYs4qzo0XHNVlXC6ABQL8fT6nV+zzo5RTHJzyXw==
+
+"@sinonjs/samsam@^3.1.0":
+  version "3.3.3"
+  resolved "https://registry.yarnpkg.com/@sinonjs/samsam/-/samsam-3.3.3.tgz#46682efd9967b259b81136b9f120fd54585feb4a"
+  integrity sha512-bKCMKZvWIjYD0BLGnNrxVuw4dkWCYsLqFOUWw8VgKF/+5Y+mE7LfHWPIYoDXowH+3a9LsWDMo0uAP8YDosPvHQ==
+  dependencies:
+    "@sinonjs/commons" "^1.3.0"
+    array-from "^2.1.1"
+    lodash "^4.17.15"
+
+"@sinonjs/text-encoding@^0.7.1":
+  version "0.7.1"
+  resolved "https://registry.yarnpkg.com/@sinonjs/text-encoding/-/text-encoding-0.7.1.tgz#8da5c6530915653f3a1f38fd5f101d8c3f8079c5"
+  integrity sha512-+iTbntw2IZPb/anVDbypzfQa+ay64MW0Zo8aJ8gZPWMMK6/OubMVb6lUPMagqjOPnmtauXnFCACVl3O7ogjeqQ==

 "@types/sinon@^5.0.1":
  version "5.0.1"
  resolved "https://registry.yarnpkg.com/@types/sinon/-/sinon-5.0.1.tgz#a15b36ec42f1f53166617491feabd1734cb03e21"

+array-from@^2.1.1:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/array-from/-/array-from-2.1.1.tgz#cfe9d8c26628b9dc5aecc62a9f5d8f1f352c1195"
+  integrity sha1-z+nYwmYoudxa7MYqn12PHzUsEZU=
+
 axios@^0.18.0:
  version "0.18.1"
  resolved "https://registry.yarnpkg.com/axios/-/axios-0.18.1.tgz#ff3f0de2e7b5d180e757ad98000f1081b87bcea3"
@@ -56,9 +85,10 @@ font-finder@^1.0.3, font-finder@^1.0.4:
    get-system-fonts "^2.0.0"
    promise-stream-reader "^1.0.1"

-font-ligatures@^1.3.2:
-  version "1.3.2"
-  resolved "https://registry.yarnpkg.com/font-ligatures/-/font-ligatures-1.3.2.tgz#227eb5fc38fef34b5373aa19b555320b82842a71"
+font-ligatures@^1.3.3:
+  version "1.3.3"
+  resolved "https://registry.yarnpkg.com/font-ligatures/-/font-ligatures-1.3.3.tgz#63fff18dc8adb3a11fe5eec1f4e8d7edfa8075b9"
+  integrity sha512-NSGpHgVNX81M7AWS1XylK1UZbN3QllfUIDAAuPv6TUcl5O2b781JcKS5L2RopAU0AqlTyX3ZuX/04eaMpbVrHA==
  dependencies:
    font-finder "^1.0.3"
    lru-cache "^4.1.3"
@@ -80,17 +110,31 @@ isarray@0.0.1:
  version "0.0.1"
  resolved "https://registry.yarnpkg.com/isarray/-/isarray-0.0.1.tgz#8a18acfca9a8f4177e09abfc6038939b05d1eedf"

-just-extend@^1.1.27:
-  version "1.1.27"
-  resolved "https://registry.yarnpkg.com/just-extend/-/just-extend-1.1.27.tgz#ec6e79410ff914e472652abfa0e603c03d60e905"
+just-extend@^4.0.2:
+  version "4.1.0"
+  resolved "https://registry.yarnpkg.com/just-extend/-/just-extend-4.1.0.tgz#7278a4027d889601640ee0ce0e5a00b992467da4"
+  integrity sha512-ApcjaOdVTJ7y4r08xI5wIqpvwS48Q0PBG4DJROcEkH1f8MdAiNFyFxz3xoL0LWAVwjrwPYZdVHHxhRHcx/uGLA==

 lodash.get@^4.4.2:
  version "4.4.2"
  resolved "https://registry.yarnpkg.com/lodash.get/-/lodash.get-4.4.2.tgz#2d177f652fa31e939b4438d5341499dfa3825e99"

-lolex@^2.3.2, lolex@^2.4.2:
-  version "2.7.1"
-  resolved "https://registry.yarnpkg.com/lolex/-/lolex-2.7.1.tgz#e40a8c4d1f14b536aa03e42a537c7adbaf0c20be"
+lodash@^4.17.15:
+  version "4.17.19"
+  resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.19.tgz#e48ddedbe30b3321783c5b4301fbd353bc1e4a4b"
+  integrity sha512-JNvd8XER9GQX0v2qJgsaN/mzFCNA5BRe/j8JN9d+tWyGLSodKQHKFicdwNYzWwI3wjRnaKPsGj1XkBjx/F96DQ==
+
+lolex@^2.7.5:
+  version "2.7.5"
+  resolved "https://registry.yarnpkg.com/lolex/-/lolex-2.7.5.tgz#113001d56bfc7e02d56e36291cc5c413d1aa0733"
+  integrity sha512-l9x0+1offnKKIzYVjyXU2SiwhXDLekRzKyhnbyldPHvC7BvLPVpdNUNR2KeMAiCN2D/kLNttZgQD5WjSxuBx3Q==
+
+lolex@^5.0.1:
+  version "5.1.2"
+  resolved "https://registry.yarnpkg.com/lolex/-/lolex-5.1.2.tgz#953694d098ce7c07bc5ed6d0e42bc6c0c6d5a367"
+  integrity sha512-h4hmjAvHTmd+25JSwrtTIuwbKdwg5NzZVRMLn9saij4SZaepCrTCxPr35H/3bjwfMJtN+t3CX8672UIkglz28A==
+  dependencies:
+    "@sinonjs/commons" "^1.7.0"

 lru-cache@^4.1.3:
  version "4.1.3"
@@ -99,29 +143,32 @@ lru-cache@^4.1.3:
    pseudomap "^1.0.2"
    yallist "^2.1.2"

-minimist@0.0.8:
-  version "0.0.8"
-  resolved "https://registry.yarnpkg.com/minimist/-/minimist-0.0.8.tgz#857fcabfc3397d2625b8228262e86aa7a011b05d"
+minimist@^1.2.5:
+  version "1.2.5"
+  resolved "https://registry.yarnpkg.com/minimist/-/minimist-1.2.5.tgz#67d66014b66a6a8aaa0c083c5fd58df4e4e97602"
+  integrity sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==

-mkdirp@^0.5.1:
-  version "0.5.1"
-  resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.5.1.tgz#30057438eac6cf7f8c4767f38648d6697d75c903"
+mkdirp@0.5.5:
+  version "0.5.5"
+  resolved "https://registry.yarnpkg.com/mkdirp/-/mkdirp-0.5.5.tgz#d91cefd62d1436ca0f41620e251288d420099def"
+  integrity sha512-NKmAlESf6jMGym1++R0Ra7wvhV+wFW63FaSOFPwRahvea0gMUcGUhVeAg/0BC0wiv9ih5NYPB1Wn1UEI1/L+xQ==
  dependencies:
-    minimist "0.0.8"
+    minimist "^1.2.5"

 ms@2.0.0:
  version "2.0.0"
  resolved "https://registry.yarnpkg.com/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8"

-nise@^1.3.3:
-  version "1.4.2"
-  resolved "https://registry.yarnpkg.com/nise/-/nise-1.4.2.tgz#a9a3800e3994994af9e452333d549d60f72b8e8c"
+nise@^1.4.5:
+  version "1.5.3"
+  resolved "https://registry.yarnpkg.com/nise/-/nise-1.5.3.tgz#9d2cfe37d44f57317766c6e9408a359c5d3ac1f7"
+  integrity sha512-Ymbac/94xeIrMf59REBPOv0thr+CJVFMhrlAkW/gjCIE58BGQdCj0x7KRCb3yz+Ga2Rz3E9XXSvUyyxqqhjQAQ==
  dependencies:
-    "@sinonjs/formatio" "^2.0.0"
-    just-extend "^1.1.27"
-    lolex "^2.3.2"
+    "@sinonjs/formatio" "^3.2.1"
+    "@sinonjs/text-encoding" "^0.7.1"
+    just-extend "^4.0.2"
+    lolex "^5.0.1"
    path-to-regexp "^1.7.0"
-    text-encoding "^0.6.4"

 opentype.js@^0.8.0:
  version "0.8.0"
@@ -147,38 +194,33 @@ pseudomap@^1.0.2:
  version "1.0.2"
  resolved "https://registry.yarnpkg.com/pseudomap/-/pseudomap-1.0.2.tgz#f052a28da70e618917ef0a8ac34c1ae5a68286b3"

-samsam@1.3.0:
-  version "1.3.0"
-  resolved "https://registry.yarnpkg.com/samsam/-/samsam-1.3.0.tgz#8d1d9350e25622da30de3e44ba692b5221ab7c50"
-
-sinon@^6.1.3:
-  version "6.1.3"
-  resolved "https://registry.yarnpkg.com/sinon/-/sinon-6.1.3.tgz#98e7d716b7b11f7f1200e9c997e74f50ae094660"
+sinon@6.3.5:
+  version "6.3.5"
+  resolved "https://registry.yarnpkg.com/sinon/-/sinon-6.3.5.tgz#0f6d6a5b4ebaad1f6e8e019395542d1d02c144a0"
+  integrity sha512-xgoZ2gKjyVRcF08RrIQc+srnSyY1JDJtxu3Nsz07j1ffjgXoY6uPLf/qja6nDBZgzYYEovVkFryw2+KiZz11xQ==
  dependencies:
-    "@sinonjs/formatio" "^2.0.0"
-    "@sinonjs/samsam" "^2.0.0"
+    "@sinonjs/commons" "^1.0.2"
+    "@sinonjs/formatio" "^3.0.0"
+    "@sinonjs/samsam" "^2.1.2"
    diff "^3.5.0"
    lodash.get "^4.4.2"
-    lolex "^2.4.2"
-    nise "^1.3.3"
-    supports-color "^5.4.0"
+    lolex "^2.7.5"
+    nise "^1.4.5"
+    supports-color "^5.5.0"
    type-detect "^4.0.8"

-supports-color@^5.4.0:
-  version "5.4.0"
-  resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.4.0.tgz#1c6b337402c2137605efe19f10fec390f6faab54"
+supports-color@^5.5.0:
+  version "5.5.0"
+  resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f"
+  integrity sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==
  dependencies:
    has-flag "^3.0.0"

-text-encoding@^0.6.4:
-  version "0.6.4"
-  resolved "https://registry.yarnpkg.com/text-encoding/-/text-encoding-0.6.4.tgz#e399a982257a276dae428bb92845cb71bdc26d19"
-
 tiny-inflate@^1.0.2:
  version "1.0.2"
  resolved "https://registry.yarnpkg.com/tiny-inflate/-/tiny-inflate-1.0.2.tgz#93d9decffc8805bd57eae4310f0b745e9b6fb3a7"

-type-detect@^4.0.8:
+type-detect@4.0.8, type-detect@^4.0.8:
  version "4.0.8"
  resolved "https://registry.yarnpkg.com/type-detect/-/type-detect-4.0.8.tgz#7646fb5f18871cfbb7749e69bd39a6388eb7450c"

@@ -1,6 +1,6 @@
 {
  "name": "xterm-addon-serialize",
-  "version": "0.3.0",
+  "version": "0.4.0",
  "author": {
    "name": "The xterm.js authors",
    "url": "https://xtermjs.org/"
@@ -270,6 +270,35 @@ describe('SerializeAddon', () => {
    await writeSync(page, lines.join('\\r\\n'));
    assert.equal(await page.evaluate(`serializeAddon.serialize();`), expected.join('\r\n'));
  });
+
+  it('serialize CJK correctly', async () => {
+    const lines = [
+      '中文中文',
+      '12中文',
+      '中文12',
+      '1中文中文中' // this line is going to be wrapped at last character because it has line length of 11 (1+2*5)
+    ];
+    const expected = [
+      '中文中文',
+      '12中文',
+      '中文12',
+      '1中文中文',
+      '中'
+    ];
+    await writeSync(page, lines.join('\\r\\n'));
+    assert.equal(await page.evaluate(`serializeAddon.serialize();`), expected.join('\r\n'));
+  });
+
+  it('serialize CJK Mixed with tab correctly', async () => {
+    const lines = [
+      '中文\t12' // CJK mixed with tab
+    ];
+    const expected = [
+      '中文\x1b[4C12'
+    ];
+    await writeSync(page, lines.join('\\r\\n'));
+    assert.equal(await page.evaluate(`serializeAddon.serialize();`), expected.join('\r\n'));
+  });
 });

 function newArray<T>(initial: T | ((index: number) => T), count: number): T[] {
@@ -138,7 +138,7 @@ class StringSerializeHandler extends BaseSerializeHandler {
    // Count number of null cells encountered after the last non-null cell and move the cursor
    // if a non-null cell is found (eg. \t or cursor move)
    if (cell.getChars() === '') {
-      this._nullCellCount++;
+      this._nullCellCount += cell.getWidth();
    } else if (this._nullCellCount > 0) {
      this._currentRow += `\x1b[${this._nullCellCount}C`;
      this._nullCellCount = 0;
@@ -1,6 +1,6 @@
 {
  "name": "xterm-addon-webgl",
-  "version": "0.7.0",
+  "version": "0.9.0",
  "author": {
    "name": "The xterm.js authors",
    "url": "https://xtermjs.org/"
@@ -196,7 +196,7 @@ export class RectangleRenderer {
    } else {
      // Draw first row
      const startCol = model.viewportStartRow === model.viewportCappedStartRow ? model.startCol : 0;
-      const startRowEndCol = model.viewportCappedStartRow === model.viewportCappedEndRow ? model.endCol : terminal.cols;
+      const startRowEndCol = model.viewportCappedStartRow === model.viewportEndRow ? model.endCol : terminal.cols;
      this._addRectangleFloat(
        this._vertices.selection,
        0,
@@ -43,7 +43,6 @@ export class RenderModel implements IRenderModel {
  public clear(): void {
    fill(this.cells, 0, 0);
    fill(this.lineLengths, 0, 0);
-    this.clearSelection();
  }

  public clearSelection(): void {
@@ -40,4 +40,8 @@ export class WebglAddon implements ITerminalAddon {
  public get textureAtlas(): HTMLCanvasElement | undefined {
    return this._renderer?.textureAtlas;
  }
+
+  public clearTextureAtlas(): void {
+    this._renderer?.clearCharAtlas();
+  }
 }
@@ -16,14 +16,12 @@ let page: Page;
 const width = 800;
 const height = 600;

-let itWebgl: (expectation: string, callback?: (this: Mocha.ITestCallbackContext, done: MochaDone) => any) => Mocha.ITest | void;
-
 describe('WebGL Renderer Integration Tests', async () => {
  const browserType = getBrowserType();
  const isHeadless = process.argv.indexOf('--headless') !== -1;
  // Firefox works only in non-headless mode https://github.com/microsoft/playwright/issues/1032
  const areTestsEnabled = browserType.name() === 'chromium' || (browserType.name() === 'firefox' && !isHeadless);
-  itWebgl = areTestsEnabled ? it : it.skip;
+  const itWebgl = areTestsEnabled ? it : it.skip;

  itWebgl('dispose removes renderer canvases', async function(): Promise<void> {
    await setupBrowser();
@@ -121,6 +121,7 @@ export class WebglRenderer extends Disposable implements IRenderer {

    // Force a full refresh
    this._model.clear();
+    this._model.clearSelection();
  }

  public onDevicePixelRatioChange(): void {
@@ -158,6 +159,7 @@ export class WebglRenderer extends Disposable implements IRenderer {

    // Force a full refresh
    this._model.clear();
+    this._model.clearSelection();
  }

  public onCharSizeChanged(): void {
@@ -214,6 +216,14 @@ export class WebglRenderer extends Disposable implements IRenderer {
    this._glyphRenderer.setAtlas(this._charAtlas);
  }

+  public clearCharAtlas(): void {
+    this._charAtlas?.clearTexture();
+    this._model.clear();
+    this._updateModel(0, this._terminal.rows - 1);
+    this._glyphRenderer.updateSelection(this._model);
+    this._onRequestRedraw.fire({ start: 0, end: this._terminal.rows - 1 });
+  }
+
  public clear(): void {
    this._renderLayers.forEach(l => l.reset(this._terminal));
  }
@@ -243,6 +253,7 @@ export class WebglRenderer extends Disposable implements IRenderer {
    // Tell renderer the frame is beginning
    if (this._glyphRenderer.beginFrame()) {
      this._model.clear();
+      this._model.clearSelection();
    }

    // Update model to reflect what's drawn
@@ -20,7 +20,7 @@ export function generateConfig(scaledCharWidth: number, scaledCharHeight: number
    background: colors.background,
    cursor: NULL_COLOR,
    cursorAccent: NULL_COLOR,
-    selection: NULL_COLOR,
+    selectionTransparent: NULL_COLOR,
    selectionOpaque: NULL_COLOR,
    // For the static char atlas, we only use the first 16 colors, but we need all 256 for the
    // dynamic character atlas.
@@ -101,7 +101,7 @@ export class WebglCharAtlas implements IDisposable {
    }
  }

-  protected _doWarmUp(): void {
+  private _doWarmUp(): void {
    // Pre-fill with ASCII 33-126
    for (let i = 33; i < 126; i++) {
      const rasterizedGlyph = this._drawToCache(i, DEFAULT_COLOR, DEFAULT_COLOR);
@@ -115,17 +115,26 @@ export class WebglCharAtlas implements IDisposable {

  public beginFrame(): boolean {
    if (this._currentRowY > TEXTURE_CAPACITY) {
-      this._cacheCtx.clearRect(0, 0, TEXTURE_WIDTH, TEXTURE_HEIGHT);
-      this._cacheMap = {};
-      this._currentRowHeight = 0;
-      this._currentRowX = 0;
-      this._currentRowY = 0;
-      this._doWarmUp();
+      this.clearTexture();
+      this.warmUp();
      return true;
    }
    return false;
  }

+  public clearTexture(): void {
+    if (this._currentRowX === 0 && this._currentRowY === 0) {
+      return;
+    }
+    this._cacheCtx.clearRect(0, 0, TEXTURE_WIDTH, TEXTURE_HEIGHT);
+    this._cacheMap = {};
+    this._cacheMapCombined = {};
+    this._currentRowHeight = 0;
+    this._currentRowX = 0;
+    this._currentRowY = 0;
+    this._didWarmUp = false;
+  }
+
  public getRasterizedGlyphCombinedChar(chars: string, bg: number, fg: number): IRasterizedGlyph {
    let rasterizedGlyphSet = this._cacheMapCombined[chars];
    if (!rasterizedGlyphSet) {
@@ -3,7 +3,7 @@
 * @license MIT
 */

-import { Terminal, IDisposable, ITerminalAddon } from 'xterm';
+import { Terminal, ITerminalAddon } from 'xterm';

 declare module 'xterm-addon-webgl' {
  /**
@@ -15,7 +15,7 @@ declare module 'xterm-addon-webgl' {
    constructor(preserveDrawingBuffer?: boolean);

    /**
-     * Activates the addon
+     * Activates the addon.
     * @param terminal The terminal the addon is being loaded in.
     */
    public activate(terminal: Terminal): void;
@@ -24,5 +24,10 @@ declare module 'xterm-addon-webgl' {
     * Disposes the addon.
     */
    public dispose(): void;
+
+    /**
+     * Clears the terminal's texture atlas and triggers a redraw.
+     */
+    public clearTextureAtlas(): void;
  }
 }
@@ -59,10 +59,10 @@
 }

 .xterm .xterm-helper-textarea {
-    /*
-     * HACK: to fix IE's blinking cursor
-     * Move textarea out of the screen to the far left, so that the cursor is not visible.
-     */
+    padding: 0;
+    border: 0;
+    margin: 0;
+    /* Move textarea out of the screen to the far left, so that the cursor is not visible */
    position: absolute;
    opacity: 0;
    left: -9999em;
@@ -1,17 +0,0 @@
-version: "3"
-
-services:
-  web:
-    image: xtermjs/xterm.js:latest
-    build: .
-    volumes:
-      - ./:/usr/src/app
-    ports:
-      - ${XTERMJS_PORT:-3000}:3000
-    command: ["npm", "start"]
-
-  watch:
-    build: .
-    volumes:
-      - ./:/usr/src/app
-    command: ["npm", "run", "watch"]
@@ -1,7 +1,7 @@
 {
  "name": "xterm",
  "description": "Full xterm terminal, in your browser",
-  "version": "4.6.0",
+  "version": "4.9.0",
  "main": "lib/xterm.js",
  "style": "css/xterm.css",
  "types": "typings/xterm.d.ts",
@@ -36,37 +36,37 @@
    "vtfeatures": "node bin/extract_vtfeatures.js src/**/*.ts src/*.ts"
  },
  "devDependencies": {
-    "@types/chai": "^4.2.11",
+    "@types/chai": "^4.2.12",
    "@types/debug": "^4.1.5",
    "@types/deep-equal": "^1.0.1",
-    "@types/glob": "^7.1.1",
-    "@types/jsdom": "^16.2.1",
-    "@types/mocha": "^7.0.2",
+    "@types/glob": "^7.1.3",
+    "@types/jsdom": "^16.2.4",
+    "@types/mocha": "^8.0.3",
    "@types/node": "^10.17.17",
    "@types/utf8": "^2.1.6",
-    "@types/webpack": "^4.41.12",
-    "@types/ws": "^7.2.4",
-    "@typescript-eslint/eslint-plugin": "^2.33.0",
-    "@typescript-eslint/parser": "^2.33.0",
+    "@types/webpack": "^4.41.22",
+    "@types/ws": "^7.2.6",
+    "@typescript-eslint/eslint-plugin": "^4.0.0",
+    "@typescript-eslint/parser": "^3.10.1",
    "chai": "^4.2.0",
    "deep-equal": "^2.0.3",
-    "eslint": "^6.8.0",
+    "eslint": "^7.8.1",
    "express": "^4.17.1",
    "express-ws": "^4.0.0",
    "glob": "^7.0.5",
-    "jsdom": "^16.2.2",
-    "mocha": "^7.1.2",
+    "jsdom": "^16.4.0",
+    "mocha": "^8.1.3",
    "mustache": "^4.0.1",
    "node-pty": "^0.9.0",
-    "nyc": "^15.0.1",
+    "nyc": "^15.1.0",
    "playwright-core": "^0.11.1",
-    "source-map-loader": "^0.2.4",
-    "ts-loader": "^7.0.4",
-    "typescript": "3.9",
+    "source-map-loader": "^1.1.0",
+    "ts-loader": "^8.0.3",
+    "typescript": "4.0",
    "utf8": "^3.0.0",
-    "webpack": "^4.43.0",
-    "webpack-cli": "^3.3.11",
-    "ws": "^7.3.0",
+    "webpack": "^4.44.1",
+    "webpack-cli": "^3.3.12",
+    "ws": "^7.3.1",
    "xterm-benchmark": "^0.1.3"
  }
 }
@@ -12,6 +12,7 @@ import { addDisposableDomListener } from 'browser/Lifecycle';
 import { Disposable } from 'common/Lifecycle';
 import { ScreenDprMonitor } from 'browser/ScreenDprMonitor';
 import { IRenderService } from 'browser/services/Services';
+import { removeElementFromParent } from 'browser/Dom';

 const MAX_ROWS_TO_READ = 20;

@@ -56,7 +57,7 @@ export class AccessibilityManager extends Disposable {

    this._rowContainer = document.createElement('div');
    this._rowContainer.classList.add('xterm-accessibility-tree');
-    this._rowContainer.setAttribute('role', 'list');
+    this._rowContainer.setAttribute('role', 'document');
    this._rowElements = [];
    for (let i = 0; i < this._terminal.rows; i++) {
      this._rowElements[i] = this._createAccessibilityTreeNode();
@@ -106,7 +107,7 @@ export class AccessibilityManager extends Disposable {

  public dispose(): void {
    super.dispose();
-    this._terminal.element?.removeChild(this._accessibilityTreeRoot);
+    removeElementFromParent(this._accessibilityTreeRoot);
    this._rowElements.length = 0;
  }

@@ -240,9 +241,7 @@ export class AccessibilityManager extends Disposable {

    // Only detach/attach on mac as otherwise messages can go unaccounced
    if (isMac) {
-      if (this._liveRegion.parentNode) {
-        this._accessibilityTreeRoot.removeChild(this._liveRegion);
-      }
+      removeElementFromParent(this._liveRegion);
    }
  }

@@ -70,7 +70,6 @@ export function moveTextAreaUnderMouseCursor(ev: MouseEvent, textarea: HTMLTextA
  const top = ev.clientY - pos.top - 10;

  // Bring textarea at the cursor position
-  textarea.style.position = 'absolute';
  textarea.style.width = '20px';
  textarea.style.height = '20px';
  textarea.style.left = `${left}px`;
@@ -78,17 +77,6 @@ export function moveTextAreaUnderMouseCursor(ev: MouseEvent, textarea: HTMLTextA
  textarea.style.zIndex = '1000';

  textarea.focus();
-
-  // Reset the terminal textarea's styling
-  // Timeout needs to be long enough for click event to be handled.
-  setTimeout(() => {
-    textarea.style.position = '';
-    textarea.style.width = '';
-    textarea.style.height = '';
-    textarea.style.left = '';
-    textarea.style.top = '';
-    textarea.style.zIndex = '';
-  }, 200);
 }

 /**
@@ -117,11 +117,43 @@ describe('Color', () => {
        assert.deepEqual(color.opaque({ css: '#ffffffff', rgba: 0xffffffff }), { css: '#ffffff', rgba: 0xffffffFF });
      });
    });
+
+    describe('isOpaque', () => {
+      it('should return true for opaque colors', () => {
+        assert.ok(color.isOpaque(css.toColor('#000000')));
+        assert.ok(color.isOpaque(css.toColor('#000000ff')));
+        assert.ok(color.isOpaque(css.toColor('#808080')));
+        assert.ok(color.isOpaque(css.toColor('#808080ff')));
+        assert.ok(color.isOpaque(css.toColor('#ffffff')));
+        assert.ok(color.isOpaque(css.toColor('#ffffffff')));
+      });
+      it('should return false for transparent colors', () => {
+        assert.ok(!color.isOpaque(css.toColor('#00000000')));
+        assert.ok(!color.isOpaque(css.toColor('#00000080')));
+        assert.ok(!color.isOpaque(css.toColor('#000000fe')));
+        assert.ok(!color.isOpaque(css.toColor('#80808000')));
+        assert.ok(!color.isOpaque(css.toColor('#80808080')));
+        assert.ok(!color.isOpaque(css.toColor('#808080fe')));
+        assert.ok(!color.isOpaque(css.toColor('#ffffff00')));
+        assert.ok(!color.isOpaque(css.toColor('#ffffff80')));
+        assert.ok(!color.isOpaque(css.toColor('#fffffffe')));
+      });
+    });
+
+    describe('opacity', () => {
+      it('should make the color transparent', () => {
+        assert.deepEqual(color.opacity(css.toColor('#000000'), 0), { css: '#00000000', rgba: 0x00000000 });
+        assert.deepEqual(color.opacity(css.toColor('#000000'), 0.25), { css: '#00000040', rgba: 0x00000040 });
+        assert.deepEqual(color.opacity(css.toColor('#000000'), 0.5), { css: '#00000080', rgba: 0x00000080 });
+        assert.deepEqual(color.opacity(css.toColor('#000000'), 0.75), { css: '#000000bf', rgba: 0x000000bf });
+        assert.deepEqual(color.opacity(css.toColor('#000000'), 1), { css: '#000000ff', rgba: 0x000000ff });
+      });
+    });
  });

  describe('css', () => {
    describe('toColor', () => {
-      it('should covert a CSS string to an IColor', () => {
+      it('should convert the #rrggbb format to an IColor', () => {
        assert.deepEqual(css.toColor('#000000'), { css: '#000000', rgba: 0x000000FF });
        assert.deepEqual(css.toColor('#101010'), { css: '#101010', rgba: 0x101010FF });
        assert.deepEqual(css.toColor('#202020'), { css: '#202020', rgba: 0x202020FF });
@@ -140,6 +172,25 @@ describe('Color', () => {
        assert.deepEqual(css.toColor('#f0f0f0'), { css: '#f0f0f0', rgba: 0xf0f0f0FF });
        assert.deepEqual(css.toColor('#ffffff'), { css: '#ffffff', rgba: 0xffffffFF });
      });
+      it('should convert the #rrggbbaa format to an IColor', () => {
+        assert.deepEqual(css.toColor('#00000000'), { css: '#00000000', rgba: 0x00000000 });
+        assert.deepEqual(css.toColor('#10101010'), { css: '#10101010', rgba: 0x10101010 });
+        assert.deepEqual(css.toColor('#20202020'), { css: '#20202020', rgba: 0x20202020 });
+        assert.deepEqual(css.toColor('#30303030'), { css: '#30303030', rgba: 0x30303030 });
+        assert.deepEqual(css.toColor('#40404040'), { css: '#40404040', rgba: 0x40404040 });
+        assert.deepEqual(css.toColor('#50505050'), { css: '#50505050', rgba: 0x50505050 });
+        assert.deepEqual(css.toColor('#60606060'), { css: '#60606060', rgba: 0x60606060 });
+        assert.deepEqual(css.toColor('#70707070'), { css: '#70707070', rgba: 0x70707070 });
+        assert.deepEqual(css.toColor('#80808080'), { css: '#80808080', rgba: 0x80808080 });
+        assert.deepEqual(css.toColor('#90909090'), { css: '#90909090', rgba: 0x90909090 });
+        assert.deepEqual(css.toColor('#a0a0a0a0'), { css: '#a0a0a0a0', rgba: 0xa0a0a0a0 });
+        assert.deepEqual(css.toColor('#b0b0b0b0'), { css: '#b0b0b0b0', rgba: 0xb0b0b0b0 });
+        assert.deepEqual(css.toColor('#c0c0c0c0'), { css: '#c0c0c0c0', rgba: 0xc0c0c0c0 });
+        assert.deepEqual(css.toColor('#d0d0d0d0'), { css: '#d0d0d0d0', rgba: 0xd0d0d0d0 });
+        assert.deepEqual(css.toColor('#e0e0e0e0'), { css: '#e0e0e0e0', rgba: 0xe0e0e0e0 });
+        assert.deepEqual(css.toColor('#f0f0f0f0'), { css: '#f0f0f0f0', rgba: 0xf0f0f0f0 });
+        assert.deepEqual(css.toColor('#ffffffff'), { css: '#ffffffff', rgba: 0xffffffff });
+      });
    });
  });

@@ -48,6 +48,10 @@ export namespace color {
    return { css, rgba };
  }

+  export function isOpaque(color: IColor): boolean {
+    return (color.rgba & 0xFF) === 0xFF;
+  }
+
  export function ensureContrastRatio(bg: IColor, fg: IColor, ratio: number): IColor | undefined {
    const result = rgba.ensureContrastRatio(bg.rgba, fg.rgba, ratio);
    if (!result) {
@@ -68,6 +72,15 @@ export namespace color {
      rgba: rgbaColor
    };
  }
+
+  export function opacity(color: IColor, opacity: number): IColor {
+    const a = Math.round(opacity * 0xFF);
+    const [r, g, b] = rgba.toChannels(color.rgba);
+    return {
+      css: channels.toCss(r, g, b, a),
+      rgba: channels.toRgba(r, g, b, a)
+    };
+  }
 }

 /**
@@ -75,10 +88,19 @@ export namespace color {
 */
 export namespace css {
  export function toColor(css: string): IColor {
-    return {
-      css,
-      rgba: (parseInt(css.slice(1), 16) << 8 | 0xFF) >>> 0
-    };
+    switch (css.length) {
+      case 7: // #rrggbb
+        return {
+          css,
+          rgba: (parseInt(css.slice(1), 16) << 8 | 0xFF) >>> 0
+        };
+      case 9: // #rrggbbaa
+        return {
+          css,
+          rgba: parseInt(css.slice(1), 16) >>> 0
+        };
+    }
+    throw new Error('css.toColor: Unsupported css format');
  }
 }

@@ -92,7 +92,7 @@ export class ColorManager implements IColorManager {
      background: DEFAULT_BACKGROUND,
      cursor: DEFAULT_CURSOR,
      cursorAccent: DEFAULT_CURSOR_ACCENT,
-      selection: DEFAULT_SELECTION,
+      selectionTransparent: DEFAULT_SELECTION,
      selectionOpaque: color.blend(DEFAULT_BACKGROUND, DEFAULT_SELECTION),
      ansi: DEFAULT_ANSI_COLORS.slice(),
      contrastCache: this._contrastCache
@@ -115,8 +115,16 @@ export class ColorManager implements IColorManager {
    this.colors.background = this._parseColor(theme.background, DEFAULT_BACKGROUND);
    this.colors.cursor = this._parseColor(theme.cursor, DEFAULT_CURSOR, true);
    this.colors.cursorAccent = this._parseColor(theme.cursorAccent, DEFAULT_CURSOR_ACCENT, true);
-    this.colors.selection = this._parseColor(theme.selection, DEFAULT_SELECTION, true);
-    this.colors.selectionOpaque = color.blend(this.colors.background, this.colors.selection);
+    this.colors.selectionTransparent = this._parseColor(theme.selection, DEFAULT_SELECTION, true);
+    this.colors.selectionOpaque = color.blend(this.colors.background, this.colors.selectionTransparent);
+    /**
+     * If selection color is opaque, blend it with background with 0.3 opacity
+     * Issue #2737
+     */
+    if (color.isOpaque(this.colors.selectionTransparent)) {
+      const opacity = 0.3;
+      this.colors.selectionTransparent = color.opacity(this.colors.selectionTransparent, opacity);
+    }
    this.colors.ansi[0] = this._parseColor(theme.black, DEFAULT_ANSI_COLORS[0]);
    this.colors.ansi[1] = this._parseColor(theme.red, DEFAULT_ANSI_COLORS[1]);
    this.colors.ansi[2] = this._parseColor(theme.green, DEFAULT_ANSI_COLORS[2]);
@@ -0,0 +1,41 @@
+/**
+ * Copyright (c) 2020 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+import jsdom = require('jsdom');
+import { removeElementFromParent } from 'browser/Dom';
+import { strictEqual, doesNotThrow } from 'assert';
+
+describe('Dom', () => {
+  const dom = new jsdom.JSDOM();
+  const document = dom.window.document;
+
+  describe('removeElementFromParent', () => {
+    it('should remove single child', () => {
+      const e = document.createElement('div');
+      document.body.appendChild(e);
+      strictEqual(e.parentElement, document.body);
+      removeElementFromParent(e);
+      strictEqual(e.parentElement, null);
+    });
+    it('should remove multiple elements', () => {
+      const e1 = document.createElement('div');
+      const e2 = document.createElement('div');
+      document.body.appendChild(e1);
+      document.body.appendChild(e2);
+      strictEqual(e1.parentElement, document.body);
+      strictEqual(e2.parentElement, document.body);
+      removeElementFromParent(e1, e2);
+      strictEqual(e1.parentElement, null);
+      strictEqual(e2.parentElement, null);
+    });
+    it('should not throw on undefined', () => {
+      const e = document.createElement('div');
+      document.body.appendChild(e);
+      strictEqual(e.parentElement, document.body);
+      doesNotThrow(() => removeElementFromParent(undefined, e));
+      strictEqual(e.parentElement, null);
+    });
+  });
+});
@@ -0,0 +1,10 @@
+/**
+ * Copyright (c) 2020 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+export function removeElementFromParent(...elements: (HTMLElement | undefined)[]): void {
+  for (const e of elements) {
+    e?.parentElement?.removeChild(e);
+  }
+}
@@ -14,9 +14,9 @@ export function addDisposableDomListener(
  node: Element | Window | Document,
  type: string,
  handler: (e: any) => void,
-  useCapture?: boolean
+  options?: boolean | AddEventListenerOptions
 ): IDisposable {
-  node.addEventListener(type, handler, useCapture);
+  node.addEventListener(type, handler, options);
  let disposed = false;
  return {
    dispose: () => {
@@ -24,7 +24,7 @@ export function addDisposableDomListener(
        return;
      }
      disposed = true;
-      node.removeEventListener(type, handler, useCapture);
+      node.removeEventListener(type, handler, options);
    }
  };
 }
@@ -59,7 +59,7 @@ describe('Linkifier', () => {
    bufferService.buffer.lines.push(stringToRow(text));
  }

-  function assertLinkifiesRow(rowText: string, linkMatcherRegex: RegExp, links: {x: number, length: number}[], done: MochaDone): void {
+  function assertLinkifiesRow(rowText: string, linkMatcherRegex: RegExp, links: {x: number, length: number}[], done: Mocha.Done): void {
    addRow(rowText);
    linkifier.registerLinkMatcher(linkMatcherRegex, () => {});
    linkifier.linkifyRows();
@@ -76,7 +76,7 @@ describe('Linkifier', () => {
    }, 0);
  }

-  function assertLinkifiesMultiLineLink(rowText: string, linkMatcherRegex: RegExp, links: {x1: number, y1: number, x2: number, y2: number}[], done: MochaDone): void {
+  function assertLinkifiesMultiLineLink(rowText: string, linkMatcherRegex: RegExp, links: {x1: number, y1: number, x2: number, y2: number}[], done: Mocha.Done): void {
    addRow(rowText);
    linkifier.registerLinkMatcher(linkMatcherRegex, () => {});
    linkifier.linkifyRows();
@@ -125,6 +125,13 @@ export class Linkifier2 extends Disposable implements ILinkifier2 {

  private _askForLink(position: IBufferCellPosition, useLineCache: boolean): void {
    if (!this._activeProviderReplies || !useLineCache) {
+      this._activeProviderReplies?.forEach(reply => {
+        reply?.forEach(linkWithState => {
+          if (linkWithState.link.dispose) {
+            linkWithState.link.dispose();
+          }
+        });
+      });
      this._activeProviderReplies = new Map();
      this._activeLine = position.y;
    }
@@ -1042,7 +1042,7 @@ describe('Terminal', () => {
      linkifier.attachToDom({} as any, mouseZoneManager);
    });

-    function assertLinkifiesInTerminal(rowText: string, linkMatcherRegex: RegExp, links: {x1: number, y1: number, x2: number, y2: number}[], done: MochaDone): void {
+    function assertLinkifiesInTerminal(rowText: string, linkMatcherRegex: RegExp, links: {x1: number, y1: number, x2: number, y2: number}[], done: Mocha.Done): void {
      terminal.writeSync(rowText);
      linkifier.registerLinkMatcher(linkMatcherRegex, () => {});
      linkifier.linkifyRows();
@@ -281,6 +281,25 @@ export class Terminal extends CoreTerminal implements ITerminal {
    this._onBlur.fire();
  }

+  private _syncTextArea(): void {
+    if (!this.textarea || !this.buffer.isCursorInViewport || this._compositionHelper!.isComposing) {
+      return;
+    }
+
+    const cellHeight = Math.ceil(this._charSizeService!.height * this.optionsService.options.lineHeight);
+    const cursorTop = this._bufferService.buffer.y * cellHeight;
+    const cursorLeft = this._bufferService.buffer.x * this._charSizeService!.width;
+
+    // Sync the textarea to the exact position of the composition view so the IME knows where the
+    // text is.
+    this.textarea.style.left = cursorLeft + 'px';
+    this.textarea.style.top = cursorTop + 'px';
+    this.textarea.style.width = this._charSizeService!.width + 'px';
+    this.textarea.style.height = cellHeight + 'px';
+    this.textarea.style.lineHeight = cellHeight + 'px';
+    this.textarea.style.zIndex = '-5';
+  }
+
  /**
   * Initialize default behavior
   */
@@ -436,7 +455,10 @@ export class Terminal extends CoreTerminal implements ITerminal {
    this.register(this._inputHandler.onRequestSyncScrollBar(() => this.viewport!.syncScrollArea()));
    this.register(this.viewport);

-    this.register(this.onCursorMove(() => this._renderService!.onCursorMove()));
+    this.register(this.onCursorMove(() => {
+      this._renderService!.onCursorMove();
+      this._syncTextArea();
+    }));
    this.register(this.onResize(() => this._renderService!.onResize(this.cols, this.rows)));
    this.register(this.onBlur(() => this._renderService!.onBlur()));
    this.register(this.onFocus(() => this._renderService!.onFocus()));
@@ -674,7 +696,7 @@ export class Terminal extends CoreTerminal implements ITerminal {
        el.removeEventListener('wheel', requestedEvents.wheel!);
        requestedEvents.wheel = null;
      } else if (!requestedEvents.wheel) {
-        el.addEventListener('wheel', eventListeners.wheel);
+        el.addEventListener('wheel', eventListeners.wheel, { passive: false });
        requestedEvents.wheel = eventListeners.wheel;
      }

@@ -747,7 +769,7 @@ export class Terminal extends CoreTerminal implements ITerminal {
        }
        return;
      }
-    }));
+    }, { passive: true }));

    // allow wheel scrolling in
    // the shell for example
@@ -756,20 +778,20 @@ export class Terminal extends CoreTerminal implements ITerminal {
      if (!this.viewport!.onWheel(ev)) {
        return this.cancel(ev);
      }
-    }));
+    }, { passive: false }));

    this.register(addDisposableDomListener(el, 'touchstart', (ev: TouchEvent) => {
      if (this._coreMouseService.areMouseEventsActive) return;
      this.viewport!.onTouchStart(ev);
      return this.cancel(ev);
-    }));
+    }, { passive: true }));

    this.register(addDisposableDomListener(el, 'touchmove', (ev: TouchEvent) => {
      if (this._coreMouseService.areMouseEventsActive) return;
      if (!this.viewport!.onTouchMove(ev)) {
        return this.cancel(ev);
      }
-    }));
+    }, { passive: false }));
  }


@@ -60,7 +60,7 @@ describe('Escape Sequence Files', function(): void {
    ptyTerm._master.destroy();
  });

-  FILES.forEach(filename => {
+  for (const filename of FILES) {
    (process.platform === 'win32' ? it.skip : it)(filename.split('/').slice(-1)[0], async () => {
      // reset terminal and handler
      if (customHandler) {
@@ -93,7 +93,7 @@ describe('Escape Sequence Files', function(): void {
        throw new Error(formatError(fs.readFileSync(filename, 'utf8'), content, expected));
      }
    });
-  });
+  }
 });

 /**
@@ -309,6 +309,9 @@ export class MockViewport implements IViewport {
 }

 export class MockCompositionHelper implements ICompositionHelper {
+  public get isComposing(): boolean {
+    return false;
+  }
  public compositionstart(): void {
    throw new Error('Method not implemented.');
  }
@@ -87,6 +87,7 @@ export type CustomKeyEventHandler = (event: KeyboardEvent) => boolean;
 export type LineData = CharData[];

 export interface ICompositionHelper {
+  readonly isComposing: boolean;
  compositionstart(): void;
  compositionupdate(ev: CompositionEvent): void;
  compositionend(): void;
@@ -120,7 +121,7 @@ export interface IColorSet {
  background: IColor;
  cursor: IColor;
  cursorAccent: IColor;
-  selection: IColor;
+  selectionTransparent: IColor;
  /** The selection blended on top of background. */
  selectionOpaque: IColor;
  ansi: IColor[];
@@ -274,6 +275,7 @@ interface ILink {
  activate(event: MouseEvent, text: string): void;
  hover?(event: MouseEvent, text: string): void;
  leave?(event: MouseEvent, text: string): void;
+  dispose?(): void;
 }

 interface ILinkDecorations {
@@ -22,6 +22,7 @@ export class CompositionHelper {
   * IME. This variable determines whether the compositionText should be displayed on the UI.
   */
  private _isComposing: boolean;
+  public get isComposing(): boolean { return this._isComposing; }

  /**
   * The position within the input textarea's value of the current composition.
@@ -118,7 +119,6 @@ export class CompositionHelper {
  private _finalizeComposition(waitForPropagation: boolean): void {
    this._compositionView.classList.remove('active');
    this._isComposing = false;
-    this._clearTextareaPosition();

    if (!waitForPropagation) {
      // Cancel any delayed composition send requests and send the input immediately.
@@ -218,13 +218,4 @@ export class CompositionHelper {
      setTimeout(() => this.updateCompositionElements(true), 0);
    }
  }
-
-  /**
-   * Clears the textarea's position so that the cursor does not blink on IE.
-   * @private
-   */
-  private _clearTextareaPosition(): void {
-    this._textarea.style.left = '';
-    this._textarea.style.top = '';
-  }
 }
@@ -3,7 +3,7 @@
 * @license MIT
 */

-import { Terminal as ITerminalApi, ITerminalOptions, IMarker, IDisposable, ILinkMatcherOptions, ITheme, ILocalizableStrings, ITerminalAddon, ISelectionPosition, IBuffer as IBufferApi, IBufferNamespace as IBufferNamespaceApi, IBufferLine as IBufferLineApi, IBufferCell as IBufferCellApi, IParser, IFunctionIdentifier, ILinkProvider, IUnicodeHandling, IUnicodeVersionProvider } from 'xterm';
+import { Terminal as ITerminalApi, ITerminalOptions, IMarker, IDisposable, ILinkMatcherOptions, ITheme, ILocalizableStrings, ITerminalAddon, ISelectionPosition, IBuffer as IBufferApi, IBufferNamespace as IBufferNamespaceApi, IBufferLine as IBufferLineApi, IBufferCell as IBufferCellApi, IParser, IFunctionIdentifier, ILinkProvider, IUnicodeHandling, IUnicodeVersionProvider, FontWeight } from 'xterm';
 import { ITerminal } from 'browser/Types';
 import { IBufferLine, ICellData } from 'common/Types';
 import { IBuffer, IBufferSet } from 'common/buffer/Types';
@@ -169,15 +169,16 @@ export class Terminal implements ITerminalApi {
  public paste(data: string): void {
    this._core.paste(data);
  }
-  public getOption(key: 'bellSound' | 'bellStyle' | 'cursorStyle' | 'fontFamily' | 'fontWeight' | 'fontWeightBold' | 'logLevel' | 'rendererType' | 'termName' | 'wordSeparator'): string;
+  public getOption(key: 'bellSound' | 'bellStyle' | 'cursorStyle' | 'fontFamily' | 'logLevel' | 'rendererType' | 'termName' | 'wordSeparator'): string;
  public getOption(key: 'allowTransparency' | 'cancelEvents' | 'convertEol' | 'cursorBlink' | 'disableStdin' | 'macOptionIsMeta' | 'rightClickSelectsWord' | 'popOnBell' | 'visualBell'): boolean;
  public getOption(key: 'cols' | 'fontSize' | 'letterSpacing' | 'lineHeight' | 'rows' | 'tabStopWidth' | 'scrollback'): number;
+  public getOption(key: 'fontWeight' | 'fontWeightBold'): FontWeight;
  public getOption(key: string): any;
  public getOption(key: any): any {
    return this._core.optionsService.getOption(key);
  }
  public setOption(key: 'bellSound' | 'fontFamily' | 'termName' | 'wordSeparator', value: string): void;
-  public setOption(key: 'fontWeight' | 'fontWeightBold', value: 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900'): void;
+  public setOption(key: 'fontWeight' | 'fontWeightBold', value: 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900' | number): void;
  public setOption(key: 'logLevel', value: 'debug' | 'info' | 'warn' | 'error' | 'off'): void;
  public setOption(key: 'bellStyle', value: 'none' | 'visual' | 'sound' | 'both'): void;
  public setOption(key: 'cursorStyle', value: 'block' | 'underline' | 'bar'): void;
@@ -204,11 +205,11 @@ export class Terminal implements ITerminalApi {
  }

  private _verifyIntegers(...values: number[]): void {
-    values.forEach(value => {
+    for (const value of values) {
      if (value === Infinity || isNaN(value) || value % 1 !== 0) {
        throw new Error('This API only accepts integers');
      }
-    });
+    }
  }
 }

@@ -16,6 +16,7 @@ import { CellData } from 'common/buffer/CellData';
 import { IBufferService, IOptionsService } from 'common/services/Services';
 import { throwIfFalsy } from 'browser/renderer/RendererUtils';
 import { channels, color, rgba } from 'browser/Color';
+import { removeElementFromParent } from 'browser/Dom';

 export abstract class BaseRenderLayer implements IRenderLayer {
  private _canvas: HTMLCanvasElement;
@@ -60,7 +61,7 @@ export abstract class BaseRenderLayer implements IRenderLayer {
  }

  public dispose(): void {
-    this._canvas.parentElement?.removeChild(this._canvas);
+    removeElementFromParent(this._canvas);
    this._charAtlas?.dispose();
  }

@@ -44,7 +44,6 @@ export class Renderer extends Disposable implements IRenderer {
    super();
    const allowTransparency = this._optionsService.options.allowTransparency;
    this._characterJoinerRegistry = new CharacterJoinerRegistry(this._bufferService);
-
    this._renderLayers = [
      new TextRenderLayer(this._screenElement, 0, this._colors, this._characterJoinerRegistry, allowTransparency, this._id, this._bufferService, _optionsService),
      new SelectionRenderLayer(this._screenElement, 1, this._colors, this._id, this._bufferService, _optionsService),
@@ -71,7 +70,9 @@ export class Renderer extends Disposable implements IRenderer {
  }

  public dispose(): void {
-    this._renderLayers.forEach(l => l.dispose());
+    for (const l of this._renderLayers) {
+      l.dispose();
+    }
    super.dispose();
    removeTerminalFromCache(this._id);
  }
@@ -87,12 +88,11 @@ export class Renderer extends Disposable implements IRenderer {

  public setColors(colors: IColorSet): void {
    this._colors = colors;
-
    // Clear layers and force a full render
-    this._renderLayers.forEach(l => {
+    for (const l of this._renderLayers) {
      l.setColors(this._colors);
      l.reset();
-    });
+    }
  }

  public onResize(cols: number, rows: number): void {
@@ -100,7 +100,9 @@ export class Renderer extends Disposable implements IRenderer {
    this._updateDimensions();

    // Resize all render layers
-    this._renderLayers.forEach(l => l.resize(this.dimensions));
+    for (const l of this._renderLayers) {
+      l.resize(this.dimensions);
+    }

    // Resize the screen
    this._screenElement.style.width = `${this.dimensions.canvasWidth}px`;
@@ -136,7 +138,9 @@ export class Renderer extends Disposable implements IRenderer {
  }

  private _runOperation(operation: (layer: IRenderLayer) => void): void {
-    this._renderLayers.forEach(l => operation(l));
+    for (const l of this._renderLayers) {
+      operation(l);
+    }
  }

  /**
@@ -144,7 +148,9 @@ export class Renderer extends Disposable implements IRenderer {
   * necessary before queueing up the next one.
   */
  public renderRows(start: number, end: number): void {
-    this._renderLayers.forEach(l => l.onGridChanged(start, end));
+    for (const l of this._renderLayers) {
+      l.onGridChanged(start, end);
+    }
  }

  /**
@@ -75,10 +75,11 @@ export class SelectionRenderLayer extends BaseRenderLayer {

    // No need to draw the selection
    if (viewportCappedStartRow >= this._bufferService.rows || viewportCappedEndRow < 0) {
+      this._state.ydisp = this._bufferService.buffer.ydisp;
      return;
    }

-    this._ctx.fillStyle = this._colors.selection.css;
+    this._ctx.fillStyle = this._colors.selectionTransparent.css;

    if (columnSelectMode) {
      const startCol = start[0];
@@ -88,7 +89,7 @@ export class SelectionRenderLayer extends BaseRenderLayer {
    } else {
      // Draw first row
      const startCol = viewportStartRow === viewportCappedStartRow ? start[0] : 0;
-      const startRowEndCol = viewportCappedStartRow === viewportCappedEndRow ? end[0] : this._bufferService.cols;
+      const startRowEndCol = viewportCappedStartRow === viewportEndRow ? end[0] : this._bufferService.cols;
      this._fillCells(startCol, viewportCappedStartRow, startRowEndCol - startCol, 1);

      // Draw middle rows
@@ -188,13 +188,13 @@ export class TextRenderLayer extends BaseRenderLayer {

      if (y !== startY) {
        // our row changed, draw the previous row
-        ctx.fillStyle = prevFillStyle ? prevFillStyle : '';
+        ctx.fillStyle = prevFillStyle || '';
        this._fillCells(startX, startY, cols - startX, 1);
        startX = x;
        startY = y;
      } else if (prevFillStyle !== nextFillStyle) {
        // our color changed, draw the previous characters in this row
-        ctx.fillStyle = prevFillStyle ? prevFillStyle : '';
+        ctx.fillStyle = prevFillStyle || '';
        this._fillCells(startX, startY, x - startX, 1);
        startX = x;
        startY = y;
@@ -26,7 +26,7 @@ export abstract class BaseCharAtlas implements IDisposable {
   * Perform any work needed to warm the cache before it can be used. Used by the default
   * implementation of warmUp(), and will only be called once.
   */
-  protected _doWarmUp(): void { }
+  private _doWarmUp(): void { }

  /**
   * Called when we start drawing a new frame.
@@ -12,6 +12,7 @@ import { ICharSizeService } from 'browser/services/Services';
 import { IOptionsService, IBufferService } from 'common/services/Services';
 import { EventEmitter, IEvent } from 'common/EventEmitter';
 import { color } from 'browser/Color';
+import { removeElementFromParent } from 'browser/Dom';

 const TERMINAL_CLASS_PREFIX = 'xterm-dom-renderer-owner-';
 const ROW_CONTAINER_CLASS = 'xterm-rows';
@@ -53,7 +54,6 @@ export class DomRenderer extends Disposable implements IRenderer {
    @IBufferService private readonly _bufferService: IBufferService
  ) {
    super();
-
    this._rowContainer = document.createElement('div');
    this._rowContainer.classList.add(ROW_CONTAINER_CLASS);
    this._rowContainer.style.lineHeight = 'normal';
@@ -95,10 +95,11 @@ export class DomRenderer extends Disposable implements IRenderer {

  public dispose(): void {
    this._element.classList.remove(TERMINAL_CLASS_PREFIX + this._terminalClass);
-    this._screenElement.removeChild(this._rowContainer);
-    this._screenElement.removeChild(this._selectionContainer);
-    this._screenElement.removeChild(this._themeStyleElement);
-    this._screenElement.removeChild(this._dimensionsStyleElement);
+
+    // Outside influences such as React unmounts may manipulate the DOM before our disposal.
+    // https://github.com/xtermjs/xterm.js/issues/2960
+    removeElementFromParent(this._rowContainer, this._selectionContainer, this._themeStyleElement, this._dimensionsStyleElement);
+
    super.dispose();
  }

@@ -116,13 +117,13 @@ export class DomRenderer extends Disposable implements IRenderer {
    this.dimensions.actualCellWidth = this.dimensions.canvasWidth / this._bufferService.cols;
    this.dimensions.actualCellHeight = this.dimensions.canvasHeight / this._bufferService.rows;

-    this._rowElements.forEach(element => {
+    for (const element of this._rowElements) {
      element.style.width = `${this.dimensions.canvasWidth}px`;
      element.style.height = `${this.dimensions.actualCellHeight}px`;
      element.style.lineHeight = `${this.dimensions.actualCellHeight}px`;
      // Make sure rows don't overflow onto following row
      element.style.overflow = 'hidden';
-    });
+    }

    if (!this._dimensionsStyleElement) {
      this._dimensionsStyleElement = document.createElement('style');
@@ -224,7 +225,7 @@ export class DomRenderer extends Disposable implements IRenderer {
      `}` +
      `${this._terminalSelector} .${SELECTION_CLASS} div {` +
      ` position: absolute;` +
-      ` background-color: ${this._colors.selection.css};` +
+      ` background-color: ${this._colors.selectionTransparent.css};` +
      `}`;
    // Colors
    this._colors.ansi.forEach((c, i) => {
@@ -305,7 +306,7 @@ export class DomRenderer extends Disposable implements IRenderer {
    } else {
      // Draw first row
      const startCol = viewportStartRow === viewportCappedStartRow ? start[0] : 0;
-      const endCol = viewportCappedStartRow === viewportCappedEndRow ? end[0] : this._bufferService.cols;
+      const endCol = viewportCappedStartRow === viewportEndRow ? end[0] : this._bufferService.cols;
      documentFragment.appendChild(this._createSelectionElement(viewportCappedStartRow, startCol, endCol));
      // Draw middle rows
      const middleRowsCount = viewportCappedEndRow - viewportCappedStartRow - 1;
@@ -346,7 +347,9 @@ export class DomRenderer extends Disposable implements IRenderer {
  }

  public clear(): void {
-    this._rowElements.forEach(e => e.innerHTML = '');
+    for (const e of this._rowElements) {
+      e.innerHTML = '';
+    }
  }

  public renderRows(start: number, end: number): void {
@@ -55,6 +55,9 @@ export class RenderService extends Disposable implements IRenderService {
    @IBufferService bufferService: IBufferService
  ) {
    super();
+
+    this.register({ dispose: () => this._renderer.dispose() });
+
    this._renderDebouncer = new RenderDebouncer((start, end) => this._renderRows(start, end));
    this.register(this._renderDebouncer);

@@ -83,7 +86,7 @@ export class RenderService extends Disposable implements IRenderService {
  }

  private _onIntersectionChange(entry: IntersectionObserverEntry): void {
-    this._isPaused = entry.intersectionRatio === 0;
+    this._isPaused = entry.isIntersecting === undefined ? (entry.intersectionRatio === 0) : !entry.isIntersecting;
    if (!this._isPaused && this._needsFullRefresh) {
      this.refreshRows(0, this._rowCount - 1);
      this._needsFullRefresh = false;
@@ -137,7 +140,6 @@ export class RenderService extends Disposable implements IRenderService {
  }

  public dispose(): void {
-    this._renderer.dispose();
    super.dispose();
  }

@@ -667,8 +667,8 @@ export class SelectionService extends Disposable implements ISelectionService {

    this._removeMouseDownListeners();

-    if (this.selectionText.length <= 1 && timeElapsed < ALT_CLICK_MOVE_CURSOR_TIME) {
-      if (event.altKey && this._bufferService.buffer.ybase === this._bufferService.buffer.ydisp) {
+    if (this.selectionText.length <= 1 && timeElapsed < ALT_CLICK_MOVE_CURSOR_TIME && event.altKey) {
+      if (this._bufferService.buffer.ybase === this._bufferService.buffer.ydisp) {
        const coordinates = this._mouseService.getCoords(
          event,
          this._element,
@@ -328,7 +328,9 @@ export abstract class CoreTerminal extends Disposable implements ICoreTerminal {
      }));
      this._windowsMode = {
        dispose: () => {
-          disposables.forEach(d => d.dispose());
+          for (const d of disposables) {
+            d.dispose();
+          }
        }
      };
    }
@@ -21,7 +21,9 @@ export abstract class Disposable implements IDisposable {
   */
  public dispose(): void {
    this._isDisposed = true;
-    this._disposables.forEach(d => d.dispose());
+    for (const d of this._disposables) {
+      d.dispose();
+    }
    this._disposables.length = 0;
  }

@@ -52,7 +54,9 @@ export abstract class Disposable implements IDisposable {
 * Dispose of all disposables in an array and set its length to 0.
 */
 export function disposeArray(disposables: IDisposable[]): void {
-  disposables.forEach(d => d.dispose());
+  for (const d of disposables) {
+    d.dispose();
+  }
  disposables.length = 0;
 }

@@ -104,7 +104,9 @@ export class MockOptionsService implements IOptionsService {
  public onOptionChange: IEvent<string> = new EventEmitter<string>().event;
  constructor(testOptions?: IPartialTerminalOptions) {
    if (testOptions) {
-      Object.keys(testOptions).forEach(key => this.options[key] = (<any>testOptions)[key]);
+      for (const key of Object.keys(testOptions)) {
+        this.options[key] = (<any>testOptions)[key];
+      }
    }
  }
  public setOption<T>(key: string, value: T): void {
@@ -666,11 +666,11 @@ export class BufferStringIterator implements IBufferStringIterator {
    // limit to current buffer length
    range.first = Math.max(range.first, 0);
    range.last = Math.min(range.last, this._buffer.lines.length);
-    let result = '';
+    let content = '';
    for (let i = range.first; i <= range.last; ++i) {
-      result += this._buffer.translateBufferLineToString(i, this._trimRight);
+      content += this._buffer.translateBufferLineToString(i, this._trimRight);
    }
    this._current = range.last + 1;
-    return {range: range, content: result};
+    return {range, content};
  }
 }
@@ -139,7 +139,7 @@ describe('Keyboard', () => {
        assert.equal(testEvaluateKeyboardEvent({ altKey: true, keyCode: 40 }, { isMac: true }).key, '\x1b[1;3B'); // CSI 5 C
      });
      it('should return undefined for alt+a', () => {
-        assert.strictEqual(testEvaluateKeyboardEvent({ altKey: true, keyCode: 65 }, { isMac: true }).key, undefined), { isMac: true };
+        assert.strictEqual(testEvaluateKeyboardEvent({ altKey: true, keyCode: 65 }, { isMac: true }).key, undefined);
      });
    });

@@ -136,7 +136,7 @@ export class DcsHandler implements IDcsHandler {
    if (this._hitLimit) {
      ret = false;
    } else if (success) {
-      ret = this._handler(this._data, this._params ? this._params : new Params());
+      ret = this._handler(this._data, this._params || new Params());
    }
    this._params = undefined;
    this._data = '';
@@ -1589,9 +1589,9 @@ describe('EscapeSequenceParser', function (): void {
      });
      it('final ESC range 0x30 .. 0x7e, one byte', () => {
        for (let i = 0x30; i <= 0x7e; ++i) {
-          const c = String.fromCharCode(i);
+          const final = String.fromCharCode(i);
          let handler: IDisposable | undefined;
-          chai.assert.doesNotThrow(() => { handler = parser.addEscHandler({final: c}, () => {}); }, 'final must be in range 48 .. 126');
+          chai.assert.doesNotThrow(() => { handler = parser.addEscHandler({final}, () => {}); }, 'final must be in range 48 .. 126');
          if (handler) handler.dispose();
        }
        chai.assert.throws(() => { parser.addEscHandler({final: '\x2f'}, () => {}); }, 'final must be in range 48 .. 126');
@@ -171,7 +171,7 @@ describe('CoreMouseService', () => {
      assert.equal(cms.triggerMouseEvent({ col: 0, row: 0, button: CoreMouseButton.RIGHT, action: CoreMouseAction.DOWN, ctrl: false, alt: false, shift: false }), true);
      assert.equal(cms.triggerMouseEvent({ col: 0, row: 0, button: CoreMouseButton.WHEEL, action: CoreMouseAction.DOWN, ctrl: false, alt: false, shift: false }), true);
      assert.deepEqual(reports, ['\x1b[M !!', '\x1b[M!!!', '\x1b[M"!!', '\x1b[Ma!!']);
-      while (reports.pop()) { }
+      reports = [];

      // all buttons + up + no modifier
      assert.equal(cms.triggerMouseEvent({ col: 0, row: 0, button: CoreMouseButton.LEFT, action: CoreMouseAction.UP, ctrl: false, alt: false, shift: false }), true);
@@ -179,7 +179,7 @@ describe('CoreMouseService', () => {
      assert.equal(cms.triggerMouseEvent({ col: 0, row: 0, button: CoreMouseButton.RIGHT, action: CoreMouseAction.UP, ctrl: false, alt: false, shift: false }), true);
      assert.equal(cms.triggerMouseEvent({ col: 0, row: 0, button: CoreMouseButton.WHEEL, action: CoreMouseAction.UP, ctrl: false, alt: false, shift: false }), true);
      assert.deepEqual(reports, ['\x1b[M#!!', '\x1b[M#!!', '\x1b[M#!!', '\x1b[M`!!']);
-      while (reports.pop()) { }
+      reports = [];

      // all buttons + move + no modifier
      assert.equal(cms.triggerMouseEvent({ col: 0, row: 0, button: CoreMouseButton.LEFT, action: CoreMouseAction.MOVE, ctrl: false, alt: false, shift: false }), true);
@@ -187,7 +187,7 @@ describe('CoreMouseService', () => {
      assert.equal(cms.triggerMouseEvent({ col: 0, row: 0, button: CoreMouseButton.RIGHT, action: CoreMouseAction.MOVE, ctrl: false, alt: false, shift: false }), true);
      assert.equal(cms.triggerMouseEvent({ col: 0, row: 0, button: CoreMouseButton.NONE, action: CoreMouseAction.MOVE, ctrl: false, alt: false, shift: false }), true);
      assert.deepEqual(reports, ['\x1b[M@!!', '\x1b[MA!!', '\x1b[MB!!', '\x1b[MC!!']);
-      while (reports.pop()) { }
+      reports = [];

      // button none + move + modifiers
      assert.equal(cms.triggerMouseEvent({ col: 0, row: 0, button: CoreMouseButton.NONE, action: CoreMouseAction.MOVE, ctrl: true, alt: false, shift: false }), true);
@@ -197,7 +197,7 @@ describe('CoreMouseService', () => {
      assert.equal(cms.triggerMouseEvent({ col: 0, row: 0, button: CoreMouseButton.NONE, action: CoreMouseAction.MOVE, ctrl: false, alt: true, shift: true }), true);
      assert.equal(cms.triggerMouseEvent({ col: 0, row: 0, button: CoreMouseButton.NONE, action: CoreMouseAction.MOVE, ctrl: true, alt: true, shift: true }), true);
      assert.deepEqual(reports, ['\x1b[MS!!', '\x1b[MK!!', '\x1b[MG!!', '\x1b[M[!!', '\x1b[MO!!', '\x1b[M_!!']);
-      while (reports.pop()) { }
+      reports = [];
    });
  });
 });
@@ -174,8 +174,8 @@ export class CoreMouseService implements ICoreMouseService {
    @ICoreService private readonly _coreService: ICoreService
  ) {
    // register default protocols and encodings
-    Object.keys(DEFAULT_PROTOCOLS).forEach(name => this.addProtocol(name, DEFAULT_PROTOCOLS[name]));
-    Object.keys(DEFAULT_ENCODINGS).forEach(name => this.addEncoding(name, DEFAULT_ENCODINGS[name]));
+    for (const name of Object.keys(DEFAULT_PROTOCOLS)) this.addProtocol(name, DEFAULT_PROTOCOLS[name]);
+    for (const name of Object.keys(DEFAULT_ENCODINGS)) this.addEncoding(name, DEFAULT_ENCODINGS[name]);
    // call reset to set defaults
    this.reset();
  }
@@ -0,0 +1,60 @@
+/**
+ * Copyright (c) 2020 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+import { assert } from 'chai';
+import { OptionsService, DEFAULT_OPTIONS } from 'common/services/OptionsService';
+
+describe('OptionsService', () => {
+  describe('constructor', () => {
+    const originalError = console.error;
+    beforeEach(() => {
+      console.error = () => {};
+    });
+    afterEach(() => {
+      console.error = originalError;
+    });
+    it('uses default value if invalid constructor option value passed', () => {
+      assert.equal(new OptionsService({tabStopWidth: 0}).getOption('tabStopWidth'), DEFAULT_OPTIONS.tabStopWidth);
+    });
+  });
+  describe('setOption', () => {
+    let service: OptionsService;
+    beforeEach(() => {
+      service = new OptionsService({});
+    });
+    it('applies valid fontWeight option values', () => {
+      service.setOption('fontWeight', 'bold');
+      assert.equal(service.getOption('fontWeight'), 'bold', '"bold" keyword value should be applied');
+
+      service.setOption('fontWeight', 'normal');
+      assert.equal(service.getOption('fontWeight'), 'normal', '"normal" keyword value should be applied');
+
+      service.setOption('fontWeight', '600');
+      assert.equal(service.getOption('fontWeight'), '600', 'String numeric values should be applied');
+
+      service.setOption('fontWeight', 350);
+      assert.equal(service.getOption('fontWeight'), 350, 'Values between 1 and 1000 should be applied as is');
+
+      service.setOption('fontWeight', 1);
+      assert.equal(service.getOption('fontWeight'), 1, 'Range should include minimum value: 1');
+
+      service.setOption('fontWeight', 1000);
+      assert.equal(service.getOption('fontWeight'), 1000, 'Range should include maximum value: 1000');
+    });
+    it('normalizes invalid fontWeight option values', () => {
+      service.setOption('fontWeight', 350);
+      assert.doesNotThrow(() => service.setOption('fontWeight', 10000), 'fontWeight should be normalized instead of throwing');
+      assert.equal(service.getOption('fontWeight'), DEFAULT_OPTIONS.fontWeight, 'Values greater than 1000 should be reset to default');
+
+      service.setOption('fontWeight', 350);
+      service.setOption('fontWeight', -10);
+      assert.equal(service.getOption('fontWeight'), DEFAULT_OPTIONS.fontWeight, 'Values less than 1 should be reset to default');
+
+      service.setOption('fontWeight', 350);
+      service.setOption('fontWeight', 'bold700');
+      assert.equal(service.getOption('fontWeight'), DEFAULT_OPTIONS.fontWeight, 'Wrong string literals should be reset to default');
+    });
+  });
+});
@@ -3,7 +3,7 @@
 * @license MIT
 */

-import { IOptionsService, ITerminalOptions, IPartialTerminalOptions } from 'common/services/Services';
+import { IOptionsService, ITerminalOptions, IPartialTerminalOptions, FontWeight } from 'common/services/Services';
 import { EventEmitter, IEvent } from 'common/EventEmitter';
 import { isMac } from 'common/Platform';
 import { clone } from 'common/Clone';
@@ -56,6 +56,8 @@ export const DEFAULT_OPTIONS: ITerminalOptions = Object.freeze({
  cancelEvents: false
 });

+const FONT_WEIGHT_OPTIONS: Extract<FontWeight, string>[] = ['normal', 'bold', '100', '200', '300', '400', '500', '600', '700', '800', '900'];
+
 /**
 * The set of options that only have an effect when set in the Terminal constructor.
 */
@@ -71,12 +73,16 @@ export class OptionsService implements IOptionsService {

  constructor(options: IPartialTerminalOptions) {
    this.options = clone(DEFAULT_OPTIONS);
-    Object.keys(options).forEach(k => {
+    for (const k of Object.keys(options)) {
      if (k in this.options) {
-        const newValue = options[k as keyof IPartialTerminalOptions] as any;
-        this.options[k] = newValue;
+        try {
+          const newValue = options[k as keyof IPartialTerminalOptions] as any;
+          this.options[k] = this._sanitizeAndValidateOption(k, newValue);
+        } catch (e) {
+          console.error(e);
+        }
      }
-    });
+    }
  }

  public setOption(key: string, value: any): void {
@@ -105,14 +111,20 @@ export class OptionsService implements IOptionsService {
    switch (key) {
      case 'bellStyle':
      case 'cursorStyle':
-      case 'fontWeight':
-      case 'fontWeightBold':
      case 'rendererType':
      case 'wordSeparator':
        if (!value) {
          value = DEFAULT_OPTIONS[key];
        }
        break;
+      case 'fontWeight':
+      case 'fontWeightBold':
+        if (typeof value === 'number' && 1 <= value && value <= 1000) {
+          // already valid numeric value
+          break;
+        }
+        value = FONT_WEIGHT_OPTIONS.indexOf(value) !== -1 ? value : DEFAULT_OPTIONS[key];
+        break;
      case 'cursorWidth':
        value = Math.floor(value);
        // Fall through for bounds check
@@ -136,7 +136,7 @@ export interface IServiceIdentifier<T> {

 export interface IBrandedService {
  serviceBrand: undefined;
-};
+}

 type GetLeadingNonServiceArgs<Args> =
  Args extends [...IBrandedService[]] ? []
@@ -179,7 +179,7 @@ export interface IOptionsService {
  getOption<T>(key: string): T | undefined;
 }

-export type FontWeight = 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
+export type FontWeight = 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900' | number;
 export type LogLevel = 'debug' | 'info' | 'warn' | 'error' | 'off';
 export type RendererType = 'dom' | 'canvas';

@@ -755,6 +755,57 @@ describe('API Integration Tests', function(): void {
      await pollFor(page, `window.calls`, ['provide 1', 'hover 1-3', 'leave 1-3', 'hover 5-7', 'leave 5-7', 'provide 2', 'provide 1', 'hover 9-11']);
      await page.evaluate(`window.disposable.dispose()`);
    });
+
+    it('should dispose links when hovering away', async () => {
+      await openTerminal(page, { rendererType: 'dom' });
+      await writeSync(page, 'foo bar baz');
+      // Wait for renderer to catch up as links are cleared on render
+      await pollFor(page, `document.querySelector('.xterm-rows').textContent`, 'foo bar baz ');
+      await page.evaluate(`
+        window.calls = [];
+        window.disposable = window.term.registerLinkProvider({
+          provideLinks: (position, cb) => {
+            window.calls.push('provide ' + position);
+            if (position === 1) {
+              cb([{
+                range: { start: { x: 1, y: 1 }, end: { x: 3, y: 1 } },
+                text: '',
+                activate: () => window.calls.push('activate'),
+                dispose: () => window.calls.push('dispose 1-3'),
+                hover: () => window.calls.push('hover 1-3'),
+                leave: () => window.calls.push('leave 1-3')
+              }, {
+                range: { start: { x: 5, y: 1 }, end: { x: 7, y: 1 } },
+                text: '',
+                activate: () => window.calls.push('activate'),
+                dispose: () => window.calls.push('dispose 5-7'),
+                hover: () => window.calls.push('hover 5-7'),
+                leave: () => window.calls.push('leave 5-7')
+              }, {
+                range: { start: { x: 9, y: 1 }, end: { x: 11, y: 1 } },
+                text: '',
+                activate: () => window.calls.push('activate'),
+                dispose: () => window.calls.push('dispose 9-11'),
+                hover: () => window.calls.push('hover 9-11'),
+                leave: () => window.calls.push('leave 9-11')
+              }]);
+            }
+          }
+        });
+      `);
+      const dims = await getDimensions();
+      await moveMouseCell(page, dims, 2, 1);
+      await pollFor(page, `window.calls`, ['provide 1', 'hover 1-3']);
+      await moveMouseCell(page, dims, 6, 1);
+      await pollFor(page, `window.calls`, ['provide 1', 'hover 1-3', 'leave 1-3', 'hover 5-7']);
+      await moveMouseCell(page, dims, 6, 2);
+      await pollFor(page, `window.calls`, ['provide 1', 'hover 1-3', 'leave 1-3', 'hover 5-7', 'leave 5-7', 'dispose 1-3', 'dispose 5-7', 'dispose 9-11', 'provide 2']);
+      await moveMouseCell(page, dims, 10, 1);
+      await pollFor(page, `window.calls`, ['provide 1', 'hover 1-3', 'leave 1-3', 'hover 5-7', 'leave 5-7', 'dispose 1-3', 'dispose 5-7', 'dispose 9-11', 'provide 2', 'provide 1', 'hover 9-11']);
+      await moveMouseCell(page, dims, 10, 2);
+      await pollFor(page, `window.calls`, ['provide 1', 'hover 1-3', 'leave 1-3', 'hover 5-7', 'leave 5-7', 'dispose 1-3', 'dispose 5-7', 'dispose 9-11', 'provide 2', 'provide 1', 'hover 9-11', 'leave 9-11', 'dispose 1-3', 'dispose 5-7', 'dispose 9-11', 'provide 2']);
+      await page.evaluate(`window.disposable.dispose()`);
+    });
  });
 });

@@ -11,9 +11,9 @@

 declare module 'xterm' {
  /**
-   * A string representing text font weight.
+   * A string or number representing text font weight.
   */
-  export type FontWeight = 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900';
+  export type FontWeight = 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900' | number;

  /**
   * A string representing log level.
@@ -933,7 +933,7 @@ declare module 'xterm' {
     * Retrieves an option's value from the terminal.
     * @param key The option key.
     */
-    getOption(key: 'bellSound' | 'bellStyle' | 'cursorStyle' | 'fontFamily' | 'fontWeight' | 'fontWeightBold' | 'logLevel' | 'rendererType' | 'termName' | 'wordSeparator'): string;
+    getOption(key: 'bellSound' | 'bellStyle' | 'cursorStyle' | 'fontFamily' | 'logLevel' | 'rendererType' | 'termName' | 'wordSeparator'): string;
    /**
     * Retrieves an option's value from the terminal.
     * @param key The option key.
@@ -944,6 +944,11 @@ declare module 'xterm' {
     * @param key The option key.
     */
    getOption(key: 'cols' | 'fontSize' | 'letterSpacing' | 'lineHeight' | 'rows' | 'tabStopWidth' | 'scrollback'): number;
+    /**
+     * Retrieves an option's value from the terminal.
+     * @param key The option key.
+     */
+    getOption(key: 'fontWeight' | 'fontWeightBold'): FontWeight;
    /**
     * Retrieves an option's value from the terminal.
     * @param key The option key.
@@ -961,7 +966,7 @@ declare module 'xterm' {
    * @param key The option key.
    * @param value The option value.
    */
-    setOption(key: 'fontWeight' | 'fontWeightBold', value: null | 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900'): void;
+    setOption(key: 'fontWeight' | 'fontWeightBold', value: null | 'normal' | 'bold' | '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900' | number): void;
    /**
    * Sets an option on the terminal.
    * @param key The option key.
@@ -1158,6 +1163,11 @@ declare module 'xterm' {
     * @param text The text of the link.
     */
    leave?(event: MouseEvent, text: string): void;
+
+    /**
+     * Called when the link is released and no longer used by xterm.js.
+     */
+    dispose?(): void;
  }

  /**