Merge pull request #2145 from xtermjs/Tyriar-patch-1

v3.14.0

.devcontainer/Dockerfile

@@ -0,0 +1,22 @@
+FROM node:10
+
+# Configure apt
+ENV DEBIAN_FRONTEND=noninteractive
+RUN apt-get update \
+    && apt-get -y install --no-install-recommends apt-utils 2>&1
+
+# Verify git and process tools are installed
+RUN apt-get install -y git procps
+
+# Install yarn
+RUN apt-get install -y curl apt-transport-https lsb-release \
+    && curl -sS https://dl.yarnpkg.com/$(lsb_release -is | tr '[:upper:]' '[:lower:]')/pubkey.gpg | apt-key add - 2>/dev/null \
+    && echo "deb https://dl.yarnpkg.com/$(lsb_release -is | tr '[:upper:]' '[:lower:]')/ stable main" | tee /etc/apt/sources.list.d/yarn.list \
+    && apt-get update \
+    && apt-get -y install --no-install-recommends yarn
+
+# Clean up
+RUN apt-get autoremove -y \
+    && apt-get clean -y \
+    && rm -rf /var/lib/apt/lists/*
+ENV DEBIAN_FRONTEND=dialog

.devcontainer/devcontainer.json

@@ -0,0 +1,9 @@
+{
+  "name": "xterm.js",
+  "dockerFile": "Dockerfile",
+  "appPort": 3000,
+  "extensions": [
+    "editorconfig.editorconfig",
+    "ms-vscode.vscode-typescript-tslint-plugin"
+  ]
+}

.github/ISSUE_TEMPLATE.md

@@ -1,11 +0,0 @@
-<!-- Enter your issue description here -->
-
-## Details
-- Browser and browser version: 
-- OS version: 
-- xterm.js version: 
-
-### Steps to reproduce
-
-1. 
-2. 

.github/ISSUE_TEMPLATE/bug_report.md

@@ -0,0 +1,17 @@
+---
+name: Bug report
+about: Create a bug report
+---
+
+<!-- ⚠️ Please search existing issues to avoid creating duplicates. ⚠️ -->
+<!-- Describe the bug here. -->
+
+## Details
+- Browser and browser version: 
+- OS version: 
+- xterm.js version: 
+
+### Steps to reproduce
+
+1. 
+2. 

.github/ISSUE_TEMPLATE/feature_request.md

@@ -0,0 +1,7 @@
+---
+name: Feature request
+about: Suggest a feature or enhancement
+---
+
+<!-- ⚠️ Please search existing issues to avoid creating duplicates. ⚠️ -->
+<!-- Describe the enhancement here. -->

.github/ISSUE_TEMPLATE/question.md

@@ -0,0 +1,8 @@
+---
+name: Question
+about: The issue tracker is not for questions. Please ask questions on https://stackoverflow.com/questions/tagged/xtermjs
+---
+
+🛑 The issue tracker is not for questions 🛑
+
+If you have a question, please ask it on https://stackoverflow.com/questions/tagged/xtermjs.

.gitignore

@@ -12,17 +12,14 @@ npm-debug.log
 /.idea/
 .env
 build/
-.vscode/
 .DS_Store
 fixtures/typings-test/*.js
+package-lock.json
 
 # Directories needed for code coverage
-/coverage/
+coverage/
+.nyc_output/
 
-# Keep legacy files out of the repo, this can be removed when we merge v3 into master
+# Keep bundled code out of Git
 dist/
-src/utils/TestUtils.ts
-src/xterm.js
-
-# Keep the demo builds out of Git
 demo/dist/

.npmignore

@@ -1,16 +1,49 @@
-node_modules/
-*.swp
-.lock-wscript
-lib/*.test.js
-lib/*.test.js.map
+# Blacklist - exclude everything except npm defaults such as LICENSE, etc
+*
+!*/
+
+# Whitelist - entries to be included must be negated with "!"
+!*.js
+!*.json
+
+# Whitelist - dist/
+!dist/**/*.js
+!dist/**/*.js.map
+
+!dist/**/*.css
+
+# Whitelist - lib/
+!lib/**/*.d.ts
+
+!lib/**/*.js
+!lib/**/*.js.map
+
+!lib/**/*.css
+
+# Whitelist - src/
+!src/**/*.ts
+!src/**/*.d.ts
+
+!src/**/*.js
+!src/**/*.js.map
+
+!src/**/*.css
+
+# Whitelist - typings/
+!typings/*.d.ts
+
+# Blacklist - (normal behavior) these will override any whitelist
+*.test.ts
+*.test.d.ts
+*.test.js
+*.test.js.map
 lib/test/
-Makefile.gyp
-*.Makefile
-*.target.gyp.mk
-*.node
-example/*.log
+
 docs/
-npm-debug.log
 /.idea/
-.env
+.vscode/
+bin/
 build/
+fixtures/
+coverage/
+demo/

.npmrc

@@ -0,0 +1 @@
+package-lock=false

.travis.yml

@@ -1,20 +0,0 @@
-language: node_js
-os:
-  - linux
-  - osx
-node_js:
-  - 6
-before_install:
-  - if [[ "$TRAVIS_OS_NAME" == "linux" ]]; then sudo add-apt-repository -y ppa:ubuntu-toolchain-r/test ; fi
-  - if [[ "$TRAVIS_OS_NAME" == "linux" ]]; then sudo apt-get -qq update ; fi
-  - if [[ "$TRAVIS_OS_NAME" == "linux" ]]; then sudo apt-get -qq install g++-4.8 ; fi
-  - if [[ "$TRAVIS_OS_NAME" == "linux" ]]; then export CXX=g++-4.8 ; fi
-  - npm install -g npm@5.1.0
-env:
-  matrix:
-    - NPM_COMMAND=lint
-    - NPM_COMMAND=test
-notifications:
-  email: false
-script: npm run $NPM_COMMAND
-after_success: npm run coveralls

.vscode/launch.json

@@ -4,7 +4,7 @@
     {
       "type": "node",
       "request": "launch",
-      "name": "Mocha Tests",
+      "name": "Unit Tests",
       "cwd": "${workspaceRoot}",
       "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/mocha",
       "windows": {
@@ -13,11 +13,51 @@
       "runtimeArgs": [
         "--colors",
         "--recursive",
-        "${workspaceRoot}/lib"
+        "${workspaceRoot}/lib/**/*.test.js"
       ],
       "sourceMaps": true,
       "outFiles": [ "${workspaceRoot}/lib/**/*.js" ],
       "internalConsoleOptions": "openOnSessionStart"
+    },
+    {
+      "type": "node",
+      "request": "launch",
+      "name": "Integration Tests",
+      "cwd": "${workspaceRoot}",
+      "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/mocha",
+      "windows": {
+        "runtimeExecutable": "${workspaceRoot}/node_modules/.bin/mocha.cmd"
+      },
+      "runtimeArgs": [
+        "--colors",
+        "--recursive",
+        "${workspaceRoot}/lib/**/*.api.js"
+      ],
+      "sourceMaps": true,
+      "outFiles": [ "${workspaceRoot}/lib/**/*.js" ],
+      "internalConsoleOptions": "openOnSessionStart"
+    },
+    {
+      "type": "chrome",
+      "request": "launch",
+      "name": "Demo Client",
+      "url": "http://127.0.0.1:3000",
+      "webRoot": "${workspaceFolder}/"
+    },
+    {
+      "type": "node",
+      "request": "launch",
+      "name": "Demo Server",
+      "runtimeExecutable": "npm",
+      "runtimeArgs": [
+        "run",
+        "start-debug"
+      ],
+      "port": 9229,
+      "serverReadyAction": {
+        "action": "openExternally",
+        "pattern": "App listening to (http://.*?:[0-9]+)"
+      }
     }
   ]
 }

.vscode/settings.json

@@ -1,8 +1,3 @@
 {
-    "search.exclude": {
-        "**/node_modules": true,
-        "**/dist": true,
-        "**/build": true,
-        "**/lib": true
-    }
+  "typescript.preferences.quoteStyle": "single"
 }

.vscode/tasks.json

@@ -0,0 +1,51 @@
+{
+	"version": "2.0.0",
+	"presentation": {
+		"echo": false,
+		"reveal": "always",
+		"focus": false,
+		"panel": "dedicated",
+		"showReuseMessage": true
+	},
+	"tasks": [
+		{
+			"type": "npm",
+			"script": "test",
+			"group": "test",
+			"problemMatcher": []
+		},
+		{
+			"type": "npm",
+			"script": "watch",
+			"group": "build",
+			"isBackground": true,
+			"problemMatcher": [],
+			"presentation": {
+				"group": "vscode"
+			}
+		},
+		{
+			"type": "npm",
+			"script": "start",
+			"group": "build",
+			"isBackground": true,
+			"problemMatcher": [],
+			"presentation": {
+				"group": "vscode"
+			}
+		},
+		{
+			"label": "Start demo",
+			"dependsOn": ["npm: watch", "npm: start"],
+			"group": {
+				"kind": "build",
+				"isDefault": true
+			},
+			"isBackground": true,
+			"problemMatcher": [],
+			"presentation": {
+				"group": "vscode"
+			}
+		}
+	]
+}

AUTHORS

@@ -1,92 +0,0 @@
-List of xterm.js contributors. Updated before every release.
-
-Aleksandr Andrienko <aandrienko@codenvy.com>
-Aleksandr Andriienko <oandriie@redhat.com>
-Alessandro Nadalin <alessandro.nadalin@gmail.com>
-Alexander Olsson <noseglid@gmail.com>
-Alexey Kontsevoy <alexey@gravitational.com>
-Anish Athalye <me@anishathalye.com>
-Anthony Lapenna <lapenna.anthony@gmail.com>
-Antonis Kalipetis <akalipetis@sourcelair.com>
-Anton Skshidlevsky <meefik@gmail.com>
-Anton Yurovskykh <anton.yurovskykh@gmail.com>
-Artem Arbatskiy <artyom.arbatskiy@gmail.com>
-Austin Robertson <austinrobertson@gmail.com>
-ayapi <colors.aya@gmail.com>
-Ben Hall <ben@benhall.me.uk>
-Benjamin Fischer <benjamin.fischer@rwth-aachen.de>
-Bill Church <billchurch@users.noreply.github.com>
-Bob Reid <bobreid@Bobs-MacBook-Pro.local>
-bottleofwater <nison.mael+bottleofwater@gmail.com>
-Brian Mock <brian@mockbrian.com>
-Bruno Ribeito <b.m.fernandes.ribeiro@gmail.com>
-Carson Anderson <carson@betterservers.com>
-CHaBou <chabup@delean.fr>
-Christian Budde Christensen <budde377@gmail.com>
-Christof Marti <chrmarti@microsoft.com>
-Christopher Jeffrey <chjjeffrey@gmail.com>
-coderaiser <mnemonic.enemy@gmail.com>
-Dan Brown <jdanbrown@gmail.com>
-Daniel Griffen <daniel@griffen.io>
-Daniel Imms <daimms@microsoft.com>
-Daniel Risacher <drisacher@gmail.com>
-Dan Kaplun <dbkaplun@twitch.tv>
-Darin Morrison <freebroccolo@users.noreply.github.com>
-dcylabs <dcylabs@gmail.com>
-Dominik Csapak <d.csapak@proxmox.com>
-Edgar Andrés Margffoy Tuay <andfoy@gmail.com>
-Elliot Saba <staticfloat@gmail.com>
-Exile <exile@chamber.ee>
-Felipe Gasper <felipe@felipegasper.com>
-ficristo <ficristo.work@gmail.com>
-Gary Ritchie <gary@rstudio.com>
-hiro-su <h.sugipon@gmail.com>
-Ian Lewis <ianlewis@google.com>
-imoses <ido@twiggle.com>
-InDieTasten <indietasten@gmail.com>
-irokas <akasidiari@inf.uth.gr>
-Jakob Gillich <jakob@gillich.me>
-Jean Bruenn <himself@jeanbruenn.info>
-Jeremy Danyow <jedanyow@microsoft.com>
-Joao Moreno <jomo@microsoft.com>
-Joao Moreno <mail@joaomoreno.com>
-Johannes Zellner <johannes@nebulon.de>
-Jon Masters <jon.masters@sky.com>
-Jörg Breitbart <jerch@rockborn.de>
-Justin Mecham <justin@mecham.me>
-Kirill Merkushev <lanwen@yandex.ru>
-Luca <LucaT1@users.noreply.github.com>
-Lucian Buzzo <lucian.buzzo@gmail.com>
-Lukas Drgon <lukas.drgon@gmail.com>
-Maël Nison <nison.mael@gmail.com>
-Marc Dumais <marc.dumais@ericsson.com>
-Martin Chloride <i@martincl2.me>
-Martin Koppehel <martin.koppehel@st.ovgu.de>
-Martin Wang <jiahaow@ca.ibm.com>
-Matt Bierner <matb@microsoft.com>
-Michael Irwin <mikesir87@gmail.com>
-Mikko Karvonen <mikko.karvonen@arm.com>
-mofux <t.zilz@mofux.org>
-Nicolas Ramz <nicolas.ramz@gmail.com>
-npezza93 <npezza93@gmail.com>
-Oleksandr Andriienko <oandriie@redhat.com>
-Paris Kasidiaris <pariskasidiaris@gmail.com>
-Paris Kasidiaris <paris@sourcelair.com>
-Peter Baumgarten <me@peterbaumgarten.com>
-Rick Baker <rick@ricktbaker.com>
-runarberg <runar@greenqloud.com>
-Samuel Williams <samuel.williams@oriontransfer.co.nz>
-Saswat Das <saswatds@users.noreply.github.com>
-Saul Costa <saul@codevolve.com>
-Shuanglei Tao <tsl0922@gmail.com>
-Steven Silvester <steven.silvester@ieee.org>
-stuicey <stuicey@users.noreply.github.com>
-t-amqi <umberos@gmail.com>
-Thanasis Daglis <thanasis@sourcelair.com>
-thomas <thomas@kreativkonzentrat.de>
-Thomas Zilz <t.zilz@mofux.org>
-Tine Jozelj <tine.jozelj@outlook.com>
-Tyler Jewell <tjewell@codenvy.com>
-Vincent Woo <me@vincentwoo.com>
-yutaka <shigure@refy.net>
-YuviPanda <yuvipanda@gmail.com>

CODE_OF_CONDUCT.md

@@ -0,0 +1,73 @@
+# Contributor Covenant Code of Conduct
+
+## Our Pledge
+
+In the interest of fostering an open and welcoming environment, we as
+contributors and maintainers pledge to making participation in our project and
+our community a harassment-free experience for everyone, regardless of age, body
+size, disability, ethnicity, gender identity and expression, level of experience,
+education, socio-economic status, nationality, personal appearance, race,
+religion, or sexual identity and orientation.
+
+## Our Standards
+
+Examples of behavior that contributes to creating a positive environment
+include:
+
+* Using welcoming and inclusive language
+* Being respectful of differing viewpoints and experiences
+* Gracefully accepting constructive criticism
+* Focusing on what is best for the community
+* Showing empathy towards other community members
+
+Examples of unacceptable behavior by participants include:
+
+* The use of sexualized language or imagery and unwelcome sexual attention or
+  advances
+* Trolling, insulting/derogatory comments, and personal or political attacks
+* Public or private harassment
+* Publishing others' private information, such as a physical or electronic
+  address, without explicit permission
+* Other conduct which could reasonably be considered inappropriate in a
+  professional setting
+
+## Our Responsibilities
+
+Project maintainers are responsible for clarifying the standards of acceptable
+behavior and are expected to take appropriate and fair corrective action in
+response to any instances of unacceptable behavior.
+
+Project maintainers have the right and responsibility to remove, edit, or
+reject comments, commits, code, wiki edits, issues, and other contributions
+that are not aligned to this Code of Conduct, or to ban temporarily or
+permanently any contributor for other behaviors that they deem inappropriate,
+threatening, offensive, or harmful.
+
+## Scope
+
+This Code of Conduct applies both within project spaces and in public spaces
+when an individual is representing the project or its community. Examples of
+representing a project or community include using an official project e-mail
+address, posting via an official social media account, or acting as an appointed
+representative at an online or offline event. Representation of a project may be
+further defined and clarified by project maintainers.
+
+## Enforcement
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be
+reported by contacting [@Tyriar](https://twitter.com/Tyriar) or [@pariskasid](https://twitter.com/pariskasid) on Twitter. All
+complaints will be reviewed and investigated and will result in a response that
+is deemed necessary and appropriate to the circumstances. The project team is
+obligated to maintain confidentiality with regard to the reporter of an incident.
+Further details of specific enforcement policies may be posted separately.
+
+Project maintainers who do not follow or enforce the Code of Conduct in good
+faith may face temporary or permanent repercussions as determined by other
+members of the project's leadership.
+
+## Attribution
+
+This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
+available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html
+
+[homepage]: https://www.contributor-covenant.org

CONTRIBUTING.md

@@ -23,29 +23,31 @@ opening an issue, read these pointers.
 - Mention precisely what went wrong. What did you expect to happen? What happened instead? Describe the
   exact steps a maintainer has to take to make the problem occur.
 
-- If the problem can not be reproduced in the [demo of xterm.js](README.md#demo), please provide an HTML document that demonstrates the problem.
+- If the problem can not be reproduced in the [demo of xterm.js](https://github.com/xtermjs/xterm.js/wiki/Contributing#running-the-demo), please provide an HTML document that demonstrates the problem.
 
 - Be polite. Issues with an indignant or belligerent tone tend to be moved to the
   bottom of the pile.
 
 ## Contributing code
 
-- Make sure you have a [GitHub account](https://github.com/join)
+You can find issues to work on by looking at the [help wanted](https://github.com/xtermjs/xterm.js/issues?q=is%3Aissue+is%3Aopen+label%3A%22help+wanted%22) or [good first issue](https://github.com/xtermjs/xterm.js/issues?q=is%3Aissue+is%3Aopen+label%3A%22good+first+issue%22) issues. It's a good idea to comment on the issue saying that you're taking it, just in case someone else comes along and you duplicate work. Once you have your issue, here are the steps to contribute:
+
 - Fork [xterm.js](https://github.com/sourcelair/xterm.js/)
-  ([how to fork a repo](https://help.github.com/articles/fork-a-repo))
-- Make your changes
+  ([how to fork a repo](https://help.github.com/articles/fork-a-repo)).
+- Get the [xterm.js demo](https://github.com/xtermjs/xterm.js/wiki/Contributing#running-the-demo) running.
+- Make your changes.
 - If your changes are easy to test or likely to regress, add tests. Tests go into `test`, directory.
 - Follow the general code style of the rest of the project (see below).
 - Submit a pull request
 ([how to create a pull request](https://help.github.com/articles/fork-a-repo)).
   Don't put more than one feature/fix in a single pull request.
 
-By contributing code to xterm.js you
+By contributing code to xterm.js you:
 
- - agree to license the contributed code under xterm.js' [MIT
+ - Agree to license the contributed code under xterm.js' [MIT
    license](LICENSE).
 
- - confirm that you have the right to contribute and license the code
+ - Confirm that you have the right to contribute and license the code
    in question. (Either you hold all rights on the code, or the rights
    holder has explicitly granted the right to use it like this,
    through a compatible open source license or through a direct

Dockerfile

@@ -1,4 +1,4 @@
-FROM node:6
+FROM node:8
 MAINTAINER Paris Kasidiaris <paris@sourcelair.com>
 
 # Set the working directory

LICENSE

@@ -1,3 +1,4 @@
+Copyright (c) 2017-2019, The xterm.js authors (https://github.com/xtermjs/xterm.js)
 Copyright (c) 2014-2016, SourceLair Private Company (https://www.sourcelair.com)
 Copyright (c) 2012-2013, Christopher Jeffrey (https://github.com/chjj/)
 

Procfile

@@ -1 +1,2 @@
 web: npm start
+webpack: npm run watch

README.md

@@ -1,33 +1,33 @@
 # [![xterm.js logo](logo-full.png)](https://xtermjs.org)
 
-[![xterm.js build status](https://api.travis-ci.org/xtermjs/xterm.js.svg)](https://travis-ci.org/xtermjs/xterm.js) [![Coverage Status](https://coveralls.io/repos/github/sourcelair/xterm.js/badge.svg)](https://coveralls.io/github/sourcelair/xterm.js) [![Gitter](https://badges.gitter.im/sourcelair/xterm.js.svg)](https://gitter.im/sourcelair/xterm.js?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge) [![jsDelivr Hits](https://data.jsdelivr.com/v1/package/npm/xterm/badge?style=rounded)](https://www.jsdelivr.com/package/npm/xterm)
+[![Build Status](https://dev.azure.com/xtermjs/xterm.js/_apis/build/status/xtermjs.xterm.js)](https://dev.azure.com/xtermjs/xterm.js/_build/latest?definitionId=3)
+[![Coverage Status](https://coveralls.io/repos/github/xtermjs/xterm.js/badge.svg?branch=master)](https://coveralls.io/github/xtermjs/xterm.js?branch=master)
 
-Xterm.js is a terminal front-end component written in JavaScript that works in the browser.
-
-It enables applications to provide fully featured terminals to their users and create great development experiences.
+Xterm.js is a front-end component written in TypeScript that lets applications bring fully-featured terminals to their users in the browser. It's used by popular projects such as VS Code, Hyper and Theia.
 
 ## Features
-- **Text-based application support**: Use xterm.js to work with applications like `bash`, `git` etc.
-- **Curses-based application support**: Use xterm.js to work with applications like `vim`, `tmux` etc.
-- **Mouse events support**: Xterm.js captures mouse events like click and scroll and passes them to the terminal's back-end controlling process
-- **CJK (Chinese, Japanese, Korean) character support**: Xterm.js renders CJK characters seamlessly
-- **IME support**: Insert international (including CJK) characters using IME input with your keyboard
-- **Self-contained library**: Xterm.js works on its own. It does not require any external libraries like jQuery or React to work
-- **Modular, event-based API**: Lets you build addons and themes with ease
+
+- **Terminal apps just work**: Xterm.js works with most terminal apps such as `bash`, `vim` and `tmux`, this includes support for curses-based apps and mouse event support.
+- **Perfomant**: Xterm.js is *really* fast, it even includes a GPU-accelerated renderer.
+- **Rich unicode support**: Supports CJK, emojis and IMEs.
+- **Self-contained**: Requires zero dependencies to work.
+- **Accessible**: Screen reader support can be turned on using the `screenReaderMode` option.
+- **And much more**: Links, theming, addons, well documented API, etc.
 
 ## What xterm.js is not
-- Xterm.js is not a terminal application that you can download and use on your computer
-- Xterm.js is not `bash`. Xterm.js can be connected to processes like `bash` and let you interact with them (provide input, receive output)
+
+- Xterm.js is not a terminal application that you can download and use on your computer.
+- Xterm.js is not `bash`. Xterm.js can be connected to processes like `bash` and let you interact with them (provide input, receive output).
 
 ## Getting Started
 
 First you need to install the module, we ship exclusively through [npm](https://www.npmjs.com/) so you need that installed and then add xterm.js as a dependency by running:
 
 ```
-npm install
+npm install xterm
 ```
 
-To start using xterm.js on your browser, add the `xterm.js` and `xterm.css` to the head of your html page. Then create a `<div id="terminal"></div>` onto which xterm can attach itself.
+To start using xterm.js on your browser, add the `xterm.js` and `xterm.css` to the head of your html page. Then create a `<div id="terminal"></div>` onto which xterm can attach itself. Finally instantiate the `Terminal` object and then call the `open` function with the DOM object of the `div`.
 
 ```html
 <!doctype html>
@@ -39,43 +39,52 @@ To start using xterm.js on your browser, add the `xterm.js` and `xterm.css` to t
     <body>
       <div id="terminal"></div>
       <script>
-      	var term = new Terminal();
+        var term = new Terminal();
         term.open(document.getElementById('terminal'));
-        term.write('Hello from \033[1;3;31mxterm.js\033[0m $ ')
+        term.write('Hello from \x1B[1;3;31mxterm.js\x1B[0m $ ')
       </script>
     </body>
   </html>
 ```
 
-Finally instantiate the `Terminal` object and then call the `open` function with the DOM object of the `div`.
-
 ### Importing
 
-The proposed way to load xterm.js is via the ES6 module syntax.
+The recommended way to load xterm.js is via the ES6 module syntax:
 
 ```javascript
 import { Terminal } from 'xterm';
 ```
 
-*Note: There are currently no typings for addons so you will need to upcast if using TypeScript, eg. `(<any>xterm).fit()`.*
-
 ### Addons
 
-Addons are JavaScript modules that extend the `Terminal` prototype with new methods and attributes to provide additional functionality. There are a handful available in the main repository in the `src/addons` directory and you can even write your own, by using xterm.js' public API.
+Addons are JavaScript modules that extend the `Terminal` prototype with new methods and attributes to provide additional functionality. There are a handful available in the main repository in the `src/addons` directory and you can even write your own by using the [public API](https://github.com/xtermjs/xterm.js/blob/master/typings/xterm.d.ts).
 
 To use an addon, just import the JavaScript module and pass it to `Terminal`'s `applyAddon` method:
 
 ```javascript
-import { Terminal } from xterm;
+import { Terminal } from 'xterm';
 import * as fit from 'xterm/lib/addons/fit/fit';
 
-
 Terminal.applyAddon(fit);
 
 var xterm = new Terminal();  // Instantiate the terminal
 xterm.fit();                 // Use the `fit` method, provided by the `fit` addon
 ```
 
+You will also need to include the addon's CSS file if it has one in the folder.
+
+#### Importing Addons in TypeScript
+
+There are currently no typings for addons if they are accessed via extending Terminal prototype, so you will need to upcast if using TypeScript, eg. `(xterm as any).fit()`. Alternatively, you can import the addon function and enhance the terminal on demand. This has better typing support and is friendly to treeshaking.
+
+```typescript
+import { Terminal } from 'xterm';
+import { fit } from 'xterm/lib/addons/fit/fit';
+const xterm = new Terminal();
+
+fit(xterm);  // Fit the terminal when necessary
+```
+
 ## Browser Support
 
 Since xterm.js is typically implemented as a developer tool, only modern browsers are supported officially. Here is a list of the versions we aim to support:
@@ -86,22 +95,28 @@ Since xterm.js is typically implemented as a developer tool, only modern browser
 - Safari latest
 - IE11
 
-Xterm.js works seamlessly in Electron apps and may even work on earlier versions of the browsers but these are the browsers we strive to keep working.
+Xterm.js works seamlessly in [Electron](https://electronjs.org/) apps and may even work on earlier versions of the browsers, these are the versions we strive to keep working.
+
+## API
+
+The full API for xterm.js is contained within the [TypeScript declaration file](https://github.com/xtermjs/xterm.js/blob/master/typings/xterm.d.ts), use the branch/tag picker in GitHub (`w`) to navigate to the correct version of the API.
+
+Note that some APIs are marked *experimental*, these are added to enable experimentation with new ideas without committing to support it like a normal [semver](https://semver.org/) API. Note that these APIs can change radically between versions so be sure to read release notes if you plan on using experimental APIs.
 
 ## Real-world uses
 Xterm.js is used in several world-class applications to provide great terminal experiences.
 
-- [**SourceLair**](https://www.sourcelair.com/): In-browser IDE that provides its users with fully-featured Linux terminals based on xterm.js
-- [**Microsoft Visual Studio Code**](http://code.visualstudio.com/): Modern, versatile and powerful open source code editor that provides an integrated terminal based on xterm.js
-- [**ttyd**](https://github.com/tsl0922/ttyd): A command-line tool for sharing terminal over the web, with fully-featured terminal emulation based on xterm.js
+- [**SourceLair**](https://www.sourcelair.com/): In-browser IDE that provides its users with fully-featured Linux terminals based on xterm.js.
+- [**Microsoft Visual Studio Code**](http://code.visualstudio.com/): Modern, versatile and powerful open source code editor that provides an integrated terminal based on xterm.js.
+- [**ttyd**](https://github.com/tsl0922/ttyd): A command-line tool for sharing terminal over the web, with fully-featured terminal emulation based on xterm.js.
 - [**Katacoda**](https://www.katacoda.com/): Katacoda is an Interactive Learning Platform for software developers, covering the latest Cloud Native technologies.
 - [**Eclipse Che**](http://www.eclipse.org/che): Developer workspace server, cloud IDE, and Eclipse next-generation IDE.
 - [**Codenvy**](http://www.codenvy.com): Cloud workspaces for development teams.
-- [**CoderPad**](https://coderpad.io): Online interviewing platform for programmers. Run code in many programming languages, with results displayed by `xterm.js`.
-- [**WebSSH2**](https://github.com/billchurch/WebSSH2): A web based SSH2 client using `xterm.js`, socket.io, and ssh2.
+- [**CoderPad**](https://coderpad.io): Online interviewing platform for programmers. Run code in many programming languages, with results displayed by xterm.js.
+- [**WebSSH2**](https://github.com/billchurch/WebSSH2): A web based SSH2 client using xterm.js, socket.io, and ssh2.
 - [**Spyder Terminal**](https://github.com/spyder-ide/spyder-terminal): A full fledged system terminal embedded on Spyder IDE.
 - [**Cloud Commander**](https://cloudcmd.io "Cloud Commander"): Orthodox web file manager with console and editor.
-- [**Codevolve**](https://www.codevolve.com "Codevolve"): Online platform for interactive coding and web development courses. Live container-backed terminal uses `xterm.js`.
+- [**Codevolve**](https://www.codevolve.com "Codevolve"): Online platform for interactive coding and web development courses. Live container-backed terminal uses xterm.js.
 - [**RStudio**](https://www.rstudio.com/products/RStudio "RStudio"): RStudio is an integrated development environment (IDE) for R.
 - [**Terminal for Atom**](https://github.com/jsmecham/atom-terminal-tab): A simple terminal for the Atom text editor.
 - [**Eclipse Orion**](https://orionhub.org): A modern, open source software development environment that runs in the cloud. Code, deploy and run in the cloud.
@@ -109,60 +124,69 @@ Xterm.js is used in several world-class applications to provide great terminal e
 - [**Hexlet**](https://en.hexlet.io): Practical programming courses (JavaScript, PHP, Unix, databases, functional programming). A steady path from the first line of code to the first job.
 - [**Selenoid UI**](https://github.com/aerokube/selenoid-ui): Simple UI for the scallable golang implementation of Selenium Hub named Selenoid. We use XTerm for streaming logs over websockets from docker containers.
 - [**Portainer**](https://portainer.io): Simple management UI for Docker.
-- [**SSHy**](https://github.com/stuicey/SSHy): HTML5 Based SSHv2 Web Client with E2E encryption utilising `xterm.js`, SJCL & websockets.
-- [**JupyterLab**](https://github.com/jupyterlab/jupyterlab): An extensible 
-computational environment for Jupyter, supporting interactive data science and scientific computing across all programming languages.
+- [**SSHy**](https://github.com/stuicey/SSHy): HTML5 Based SSHv2 Web Client with E2E encryption utilising xterm.js, SJCL & websockets.
+- [**JupyterLab**](https://github.com/jupyterlab/jupyterlab): An extensible computational environment for Jupyter, supporting interactive data science and scientific computing across all programming languages.
 - [**Theia**](https://github.com/theia-ide/theia): Theia is a cloud & desktop IDE framework implemented in TypeScript.
 - [**Opshell**](https://github.com/ricktbaker/opshell) Ops Helper tool to make life easier working with AWS instances across multiple organizations.
 - [**Proxmox VE**](https://www.proxmox.com/en/proxmox-ve): Proxmox VE is a complete open-source platform for enterprise virtualization. It uses xterm.js for container terminals and the host shell.
 - [**Script Runner**](https://github.com/ioquatix/script-runner): Run scripts (or a shell) in Atom.
 - [**Whack Whack Terminal**](https://github.com/Microsoft/WhackWhackTerminal): Terminal emulator for Visual Studio 2017.
 - [**VTerm**](https://github.com/vterm/vterm): Extensible terminal emulator based on Electron and React.
+- [**electerm**](http://electerm.html5beta.com): electerm is a terminal/ssh/sftp client(mac, win, linux) based on electron/node-pty/xterm.
+- [**Kubebox**](https://github.com/astefanutti/kubebox): Terminal console for Kubernetes clusters.
+- [**Azure Cloud Shell**](https://shell.azure.com): Azure Cloud Shell is a Microsoft-managed admin machine built on Azure, for Azure.
+- [**atom-xterm**](https://atom.io/packages/atom-xterm): Atom plugin for providing terminals inside your Atom workspace.
+- [**rtty**](https://github.com/zhaojh329/rtty): Access your terminals from anywhere via the web.
+- [**Pisth**](https://github.com/ColdGrub1384/Pisth): An SFTP and SSH client for iOS.
+- [**abstruse**](https://github.com/bleenco/abstruse): Abstruse CI is a continuous integration platform based on Node.JS and Docker.
+- [**Azure Data Studio**](https://github.com/Microsoft/azuredatastudio): A data management tool that enables working with SQL Server, Azure SQL DB and SQL DW from Windows, macOS and Linux.
+- [**FreeMAN**](https://github.com/matthew-matvei/freeman): A free, cross-platform file manager for power users.
+- [**Fluent Terminal**](https://github.com/felixse/FluentTerminal): A terminal emulator based on UWP and web technologies.
+- [**Hyper**](https://hyper.is): A terminal built on web technologies.
+- [**Diag**](https://diag.ai): A better way to troubleshoot problems faster. Capture, share and reapply troubleshooting knowledge so you can focus on solving problems that matter.
+- [**GoTTY**](https://github.com/yudai/gotty): A simple command line tool that shares your terminal as a web application based on xterm.js.
+- [**genact**](https://github.com/svenstaro/genact): A nonsense activity generator.
+- [**cPanel & WHM**](https://cpanel.com): The hosting platform of choice.
+- [**Nutanix**](https://github.com/nutanix): Nutanix Enterprise Cloud uses xterm in the webssh functionality within Nutanix Calm, and is also looking to move our old noserial (termjs) functionality to xterm.js.
+- [**SSH Web Client**](https://github.com/roke22/PHP-SSH2-Web-Client): SSH Web Client with PHP.
+- [**Shellvault**](https://www.shellvault.io): The cloud-based SSH terminal you can access from anywhere.
+- [**Juno**](http://junolab.org/): A flexible Julia IDE, based on Atom.
+- [**webssh**](https://github.com/huashengdun/webssh): Web based ssh client.
+- [**info-beamer hosted**](https://info-beamer.com): Uses xterm.js to manage digital signage devices from the web dashboard.
+- [**Jumpserver**](https://github.com/jumpserver/luna): Jumpserver Luna project, Jumpserver is a bastion server project, Luna use xterm.js for web terminal emulation.
+- [**LxdMosaic**](https://github.com/turtle0x1/LxdMosaic): Uses xterm.js to give terminal access to containers through LXD
+- [**CodeInterview.io**](https://codeinterview.io): A coding interview platform in 25+ languages and many web frameworks. Uses xterm.js to provide shell access.
+- [**Bastillion**](https://www.bastillion.io): Bastillion is an open-source web-based SSH console that centrally manages administrative access to systems.
+- [**PHP App Server**](https://github.com/cubiclesoft/php-app-server/): Create lightweight, installable almost-native applications for desktop OSes.  ExecTerminal (nicely wraps the xterm.js Terminal), TerminalManager, and RunProcessSDK are self-contained, reusable ES5+ compliant Javascript components.
 
-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.
+[And much more...](https://github.com/xtermjs/xterm.js/network/dependents)
 
-## Demo
-
-### Linux or macOS
-
-First, be sure that a C++ compiler such as GCC-C++ or Clang is installed, then run these commands:
-
-```
-npm install
-npm start
-```
-
-Then open http://0.0.0.0:3000 in a web browser.
-
-### Windows
-
-First, ensure [node-gyp](https://github.com/nodejs/node-gyp) is installed and configured correctly, then run these commands.
-
-```
-npm install
-npm start
-```
-
-Then open http://127.0.0.1:3000 in a web browser.
-
-*Note: Do not use ConEmu, as it seems to break the demo for some reason.*
+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.
 
 ## Releases
 
 Xterm.js follows a monthly release cycle roughly.
 
-The existing releases are available at this GitHub repo's [Releases](https://github.com/sourcelair/xterm.js/releases), while the roadmap is available as [Milestones](https://github.com/sourcelair/xterm.js/milestones).
+All current and past releases are available on this repo's [Releases page](https://github.com/sourcelair/xterm.js/releases), you can view the [high-level roadmap on the wiki](https://github.com/xtermjs/xterm.js/wiki/Roadmap) and see what we're working on now by looking through [Milestones](https://github.com/sourcelair/xterm.js/milestones).
 
-## Development and Contribution
+### Beta builds
 
-Xterm.js is maintained by [SourceLair](https://www.sourcelair.com/) and a few external contributors, but we would love to receive contributions from everyone!
+Our CI releases beta builds to npm for every change that goes into master, install the latest beta build with:
 
-To contribute either code, documentation or issues to xterm.js please read the [Contributing document](CONTRIBUTING.md) beforehand. The development of xterm.js does not require any special tool. All you need is an editor that supports JavaScript/TypeScript and a browser. You will need Node.js installed locally to get all the features working in the demo.
+```
+npm install -S xterm@beta
+```
+
+These should generally be stable but some bugs may slip in, we recommend using the beta build primarily to test out new features and for verifying bug fixes.
+
+## Contributing
+
+You can read the [guide on the wiki](https://github.com/xtermjs/xterm.js/wiki/Contributing) to learn how to contribute and setup xterm.js for development.
 
 ## License Agreement
 
 If you contribute code to this project, you are implicitly allowing your code to be distributed under the MIT license. You are also implicitly verifying that all code is your original work.
 
-Copyright (c) 2014-2017, SourceLair, Private Company ([www.sourcelair.com](https://www.sourcelair.com/home)) (MIT License)
-
+Copyright (c) 2017-2019, [The xterm.js authors](https://github.com/xtermjs/xterm.js/graphs/contributors) (MIT License)<br>
+Copyright (c) 2014-2017, SourceLair, Private Company ([www.sourcelair.com](https://www.sourcelair.com/home)) (MIT License)<br>
 Copyright (c) 2012-2013, Christopher Jeffrey (MIT License)

azure-pipelines.yml

@@ -0,0 +1,115 @@
+# Node.js
+# Build a general Node.js application with npm.
+# Add steps that analyze code, save build artifacts, deploy, and more:
+# https://docs.microsoft.com/vsts/pipelines/languages/javascript
+
+jobs:
+- job: Linux
+  pool:
+    vmImage: 'ubuntu-16.04'
+  steps:
+  - task: NodeTool@0
+    inputs:
+      versionSpec: '8.x'
+    displayName: 'Install Node.js'
+  - task: geeklearningio.gl-vsts-tasks-yarn.yarn-installer-task.YarnInstaller@2
+    inputs:
+      versionSpec: "1.9.4"
+    displayName: 'Install Yarn'
+  - script: |
+      yarn
+    displayName: 'Install dependencies and build'
+  - script: |
+      yarn mocha
+    displayName: 'Unit tests'
+  - script: |
+      yarn lint
+    displayName: 'Lint'
+
+- job: macOS
+  pool:
+    vmImage: 'xcode9-macos10.13'
+  steps:
+  - task: NodeTool@0
+    inputs:
+      versionSpec: '8.x'
+    displayName: 'Install Node.js'
+  - script: |
+      yarn
+    displayName: 'Install dependencies and build'
+  - script: |
+      yarn mocha
+    displayName: 'Unit tests'
+  - script: |
+      yarn lint
+    displayName: 'Lint'
+  - script: |
+      yarn test-coverage
+      export COVERALLS_GIT_BRANCH=$BUILD_SOURCEBRANCHNAME
+      yarn coveralls
+    displayName: 'Generate and publish coverage'
+
+- job: Windows
+  pool:
+    vmImage: 'vs2017-win2016'
+  steps:
+  - task: NodeTool@0
+    inputs:
+      versionSpec: '8.x'
+    displayName: 'Install Node.js'
+  - script: |
+      yarn
+    displayName: 'Install dependencies and build'
+  - script: |
+      yarn mocha
+    displayName: 'Unit tests'
+  - script: |
+      yarn lint
+    displayName: 'Lint'
+    
+- job: IntegrationTests
+  pool:
+    vmImage: 'ubuntu-16.04'
+  steps:
+  - task: NodeTool@0
+    inputs:
+      versionSpec: '8.x'
+    displayName: 'Install Node.js'
+  - task: geeklearningio.gl-vsts-tasks-yarn.yarn-installer-task.YarnInstaller@2
+    inputs:
+      versionSpec: "1.9.4"
+    displayName: 'Install Yarn'
+  - script: |
+      yarn
+    displayName: 'Install dependencies and build'
+  - script: |
+      yarn start &
+      sleep 10
+      yarn test-api --headless
+    displayName: 'Integration tests'
+
+- job: Release
+  dependsOn:
+  - Linux
+  - macOS
+  - Windows
+  - IntegrationTests
+  condition: and(succeeded(), or(eq(variables['Build.SourceBranch'], 'refs/heads/master'), eq(variables['Build.SourceBranch'], 'refs/heads/release/*')))
+  pool:
+    vmImage: 'ubuntu-16.04'
+  steps:
+  - task: NodeTool@0
+    inputs:
+      versionSpec: '8.x'
+    displayName: 'Install Node.js'
+  - task: geeklearningio.gl-vsts-tasks-yarn.yarn-installer-task.YarnInstaller@2
+    inputs:
+      versionSpec: "1.9.4"
+    displayName: 'Install Yarn'
+  - script: |
+      yarn
+      BUILD_DIR=dist npm run build
+    displayName: 'Install dependencies and build'
+  - script: |
+      NPM_AUTH_TOKEN="$(NPM_AUTH_TOKEN)" node ./bin/publish.js
+    displayName: 'Publish to npm'

bin/generate-authors

@@ -1,7 +0,0 @@
-#! /usr/bin/env sh
-
-tail --lines=+3 AUTHORS > AUTHORS.tmp
-git log --format='%aN <%aE>' >> AUTHORS.tmp
-echo "List of xterm.js contributors. Updated before every release.\n" > AUTHORS
-sort -u AUTHORS.tmp >> AUTHORS
-rm -f AUTHORS.tmp

bin/prepare-release

@@ -1,27 +0,0 @@
-#! /usr/bin/env sh
-
-# Usage: ./bin/prepare-release x.y.z
-# x.y.z should be semver (e.g. 1.0.0)
-
-set -e
-
-NEW_VERSION=$1
-CURRENT_PACKAGE_JSON_VERSION=$(cat package.json \
-  | grep version \
-  | head -1 \
-  | awk -F: '{ print $2 }' \
-  | sed 's/[",]//g' \
-  | tr -d '[[:space:]]')
-
-# Build xterm.js into `dist`
-export BUILD_DIR=dist
-npm run build
-
-# Update AUTHORS file
-sh bin/generate-authors
-
-# Update version in package.json
-sed -i "s/\"version\": \"$CURRENT_PACKAGE_JSON_VERSION\"/\"version\": \"$NEW_VERSION\"/g" package.json
-
-git commit -S -s -a -m "Bump version to $NEW_VERSION"
-git tag $NEW_VERSION

bin/publish.js

@@ -0,0 +1,63 @@
+/**
+ * Copyright (c) 2019 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+const cp = require('child_process');
+const fs = require('fs');
+const path = require('path');
+const packageJson = require('../package.json');
+
+// Setup auth
+fs.writeFileSync(`${process.env['HOME']}/.npmrc`, `//registry.npmjs.org/:_authToken=${process.env['NPM_AUTH_TOKEN']}`);
+
+// Determine if this is a stable or beta release
+const publishedVersions = getPublishedVersions();
+const isStableRelease = publishedVersions.indexOf(packageJson.version) === -1;
+
+// Get the next version
+let nextVersion = isStableRelease ? packageJson.version : getNextBetaVersion();
+console.log(`Publishing version: ${nextVersion}`);
+
+// Set the version in package.json
+const packageJsonFile = path.resolve(__dirname, '..', 'package.json');
+packageJson.version = nextVersion;
+fs.writeFileSync(packageJsonFile, JSON.stringify(packageJson, null, 2));
+
+// Publish
+const args = ['publish'];
+if (!isStableRelease) {
+  args.push('--tag', 'beta');
+}
+const result = cp.spawn('npm', args, { stdio: 'inherit' });
+result.on('exit', code => process.exit(code));
+
+function getNextBetaVersion() {
+  if (!/^[0-9]+\.[0-9]+\.[0-9]+$/.exec(packageJson.version)) {
+    console.error('The package.json version must be of the form x.y.z');
+    process.exit(1);
+  }
+  const tag = 'beta';
+  const stableVersion = packageJson.version.split('.');
+  const nextStableVersion = `${stableVersion[0]}.${parseInt(stableVersion[1]) + 1}.0`;
+  const publishedVersions = getPublishedVersions(nextStableVersion, tag);
+  if (publishedVersions.length === 0) {
+    return `${nextStableVersion}-${tag}1`;
+  }
+  const latestPublishedVersion = publishedVersions.sort((a, b) => {
+    const aVersion = parseInt(a.substr(a.search(/[0-9]+$/)));
+    const bVersion = parseInt(b.substr(b.search(/[0-9]+$/)));
+    return aVersion > bVersion ? -1 : 1;
+  })[0];
+  const latestTagVersion = parseInt(latestPublishedVersion.substr(latestPublishedVersion.search(/[0-9]+$/)), 10);
+  return `${nextStableVersion}-${tag}${latestTagVersion + 1}`;
+}
+
+function getPublishedVersions(version, tag) {
+  const versionsProcess = cp.spawnSync('npm', ['view', packageJson.name, 'versions', '--json']);
+  const versionsJson = JSON.parse(versionsProcess.stdout);
+  if (tag) {
+    return versionsJson.filter(v => !v.search(new RegExp(`${version}-${tag}[0-9]+`)));
+  }
+  return versionsJson;
+}

bin/release

@@ -1,22 +0,0 @@
-#! /usr/bin/env sh
-
-# Usage: ./bin/release x.y.z
-# x.y.z should be semver (e.g. 1.0.0)
-
-set -e
-
-if [ -z "$1" ];
-  then
-    echo "No version supplied. Please a version argument\n"
-    echo "Usage: $0 VERSION\n"
-    echo "Example: $0 1.0.0"
-    exit
-fi
-
-NEW_VERSION=$1
-
-./bin/prepare-release $NEW_VERSION
-
-git push && \
-git push --tags && \
-npm publish

demo/app.js

@@ -1,88 +0,0 @@
-var express = require('express');
-var app = express();
-var expressWs = require('express-ws')(app);
-var os = require('os');
-var pty = require('node-pty');
-
-var terminals = {},
-    logs = {};
-
-app.use('/build', express.static(__dirname + '/../build'));
-
-app.get('/', function(req, res){
-  res.sendFile(__dirname + '/index.html');
-});
-
-app.get('/style.css', function(req, res){
-  res.sendFile(__dirname + '/style.css');
-});
-
-app.get('/dist/bundle.js', function(req, res){
-  res.sendFile(__dirname + '/dist/bundle.js');
-});
-
-app.get('/dist/bundle.js.map', function(req, res){
-  res.sendFile(__dirname + '/dist/bundle.js.map');
-});
-
-app.post('/terminals', function (req, res) {
-  var cols = parseInt(req.query.cols),
-      rows = parseInt(req.query.rows),
-      term = pty.spawn(process.platform === 'win32' ? 'cmd.exe' : 'bash', [], {
-        name: 'xterm-color',
-        cols: cols || 80,
-        rows: rows || 24,
-        cwd: process.env.PWD,
-        env: process.env
-      });
-
-  console.log('Created terminal with PID: ' + term.pid);
-  terminals[term.pid] = term;
-  logs[term.pid] = '';
-  term.on('data', function(data) {
-    logs[term.pid] += data;
-  });
-  res.send(term.pid.toString());
-  res.end();
-});
-
-app.post('/terminals/:pid/size', function (req, res) {
-  var pid = parseInt(req.params.pid),
-      cols = parseInt(req.query.cols),
-      rows = parseInt(req.query.rows),
-      term = terminals[pid];
-
-  term.resize(cols, rows);
-  console.log('Resized terminal ' + pid + ' to ' + cols + ' cols and ' + rows + ' rows.');
-  res.end();
-});
-
-app.ws('/terminals/:pid', function (ws, req) {
-  var term = terminals[parseInt(req.params.pid)];
-  console.log('Connected to terminal ' + term.pid);
-  ws.send(logs[term.pid]);
-
-  term.on('data', function(data) {
-    try {
-      ws.send(data);
-    } catch (ex) {
-      // The WebSocket is not open, ignore
-    }
-  });
-  ws.on('message', function(msg) {
-    term.write(msg);
-  });
-  ws.on('close', function () {
-    term.kill();
-    console.log('Closed terminal ' + term.pid);
-    // Clean things up
-    delete terminals[term.pid];
-    delete logs[term.pid];
-  });
-});
-
-var port = process.env.PORT || 3000,
-    host = os.platform() === 'win32' ? '127.0.0.1' : '0.0.0.0';
-
-console.log('App listening to http://' + host + ':' + port);
-app.listen(port, host);

demo/client.ts

@@ -0,0 +1,304 @@
+/**
+ * Copyright (c) 2018 The xterm.js authors. All rights reserved.
+ * @license MIT
+ *
+ * This file is the entry point for browserify.
+ */
+
+/// <reference path="../typings/xterm.d.ts"/>
+
+import { Terminal } from '../lib/public/Terminal';
+import { AttachAddon } from 'xterm-addon-attach';
+import { SearchAddon, ISearchOptions } from 'xterm-addon-search';
+import { WebLinksAddon } from 'xterm-addon-web-links';
+
+import * as fit from '../lib/addons/fit/fit';
+
+// Pulling in the module's types relies on the <reference> above, it's looks a
+// little weird here as we're importing "this" module
+import { Terminal as TerminalType, ITerminalOptions } from 'xterm';
+
+export interface IWindowWithTerminal extends Window {
+  term: TerminalType;
+  Terminal?: typeof TerminalType;
+}
+declare let window: IWindowWithTerminal;
+
+Terminal.applyAddon(fit);
+
+let term;
+let searchAddon: SearchAddon;
+let protocol;
+let socketURL;
+let socket;
+let pid;
+
+const terminalContainer = document.getElementById('terminal-container');
+const actionElements = {
+  findNext: <HTMLInputElement>document.querySelector('#find-next'),
+  findPrevious: <HTMLInputElement>document.querySelector('#find-previous')
+};
+const paddingElement = <HTMLInputElement>document.getElementById('padding');
+
+function setPadding(): void {
+  term.element.style.padding = parseInt(paddingElement.value, 10).toString() + 'px';
+  term.fit();
+}
+
+function getSearchOptions(): ISearchOptions {
+  return {
+    regex: (document.getElementById('regex') as HTMLInputElement).checked,
+    wholeWord: (document.getElementById('whole-word') as HTMLInputElement).checked,
+    caseSensitive: (document.getElementById('case-sensitive') as HTMLInputElement).checked
+  };
+}
+
+const disposeRecreateButtonHandler = () => {
+  // If the terminal exists dispose of it, otherwise recreate it
+  if (term) {
+    term.dispose();
+    term = null;
+    window.term = null;
+    socket = null;
+    document.getElementById('dispose').innerHTML = 'Recreate Terminal';
+  }
+  else {
+    createTerminal();
+    document.getElementById('dispose').innerHTML = 'Dispose terminal';
+  }
+};
+
+if (document.location.pathname === '/test') {
+  window.Terminal = Terminal;
+} else {
+  createTerminal();
+  document.getElementById('dispose').addEventListener('click', disposeRecreateButtonHandler);
+}
+
+function createTerminal(): void {
+  // Clean terminal
+  while (terminalContainer.children.length) {
+    terminalContainer.removeChild(terminalContainer.children[0]);
+  }
+
+  const isWindows = ['Windows', 'Win16', 'Win32', 'WinCE'].indexOf(navigator.platform) >= 0;
+  term = new Terminal({
+    windowsMode: isWindows
+  } as ITerminalOptions);
+
+  // Load addons
+  const typedTerm = term as TerminalType;
+  typedTerm.loadAddon(new WebLinksAddon());
+  searchAddon = new SearchAddon();
+  typedTerm.loadAddon(searchAddon);
+
+  window.term = term;  // Expose `term` to window for debugging purposes
+  term.onResize((size: { cols: number, rows: number }) => {
+    if (!pid) {
+      return;
+    }
+    const cols = size.cols;
+    const rows = size.rows;
+    const url = '/terminals/' + pid + '/size?cols=' + cols + '&rows=' + rows;
+
+    fetch(url, {method: 'POST'});
+  });
+  protocol = (location.protocol === 'https:') ? 'wss://' : 'ws://';
+  socketURL = protocol + location.hostname + ((location.port) ? (':' + location.port) : '') + '/terminals/';
+
+  term.open(terminalContainer);
+  term.fit();
+  term.focus();
+
+  addDomListener(paddingElement, 'change', setPadding);
+
+  addDomListener(actionElements.findNext, 'keyup', (e) => {
+    const searchOptions = getSearchOptions();
+    searchOptions.incremental = e.key !== `Enter`;
+    searchAddon.findNext(actionElements.findNext.value, searchOptions);
+  });
+
+  addDomListener(actionElements.findPrevious, 'keyup', (e) => {
+    if (e.key === `Enter`) {
+      searchAddon.findPrevious(actionElements.findPrevious.value, getSearchOptions());
+    }
+  });
+
+  // fit is called within a setTimeout, cols and rows need this.
+  setTimeout(() => {
+    initOptions(term);
+    // TODO: Clean this up, opt-cols/rows doesn't exist anymore
+    (<HTMLInputElement>document.getElementById(`opt-cols`)).value = term.cols;
+    (<HTMLInputElement>document.getElementById(`opt-rows`)).value = term.rows;
+    paddingElement.value = '0';
+
+    // Set terminal size again to set the specific dimensions on the demo
+    updateTerminalSize();
+
+    fetch('/terminals?cols=' + term.cols + '&rows=' + term.rows, {method: 'POST'}).then((res) => {
+      res.text().then((processId) => {
+        pid = processId;
+        socketURL += processId;
+        socket = new WebSocket(socketURL);
+        socket.onopen = runRealTerminal;
+        socket.onclose = runFakeTerminal;
+        socket.onerror = runFakeTerminal;
+      });
+    });
+  }, 0);
+}
+
+function runRealTerminal(): void {
+  /**
+   * The demo defaults to string transport by default.
+   * To run it with UTF8 binary transport, swap comment on
+   * the lines below. (Must also be switched in server.js)
+   */
+  term.loadAddon(new AttachAddon(socket));
+  // term.loadAddon(new AttachAddon(socket, {inputUtf8: true}));
+
+  term._initialized = true;
+}
+
+function runFakeTerminal(): void {
+  if (term._initialized) {
+    return;
+  }
+
+  term._initialized = true;
+
+  term.prompt = () => {
+    term.write('\r\n$ ');
+  };
+
+  term.writeln('Welcome to xterm.js');
+  term.writeln('This is a local terminal emulation, without a real terminal in the back-end.');
+  term.writeln('Type some keys and commands to play around.');
+  term.writeln('');
+  term.prompt();
+
+  term.onKey((e: { key: string, domEvent: KeyboardEvent }) => {
+    const ev = e.domEvent;
+    const printable = !ev.altKey && !ev.ctrlKey && !ev.metaKey;
+
+    if (ev.keyCode === 13) {
+      term.prompt();
+    } else if (ev.keyCode === 8) {
+     // Do not delete the prompt
+      if (term._core.buffer.x > 2) {
+        term.write('\b \b');
+      }
+    } else if (printable) {
+      term.write(e.key);
+    }
+  });
+}
+
+function initOptions(term: TerminalType): void {
+  const blacklistedOptions = [
+    // Internal only options
+    'cancelEvents',
+    'convertEol',
+    'debug',
+    'handler',
+    'screenKeys',
+    'termName',
+    'useFlowControl',
+    // Complex option
+    'theme'
+  ];
+  const stringOptions = {
+    bellSound: null,
+    bellStyle: ['none', 'sound'],
+    cursorStyle: ['block', 'underline', 'bar'],
+    experimentalCharAtlas: ['none', 'static', 'dynamic'],
+    fontFamily: null,
+    fontWeight: ['normal', 'bold', '100', '200', '300', '400', '500', '600', '700', '800', '900'],
+    fontWeightBold: ['normal', 'bold', '100', '200', '300', '400', '500', '600', '700', '800', '900'],
+    rendererType: ['dom', 'canvas']
+  };
+  const options = Object.keys((<any>term)._core.options);
+  const booleanOptions = [];
+  const numberOptions = [];
+  options.filter(o => blacklistedOptions.indexOf(o) === -1).forEach(o => {
+    switch (typeof term.getOption(o)) {
+      case 'boolean':
+        booleanOptions.push(o);
+        break;
+      case 'number':
+        numberOptions.push(o);
+        break;
+      default:
+        if (Object.keys(stringOptions).indexOf(o) === -1) {
+          console.warn(`Unrecognized option: "${o}"`);
+        }
+    }
+  });
+
+  let html = '';
+  html += '<div class="option-group">';
+  booleanOptions.forEach(o => {
+    html += `<div class="option"><label><input id="opt-${o}" type="checkbox" ${term.getOption(o) ? 'checked' : ''}/> ${o}</label></div>`;
+  });
+  html += '</div><div class="option-group">';
+  numberOptions.forEach(o => {
+    html += `<div class="option"><label>${o} <input id="opt-${o}" type="number" value="${term.getOption(o)}" step="${o === 'lineHeight' ? '0.1' : '1'}"/></label></div>`;
+  });
+  html += '</div><div class="option-group">';
+  Object.keys(stringOptions).forEach(o => {
+    if (stringOptions[o]) {
+      html += `<div class="option"><label>${o} <select id="opt-${o}">${stringOptions[o].map(v => `<option ${term.getOption(o) === v ? 'selected' : ''}>${v}</option>`).join('')}</select></label></div>`;
+    } else {
+      html += `<div class="option"><label>${o} <input id="opt-${o}" type="text" value="${term.getOption(o)}"/></label></div>`;
+    }
+  });
+  html += '</div>';
+
+  const container = document.getElementById('options-container');
+  container.innerHTML = html;
+
+  // Attach listeners
+  booleanOptions.forEach(o => {
+    const input = <HTMLInputElement>document.getElementById(`opt-${o}`);
+    addDomListener(input, 'change', () => {
+      console.log('change', o, input.checked);
+      term.setOption(o, input.checked);
+    });
+  });
+  numberOptions.forEach(o => {
+    const input = <HTMLInputElement>document.getElementById(`opt-${o}`);
+    addDomListener(input, 'change', () => {
+      console.log('change', o, input.value);
+      if (o === 'cols' || o === 'rows') {
+        updateTerminalSize();
+      } else if (o === 'lineHeight') {
+        term.setOption(o, parseFloat(input.value));
+        updateTerminalSize();
+      } else {
+        term.setOption(o, parseInt(input.value));
+      }
+    });
+  });
+  Object.keys(stringOptions).forEach(o => {
+    const input = <HTMLInputElement>document.getElementById(`opt-${o}`);
+    addDomListener(input, 'change', () => {
+      console.log('change', o, input.value);
+      term.setOption(o, input.value);
+    });
+  });
+}
+
+function addDomListener(element: HTMLElement, type: string, handler: (...args: any[]) => any): void {
+  element.addEventListener(type, handler);
+  term._core.register({ dispose: () => element.removeEventListener(type, handler) });
+}
+
+function updateTerminalSize(): void {
+  const cols = parseInt((<HTMLInputElement>document.getElementById(`opt-cols`)).value, 10);
+  const rows = parseInt((<HTMLInputElement>document.getElementById(`opt-rows`)).value, 10);
+  const width = (cols * term._core._renderCoordinator.dimensions.actualCellWidth + term._core.viewport.scrollBarWidth).toString() + 'px';
+  const height = (rows * term._core._renderCoordinator.dimensions.actualCellHeight).toString() + 'px';
+  terminalContainer.style.width = width;
+  terminalContainer.style.height = height;
+  term.fit();
+}

demo/index.html

@@ -1,70 +1,41 @@
 <!doctype html>
 <html>
-    <head>
-        <title>xterm.js demo</title>
-        <link rel="stylesheet" href="/build/xterm.css" />
-        <link rel="stylesheet" href="/build/addons/fullscreen/fullscreen.css" />
-        <link rel="stylesheet" href="style.css" />
-      	<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-promise/4.1.1/es6-promise.auto.min.js"></script>
-      	<script src="https://cdnjs.cloudflare.com/ajax/libs/fetch/1.0.0/fetch.min.js"></script>
-    </head>
-    <body>
-        <h1>xterm.js: xterm, in the browser</h1>
-        <div id="terminal-container"></div>
-        <div>
-          <h2>Actions</h2>
-          <p>
-            <label>Find next <input id="find-next"/></label>
-            <label>Find previous <input id="find-previous"/></label>
-          </p>
-        </div>
-        <div>
-          <h2>Options</h2>
-          <p>
-            <label><input type="checkbox" id="option-cursor-blink"> cursorBlink</label>
-          </p>
-          <p>
-            <label>
-              cursorStyle
-              <select id="option-cursor-style">
-                <option value="block">block</option>
-                <option value="underline">underline</option>
-                <option value="bar">bar</option>
-              </select>
-            </label>
-          </p>
-          <p>
-            <label>
-              bellStyle
-              <select id="option-bell-style">
-                <option value="">none</option>
-                <option value="sound">sound</option>
-                <option value="visual">visual</option>
-                <option value="both">both</option>
-              </select>
-            </label>
-          </p>
-          <p>
-            <label>scrollback <input type="number" id="option-scrollback" value="1000" /></label>
-          </p>
-          <p>
-            <label>tabStopWidth <input type="number" id="option-tabstopwidth" value="8" /></label>
-          </p>
-          <div>
-          	<h3>Size</h3>
-            <div>
-              <div style="display: inline-block; margin-right: 16px;">
-                <label for="cols">Columns</label>
-                <input type="number" id="cols" />
-              </div>
-              <div style="display: inline-block; margin-right: 16px;">
-                <label for="rows">Rows</label>
-                <input type="number" id="rows" />
-              </div>
-            </div>
-          </div>
-        </div>
-        <p><strong>Attention:</strong> The demo is a barebones implementation and is designed for xterm.js evaluation purposes only. Exposing the demo to the public as is would introduce security risks for the host.</p>
-        <script src="dist/bundle.js" defer ></script>
-    </body>
+  <head>
+    <title>xterm.js demo</title>
+    <link rel="shortcut icon" type="image/png" href="/logo.png">
+    <link rel="stylesheet" href="/src/xterm.css" />
+    <link rel="stylesheet" href="style.css" />
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/es6-promise/4.1.1/es6-promise.auto.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/fetch/1.0.0/fetch.min.js"></script>
+  </head>
+  <body>
+    <h1 style="color: #2D2E2C">xterm.js: A terminal for the <em style="color: #5DA5D5">web</em></h1>
+    <div id="terminal-container"></div>
+    <div>
+      <h3>Actions</h3>
+      <p>
+        <label>Find next <input id="find-next"/></label>
+        <label>Find previous <input id="find-previous"/></label>
+        <label>Use regex<input type="checkbox" id="regex"/></label>
+        <label>Case sensitive<input type="checkbox" id="case-sensitive"/></label>
+        <label>Whole word<input type="checkbox" id="whole-word"/></label>
+      </p>
+    </div>
+    <div>
+      <h3>Options</h3>
+      <p>These options can be set in the <code>Terminal</code> constructor or using the <code>Terminal.setOption</code> function.</p>
+      <div id="options-container"></div>
+    </div>
+    <div>
+      <h3>Style</h3>
+      <div style="display: inline-block; margin-right: 16px;">
+        <label for="padding">Padding</label>
+        <input type="number" id="padding" />
+      </div>
+    </div>
+    <hr/>
+    <p><strong>Attention:</strong> The demo is a barebones implementation and is designed for the development and evaluation of xterm.js only. Exposing the demo to the public as is would introduce security risks for the host.</p>
+    <button id="dispose" title="This is used to testing memory leaks">Dispose terminal</button>
+    <script src="dist/client-bundle.js" defer ></script>
+  </body>
 </html>

demo/main.js

@@ -1,179 +0,0 @@
-import * as Terminal from '../build/xterm';
-import * as attach from '../build/addons/attach/attach';
-import * as fit from '../build/addons/fit/fit';
-import * as fullscreen from '../build/addons/fullscreen/fullscreen';
-import * as search from '../build/addons/search/search';
-import * as winptyCompat from '../build/addons/winptyCompat/winptyCompat';
-
-
-Terminal.applyAddon(attach);
-Terminal.applyAddon(fit);
-Terminal.applyAddon(fullscreen);
-Terminal.applyAddon(search);
-Terminal.applyAddon(winptyCompat);
-
-
-var term,
-    protocol,
-    socketURL,
-    socket,
-    pid;
-
-var terminalContainer = document.getElementById('terminal-container'),
-    actionElements = {
-      findNext: document.querySelector('#find-next'),
-      findPrevious: document.querySelector('#find-previous')
-    },
-    optionElements = {
-      cursorBlink: document.querySelector('#option-cursor-blink'),
-      cursorStyle: document.querySelector('#option-cursor-style'),
-      scrollback: document.querySelector('#option-scrollback'),
-      tabstopwidth: document.querySelector('#option-tabstopwidth'),
-      bellStyle: document.querySelector('#option-bell-style')
-    },
-    colsElement = document.getElementById('cols'),
-    rowsElement = document.getElementById('rows');
-
-function setTerminalSize() {
-  var cols = parseInt(colsElement.value, 10);
-  var rows = parseInt(rowsElement.value, 10);
-  var viewportElement = document.querySelector('.xterm-viewport');
-  var scrollBarWidth = viewportElement.offsetWidth - viewportElement.clientWidth;
-  var width = (cols * term.renderer.dimensions.actualCellWidth + 20 /*room for scrollbar*/).toString() + 'px';
-  var height = (rows * term.renderer.dimensions.actualCellHeight).toString() + 'px';
-
-  terminalContainer.style.width = width;
-  terminalContainer.style.height = height;
-  term.resize(cols, rows);
-}
-
-colsElement.addEventListener('change', setTerminalSize);
-rowsElement.addEventListener('change', setTerminalSize);
-
-actionElements.findNext.addEventListener('keypress', function (e) {
-  if (e.key === "Enter") {
-    e.preventDefault();
-    term.findNext(actionElements.findNext.value);
-  }
-});
-actionElements.findPrevious.addEventListener('keypress', function (e) {
-  if (e.key === "Enter") {
-    e.preventDefault();
-    term.findPrevious(actionElements.findPrevious.value);
-  }
-});
-
-optionElements.cursorBlink.addEventListener('change', function () {
-  term.setOption('cursorBlink', optionElements.cursorBlink.checked);
-});
-optionElements.cursorStyle.addEventListener('change', function () {
-  term.setOption('cursorStyle', optionElements.cursorStyle.value);
-});
-optionElements.bellStyle.addEventListener('change', function () {
-  term.setOption('bellStyle', optionElements.bellStyle.value);
-});
-optionElements.scrollback.addEventListener('change', function () {
-  term.setOption('scrollback', parseInt(optionElements.scrollback.value, 10));
-});
-optionElements.tabstopwidth.addEventListener('change', function () {
-  term.setOption('tabStopWidth', parseInt(optionElements.tabstopwidth.value, 10));
-});
-
-createTerminal();
-
-function createTerminal() {
-  // Clean terminal
-  while (terminalContainer.children.length) {
-    terminalContainer.removeChild(terminalContainer.children[0]);
-  }
-  term = new Terminal({
-    cursorBlink: optionElements.cursorBlink.checked,
-    scrollback: parseInt(optionElements.scrollback.value, 10),
-    tabStopWidth: parseInt(optionElements.tabstopwidth.value, 10)
-  });
-  window.term = term;  // Expose `term` to window for debugging purposes
-  term.on('resize', function (size) {
-    if (!pid) {
-      return;
-    }
-    var cols = size.cols,
-        rows = size.rows,
-        url = '/terminals/' + pid + '/size?cols=' + cols + '&rows=' + rows;
-
-    fetch(url, {method: 'POST'});
-  });
-  protocol = (location.protocol === 'https:') ? 'wss://' : 'ws://';
-  socketURL = protocol + location.hostname + ((location.port) ? (':' + location.port) : '') + '/terminals/';
-
-  term.open(terminalContainer);
-  term.winptyCompatInit();
-  term.fit();
-  term.focus();
-
-  // fit is called within a setTimeout, cols and rows need this.
-  setTimeout(function () {
-    colsElement.value = term.cols;
-    rowsElement.value = term.rows;
-
-    // Set terminal size again to set the specific dimensions on the demo
-    setTerminalSize();
-
-    fetch('/terminals?cols=' + term.cols + '&rows=' + term.rows, {method: 'POST'}).then(function (res) {
-
-      res.text().then(function (processId) {
-        pid = processId;
-        socketURL += processId;
-        socket = new WebSocket(socketURL);
-        socket.onopen = runRealTerminal;
-        socket.onclose = runFakeTerminal;
-        socket.onerror = runFakeTerminal;
-      });
-    });
-  }, 0);
-}
-
-function runRealTerminal() {
-  term.attach(socket);
-  term._initialized = true;
-}
-
-function runFakeTerminal() {
-  if (term._initialized) {
-    return;
-  }
-
-  term._initialized = true;
-
-  var shellprompt = '$ ';
-
-  term.prompt = function () {
-    term.write('\r\n' + shellprompt);
-  };
-
-  term.writeln('Welcome to xterm.js');
-  term.writeln('This is a local terminal emulation, without a real terminal in the back-end.');
-  term.writeln('Type some keys and commands to play around.');
-  term.writeln('');
-  term.prompt();
-
-  term.on('key', function (key, ev) {
-    var printable = (
-      !ev.altKey && !ev.altGraphKey && !ev.ctrlKey && !ev.metaKey
-    );
-
-    if (ev.keyCode == 13) {
-      term.prompt();
-    } else if (ev.keyCode == 8) {
-     // Do not delete the prompt
-      if (term.x > 2) {
-        term.write('\b \b');
-      }
-    } else if (printable) {
-      term.write(key);
-    }
-  });
-
-  term.on('paste', function (data, ev) {
-    term.write(data);
-  });
-}

demo/server.js

@@ -0,0 +1,138 @@
+var express = require('express');
+var expressWs = require('express-ws');
+var os = require('os');
+var pty = require('node-pty');
+
+/**
+ * Whether to use UTF8 binary transport.
+ * (Must also be switched in client.ts)
+ */
+const USE_BINARY_UTF8 = false;
+
+
+function startServer() {
+  var app = express();
+  expressWs(app);
+
+  var terminals = {},
+      logs = {};
+
+  app.use('/src', express.static(__dirname + '/../src'));
+  app.get('/logo.png', (req, res) => res.sendFile(__dirname + '/logo.png'));
+
+  app.get('/', function(req, res){
+    res.sendFile(__dirname + '/index.html');
+  });
+
+  app.get('/test', function(req, res){
+    res.sendFile(__dirname + '/test.html');
+  });
+
+  app.get('/style.css', function(req, res){
+    res.sendFile(__dirname + '/style.css');
+  });
+
+  app.get('/dist/client-bundle.js', function(req, res){
+    res.sendFile(__dirname + '/dist/client-bundle.js');
+  });
+
+  app.post('/terminals', function (req, res) {
+    var cols = parseInt(req.query.cols),
+        rows = parseInt(req.query.rows),
+        term = pty.spawn(process.platform === 'win32' ? 'cmd.exe' : 'bash', [], {
+          name: 'xterm-color',
+          cols: cols || 80,
+          rows: rows || 24,
+          cwd: process.env.PWD,
+          env: process.env,
+          encoding: USE_BINARY_UTF8 ? null : 'utf8'
+        });
+
+    console.log('Created terminal with PID: ' + term.pid);
+    terminals[term.pid] = term;
+    logs[term.pid] = '';
+    term.on('data', function(data) {
+      logs[term.pid] += data;
+    });
+    res.send(term.pid.toString());
+    res.end();
+  });
+
+  app.post('/terminals/:pid/size', function (req, res) {
+    var pid = parseInt(req.params.pid),
+        cols = parseInt(req.query.cols),
+        rows = parseInt(req.query.rows),
+        term = terminals[pid];
+
+    term.resize(cols, rows);
+    console.log('Resized terminal ' + pid + ' to ' + cols + ' cols and ' + rows + ' rows.');
+    res.end();
+  });
+
+  app.ws('/terminals/:pid', function (ws, req) {
+    var term = terminals[parseInt(req.params.pid)];
+    console.log('Connected to terminal ' + term.pid);
+    ws.send(logs[term.pid]);
+
+    // string message buffering
+    function buffer(socket, timeout) {
+      let s = '';
+      let sender = null;
+      return (data) => {
+        s += data;
+        if (!sender) {
+          sender = setTimeout(() => {
+            socket.send(s);
+            s = '';
+            sender = null;
+          }, timeout);
+        }
+      };
+    }
+    // binary message buffering
+    function bufferUtf8(socket, timeout) {
+      let buffer = [];
+      let sender = null;
+      let length = 0;
+      return (data) => {
+        buffer.push(data);
+        length += data.length;
+        if (!sender) {
+          sender = setTimeout(() => {
+            socket.send(Buffer.concat(buffer, length));
+            buffer = [];
+            sender = null;
+            length = 0;
+          }, timeout);
+        }
+      };
+    }
+    const send = USE_BINARY_UTF8 ? bufferUtf8(ws, 5) : buffer(ws, 5);
+
+    term.on('data', function(data) {
+      try {
+        send(data);
+      } catch (ex) {
+        // The WebSocket is not open, ignore
+      }
+    });
+    ws.on('message', function(msg) {
+      term.write(msg);
+    });
+    ws.on('close', function () {
+      term.kill();
+      console.log('Closed terminal ' + term.pid);
+      // Clean things up
+      delete terminals[term.pid];
+      delete logs[term.pid];
+    });
+  });
+
+  var port = process.env.PORT || 3000,
+      host = os.platform() === 'win32' ? '127.0.0.1' : '0.0.0.0';
+
+  console.log('App listening to http://127.0.0.1:' + port);
+  app.listen(port, host);
+}
+
+module.exports = startServer;

demo/start.js

@@ -0,0 +1,55 @@
+/**
+ * Copyright (c) 2018 The xterm.js authors. All rights reserved.
+ * @license MIT
+ *
+ * This file is the entry point for browserify.
+ */
+
+const path = require('path');
+const webpack = require('webpack');
+const startServer = require('./server.js');
+
+startServer();
+
+// Build/watch client source
+const clientConfig = {
+  entry: path.resolve(__dirname, 'client.ts'),
+  devtool: 'inline-source-map',
+  module: {
+    rules: [
+      {
+        test: /\.tsx?$/,
+        use: 'ts-loader',
+        exclude: /node_modules/
+      },
+      {
+        test: /\.js$/,
+        use: ["source-map-loader"],
+        enforce: "pre",
+        exclude: /node_modules/
+      }
+    ]
+  },
+  resolve: {
+    modules: [path.resolve(__dirname, '..'), 'node_modules'],
+    extensions: [ '.tsx', '.ts', '.js' ]
+  },
+  output: {
+    filename: 'client-bundle.js',
+    path: path.resolve(__dirname, 'dist')
+  },
+  mode: 'development',
+  watch: true
+};
+const compiler = webpack(clientConfig);
+
+compiler.watch({
+  // Example watchOptions
+  aggregateTimeout: 300,
+  poll: undefined
+}, (err, stats) => {
+  // Print watch/build result here...
+  console.log(stats.toString({
+    colors: true
+  }));
+});

demo/style.css

@@ -14,3 +14,19 @@ h1 {
     margin: 0 auto;
     padding: 2px;
 }
+
+p {
+    font-size: 0.9em;
+    font-style: italic
+}
+
+#option-container {
+    display: flex;
+    justify-content: center;
+}
+
+.option-group {
+    display: inline-block;
+    padding-left: 20px;
+    vertical-align: top;
+}

demo/test.html

@@ -0,0 +1,12 @@
+<!doctype html>
+<html>
+  <head>
+    <title>xterm.js integration test fixture</title>
+    <link rel="stylesheet" href="/src/xterm.css" />
+    <link rel="stylesheet" href="style.css" />
+  </head>
+  <body>
+    <div id="terminal-container"></div>
+    <script src="dist/client-bundle.js" defer ></script>
+  </body>
+</html>

demo/tsconfig.json

@@ -0,0 +1,12 @@
+{
+  "compilerOptions": {
+    "module": "commonjs",
+    "target": "es5",
+    "rootDir": ".",
+    "sourceMap": true
+  },
+  "include": [
+    "client.ts",
+    "../typings/xterm.d.ts"
+  ]
+}

docker-compose.yml

@@ -2,8 +2,16 @@ version: "3"
 
 services:
   web:
+    image: xtermjs/xterm.js:latest
     build: .
     volumes:
       - ./:/usr/src/app
     ports:
-      - ${XTERMJS_PORT:3000}:3000
+      - ${XTERMJS_PORT:-3000}:3000
+    command: ["npm", "start"]
+
+  watch:
+    build: .
+    volumes:
+      - ./:/usr/src/app
+    command: ["npm", "run", "watch"]

fixtures/typings-test/tsconfig.json

@@ -4,6 +4,11 @@
   ],
   "compilerOptions": {
     "module": "commonjs",
-    "target": "es5"
+    "target": "es5",
+    "lib": [
+      "dom",
+      "es6"
+    ],
+    "noEmit": true
   }
 }

fixtures/typings-test/typings-test.ts

@@ -4,7 +4,7 @@
 
 /// <reference path="../../typings/xterm.d.ts" />
 
-import { Terminal } from 'xterm';
+import { Terminal, IDisposable } from 'xterm';
 
 namespace constructor {
   {
@@ -21,7 +21,7 @@ namespace constructor {
       'disableStdin': false,
       'rows': 1,
       'scrollback': 10,
-      'tabStopWidth': 2,
+      'tabStopWidth': 2
     });
   }
 }
@@ -119,6 +119,12 @@ namespace methods_core {
     const t: Terminal = new Terminal();
     t.attachCustomKeyEventHandler((e: KeyboardEvent) => true);
     t.attachCustomKeyEventHandler((e: KeyboardEvent) => false);
+    const d1: IDisposable = t.addCsiHandler('x',
+       (params: number[], collect: string): boolean => params[0] === 1);
+    d1.dispose();
+    const d2: IDisposable = t.addOscHandler(199,
+       (data: string): boolean => true);
+    d2.dispose();
   }
   namespace options {
     {
@@ -144,6 +150,12 @@ namespace methods_core {
       const r20: string = t.getOption('bellStyle');
       const r21: boolean = t.getOption('enableBold');
       const r22: number = t.getOption('letterSpacing');
+      const r23: boolean = t.getOption('macOptionIsMeta');
+      const r24: string = t.getOption('fontWeight');
+      const r25: string = t.getOption('fontWeightBold');
+      const r26: boolean = t.getOption('allowTransparency');
+      const r27: boolean = t.getOption('rightClickSelectsWord');
+      const r28: boolean = t.getOption('windowsMode');
     }
     {
       const t: Terminal = new Terminal();
@@ -157,10 +169,16 @@ namespace methods_core {
       t.setOption('debug', true);
       t.setOption('disableStdin', true);
       t.setOption('enableBold', true);
+      t.setOption('fontWeight', 'normal');
+      t.setOption('fontWeight', 'bold');
+      t.setOption('fontWeightBold', 'normal');
+      t.setOption('fontWeightBold', 'bold');
       t.setOption('popOnBell', true);
       t.setOption('screenKeys', true);
       t.setOption('useFlowControl', true);
+      t.setOption('allowTransparency', true);
       t.setOption('visualBell', true);
+      t.setOption('windowsMode', true);
       t.setOption('colors', ['a', 'b']);
       t.setOption('letterSpacing', 1);
       t.setOption('cols', 1);
@@ -177,6 +195,8 @@ namespace methods_core {
       t.setOption('lineHeight', 1);
       t.setOption('fontFamily', 'foo');
       t.setOption('theme', {background: '#ff0000'});
+      t.setOption('macOptionIsMeta', true);
+      t.setOption('rightClickSelectsWord', false);
     }
   }
   namespace scrolling {

gulpfile.js

@@ -4,11 +4,9 @@
 
 const browserify = require('browserify');
 const buffer = require('vinyl-buffer');
-const coveralls = require('gulp-coveralls');
 const fs = require('fs-extra');
 const gulp = require('gulp');
 const path = require('path');
-const istanbul = require('gulp-istanbul');
 const merge = require('merge-stream');
 const mocha = require('gulp-mocha');
 const sorcery = require('sorcery');
@@ -16,14 +14,20 @@ const source = require('vinyl-source-stream');
 const sourcemaps = require('gulp-sourcemaps');
 const ts = require('gulp-typescript');
 const util = require('gulp-util');
-const webpack = require('webpack-stream');
 
 const buildDir = process.env.BUILD_DIR || 'build';
-const tsProject = ts.createProject('tsconfig.json');
-const srcDir = tsProject.config.compilerOptions.rootDir;
-let outDir = tsProject.config.compilerOptions.outDir;
+const tsProject = ts.createProject('src/tsconfig.json');
+let srcDir = './src';
+let outDir = './lib';
 
-const addons = ['attach', 'fit', 'fullscreen', 'search', 'terminado', 'winptyCompat', 'zmodem'];
+const addons = fs.readdirSync(`${__dirname}/src/addons`);
+
+const TEST_PATHS = [
+  `${outDir}/*test.js`,
+  `${outDir}/**/*test.js`,
+  `${outDir}/*integration.js`,
+  `${outDir}/**/*integration.js`
+];
 
 // Under some environments like TravisCI, this comes out at absolute which can
 // break the build. This ensures that the outDir is absolute.
@@ -31,53 +35,19 @@ if (path.normalize(outDir).indexOf(__dirname) !== 0) {
   outDir = `${__dirname}/${path.normalize(outDir)}`;
 }
 
-/**
- * Compile TypeScript sources to JavaScript files and create a source map file for each TypeScript
- * file compiled.
- */
-gulp.task('tsc', function () {
-  // Remove the ${outDir}/ directory to prevent confusion if files were deleted in ${srcDir}/
-  fs.emptyDirSync(`${outDir}`);
+gulp.task('css', function() {
+  return gulp.src(`${srcDir}/**/*.css`).pipe(gulp.dest(outDir));
+});
 
-  // Build all TypeScript files (including tests) to ${outDir}/, based on the configuration defined in
-  // `tsconfig.json`.
-  let tsResult = tsProject.src().pipe(sourcemaps.init()).pipe(tsProject());
-  let tsc = merge(
-    tsResult.js.pipe(sourcemaps.write('.', {includeContent: false, sourceRoot: ''})).pipe(gulp.dest(outDir)),
-    tsResult.dts.pipe(sourcemaps.write('.', {includeContent: false, sourceRoot: ''})).pipe(gulp.dest(outDir))
-  );
-
-  let addonStreams = addons.map(function(addon) {
-    fs.emptyDirSync(`${outDir}/addons/${addon}`);
-
-    let tsProjectAddon = ts.createProject(`./src/addons/${addon}/tsconfig.json`);
-    let tsResultAddon = tsProjectAddon.src().pipe(sourcemaps.init()).pipe(tsProjectAddon());
-    let tscAddon = tsResultAddon.js
-      .pipe(sourcemaps.write('.', {includeContent: false, sourceRoot: ''}))
-      .pipe(gulp.dest(`${outDir}/addons/${addon}`));
-
-    return tscAddon;
-  });
-
-  // Copy all addons from ${srcDir}/ to ${outDir}/
-  let copyAddons = gulp.src([
-    `${srcDir}/addons/**/**`
-  ]).pipe(gulp.dest(`${outDir}/addons`));
-
-  // Copy stylesheets from ${srcDir}/ to ${outDir}/
-  let copyStylesheets = gulp.src(`${srcDir}/**/*.css`).pipe(gulp.dest(outDir));
-
-  // Join all streams into a single array
-  let streams = [tsc].concat(addonStreams).concat([copyAddons, copyStylesheets]);
-
-  return merge.apply(this, streams);
+gulp.task('watch-css', function() {
+  return gulp.watch(`${srcDir}/**/*.css`, ['css']);
 });
 
 /**
  * Bundle JavaScript files produced by the `tsc` task, into a single file named `xterm.js` with
  * Browserify.
  */
-gulp.task('browserify', ['tsc'], function() {
+gulp.task('browserify', function() {
   // Ensure that the build directory exists
   fs.ensureDirSync(buildDir);
 
@@ -91,7 +61,7 @@ gulp.task('browserify', ['tsc'], function() {
   };
   let bundleStream = browserify(browserifyOptions)
         .bundle()
-        .pipe(source('xterm.js'))
+        .pipe(source(`xterm.js`))
         .pipe(buffer())
         .pipe(sourcemaps.init({loadMaps: true, sourceRoot: '..'}))
         .pipe(sourcemaps.write('./'))
@@ -103,7 +73,7 @@ gulp.task('browserify', ['tsc'], function() {
   return merge(bundleStream, copyStylesheets);
 });
 
-gulp.task('browserify-addons', ['tsc'], function() {
+gulp.task('browserify-addons', function() {
   const bundles = addons.map((addon) => {
     const addonOptions = {
       basedir: `${buildDir}/addons/${addon}`,
@@ -129,37 +99,22 @@ gulp.task('browserify-addons', ['tsc'], function() {
   return merge(...bundles);
 });
 
-gulp.task('instrument-test', function () {
-  return gulp.src([`${outDir}/**/*.js`])
-    // Covering files
-    .pipe(istanbul())
-    // Force `require` to return covered files
-    .pipe(istanbul.hookRequire());
-});
-
-gulp.task('mocha', ['instrument-test'], function () {
-  return gulp.src([
-    `${outDir}/*test.js`,
-    `${outDir}/**/*test.js`,
-    `${outDir}/*integration.js`,
-    `${outDir}/**/*integration.js`
-  ], {read: false})
+gulp.task('mocha', function () {
+  return gulp.src(TEST_PATHS, {read: false})
       .pipe(mocha())
-      .once('error', () => process.exit(1))
-      .pipe(istanbul.writeReports());
+      .once('error', () => process.exit(1));
 });
 
 /**
- * Run single test file by file name(without file extension). Example of the command:
- * gulp mocha-test --test InputHandler.test
+ * Run single test suite (file) by file name (without file extension). Example of the command:
+ * gulp mocha-suite --test InputHandler.test
  */
-gulp.task('mocha-test', ['instrument-test'], function () {
+gulp.task('mocha-suite', [], function () {
   let testName = util.env.test;
   util.log("Run test by Name: " + testName);
   return gulp.src([`${outDir}/${testName}.js`, `${outDir}/**/${testName}.js`], {read: false})
          .pipe(mocha())
-         .once('error', () => process.exit(1))
-         .pipe(istanbul.writeReports());
+         .once('error', () => process.exit(1));
 });
 
 /**
@@ -181,20 +136,6 @@ gulp.task('sorcery-addons', ['browserify-addons'], function () {
   })
 });
 
-gulp.task('webpack', ['build'], function() {
-  return gulp.src('demo/main.js')
-    .pipe(webpack(require('./webpack.config.js')))
-    .pipe(gulp.dest('demo/dist/'));
-});
-
-/**
- * Submit coverage results to coveralls.io
- */
-gulp.task('coveralls', function () {
-  gulp.src('coverage/**/lcov.info')
-    .pipe(coveralls());
-});
-
-gulp.task('build', ['sorcery', 'sorcery-addons']);
+gulp.task('build', ['css', 'sorcery', 'sorcery-addons']);
 gulp.task('test', ['mocha']);
 gulp.task('default', ['build']);

jsdoc.json

@@ -1,26 +0,0 @@
-{
-  "source": {
-    "include": [
-      "src/"
-    ],
-    "exclude": [
-      "src/test/"
-    ],
-    "excludePattern": "src/.+\\.test\\.(js|ts)$"
-  },
-  "opts": {
-    "readme": "README.md",
-    "template": "node_modules/docdash",
-    "encoding": "utf8",
-    "destination": "docs/",
-    "recurse": true,
-    "verbose": true
-  },
-  "plugins": [
-    "plugins/markdown"
-  ],
-  "templates": {
-    "cleverLinks": false,
-    "monospaceLinks": false
-  }
-}

package.json

@@ -1,52 +1,23 @@
 {
   "name": "xterm",
   "description": "Full xterm terminal, in your browser",
-  "version": "3.0.2",
-  "ignore": [
-    "demo",
-    "test",
-    ".gitignore"
-  ],
-  "main": "lib/Terminal.js",
+  "version": "3.14.0",
+  "main": "lib/public/Terminal.js",
   "types": "typings/xterm.d.ts",
-  "repository": "https://github.com/sourcelair/xterm.js",
+  "repository": "https://github.com/xtermjs/xterm.js",
   "license": "MIT",
-  "files": [
-    "*.js",
-    "*.json",
-    "dist/*.css",
-    "dist/**/*.css",
-    "dist/*.js",
-    "dist/*.js.map",
-    "dist/**/*.js",
-    "dist/**/*.js.map",
-    "lib/*.css",
-    "lib/**/*.css",
-    "lib/*.d.ts",
-    "lib/*.js",
-    "lib/*.js.map",
-    "lib/**/*.d.ts",
-    "lib/**/*.js",
-    "lib/**/*.js.map",
-    "src/*.css",
-    "src/**/*.css",
-    "src/*.js",
-    "src/*.js.map",
-    "src/*.ts",
-    "src/**/*.js",
-    "src/**/*.js.map",
-    "src/**/*.ts",
-    "typings/*.d.ts"
-  ],
   "devDependencies": {
     "@types/chai": "^3.4.34",
-    "@types/jsdom": "^11.0.1",
+    "@types/glob": "^5.0.35",
+    "@types/jsdom": "11.0.1",
     "@types/mocha": "^2.2.33",
-    "@types/node": "^6.0.41",
-    "@types/text-encoding": "0.0.32",
+    "@types/node": "6.0.108",
+    "@types/puppeteer": "^1.12.4",
+    "@types/utf8": "^2.1.6",
+    "@types/webpack": "^4.4.11",
     "browserify": "^13.3.0",
     "chai": "3.5.0",
-    "docdash": "0.4.0",
+    "coveralls": "^3.0.1",
     "express": "4.13.4",
     "express-ws": "2.0.0-rc.1",
     "fs-extra": "^1.0.0",
@@ -54,38 +25,49 @@
     "gulp": "3.9.1",
     "gulp-cli": "^1.2.2",
     "gulp-concat": "^2.6.1",
-    "gulp-coveralls": "^0.1.4",
-    "gulp-istanbul": "^1.1.1",
     "gulp-mocha": "^3.0.1",
     "gulp-sourcemaps": "1.9.1",
     "gulp-typescript": "^3.1.3",
     "gulp-util": "3.0.8",
-    "jsdoc": "3.4.3",
-    "jsdom": "^11.1.0",
+    "jsdom": "^11.11.0",
     "merge-stream": "^1.0.1",
-    "node-pty": "^0.7.2",
+    "node-pty": "0.7.6",
     "nodemon": "1.10.2",
+    "nyc": "^11.8.0",
+    "puppeteer": "^1.15.0",
     "sorcery": "^0.10.0",
-    "tslint": "^4.0.2",
-    "typescript": "~2.4.0",
+    "source-map-loader": "^0.2.4",
+    "ts-loader": "^4.5.0",
+    "tslint": "^5.9.1",
+    "tslint-consistent-codestyle": "^1.13.0",
+    "typescript": "3.5",
+    "utf8": "^3.0.0",
     "vinyl-buffer": "^1.0.0",
     "vinyl-source-stream": "^1.1.0",
-    "webpack": "^3.10.0",
-    "webpack-stream": "^4.0.0",
+    "webpack": "^4.17.1",
+    "webpack-cli": "^3.1.0",
+    "xterm-addon-attach": "0.1.0-beta8",
+    "xterm-addon-search": "0.1.0-beta4",
+    "xterm-addon-web-links": "0.1.0-beta6",
     "zmodem.js": "^0.1.5"
   },
   "scripts": {
-    "prestart": "gulp webpack",
-    "start": "node demo/app",
-    "prestart-zmodem": "npm run build",
-    "start-zmodem": "node build/addons/zmodem/demo/app",
-    "lint": "tslint src/*.ts src/**/*.ts",
-    "test": "gulp test",
-    "build:docs": "jsdoc -c jsdoc.json",
+    "start": "node demo/start",
+    "start-debug": "node --inspect-brk demo/start",
+    "start-zmodem": "node demo/zmodem/app",
+    "lint": "tslint 'src/**/*.ts' './demo/**/*.ts'",
+    "test": "npm run mocha",
+    "posttest": "npm run lint",
+    "test-debug": "node --inspect-brk node_modules/.bin/gulp test",
+    "test-suite": "gulp mocha-suite --test",
+    "test-coverage": "nyc -x gulpfile.js -x '**/*test*' npm run mocha",
+    "test-api": "mocha \"**/*.api.js\"",
+    "mocha": "gulp test",
+    "prebuild": "tsc -b ./src/tsconfig.all.json",
     "build": "gulp build",
-    "prepublish": "npm run build",
-    "coveralls": "gulp coveralls",
-    "webpack": "gulp webpack"
-  },
-  "dependencies": {}
+    "prepare": "npm run prebuild",
+    "prepublishOnly": "npm run build",
+    "coveralls": "nyc report --reporter=text-lcov | coveralls",
+    "watch": "tsc -b -w ./src/tsconfig.all.json --preserveWatchOutput"
+  }
 }

src/AccessibilityManager.ts

@@ -0,0 +1,296 @@
+/**
+ * Copyright (c) 2017 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+import * as Strings from './Strings';
+import { ITerminal, IBuffer } from './Types';
+import { isMac } from './common/Platform';
+import { RenderDebouncer } from './ui/RenderDebouncer';
+import { addDisposableDomListener } from './ui/Lifecycle';
+import { Disposable } from './common/Lifecycle';
+import { ScreenDprMonitor } from './ui/ScreenDprMonitor';
+import { IRenderDimensions } from './renderer/Types';
+
+const MAX_ROWS_TO_READ = 20;
+
+const enum BoundaryPosition {
+  TOP,
+  BOTTOM
+}
+
+export class AccessibilityManager extends Disposable {
+  private _accessibilityTreeRoot: HTMLElement;
+  private _rowContainer: HTMLElement;
+  private _rowElements: HTMLElement[];
+  private _liveRegion: HTMLElement;
+  private _liveRegionLineCount: number = 0;
+
+  private _renderRowsDebouncer: RenderDebouncer;
+  private _screenDprMonitor: ScreenDprMonitor;
+
+  private _topBoundaryFocusListener: (e: FocusEvent) => void;
+  private _bottomBoundaryFocusListener: (e: FocusEvent) => void;
+
+  /**
+   * This queue has a character pushed to it for keys that are pressed, if the
+   * next character added to the terminal is equal to the key char then it is
+   * not announced (added to live region) because it has already been announced
+   * by the textarea event (which cannot be canceled). There are some race
+   * condition cases if there is typing while data is streaming, but this covers
+   * the main case of typing into the prompt and inputting the answer to a
+   * question (Y/N, etc.).
+   */
+  private _charsToConsume: string[] = [];
+
+  private _charsToAnnounce: string = '';
+
+  constructor(
+    private _terminal: ITerminal,
+    private _dimensions: IRenderDimensions
+  ) {
+    super();
+    this._accessibilityTreeRoot = document.createElement('div');
+    this._accessibilityTreeRoot.classList.add('xterm-accessibility');
+
+    this._rowContainer = document.createElement('div');
+    this._rowContainer.classList.add('xterm-accessibility-tree');
+    this._rowElements = [];
+    for (let i = 0; i < this._terminal.rows; i++) {
+      this._rowElements[i] = this._createAccessibilityTreeNode();
+      this._rowContainer.appendChild(this._rowElements[i]);
+    }
+
+    this._topBoundaryFocusListener = e => this._onBoundaryFocus(e, BoundaryPosition.TOP);
+    this._bottomBoundaryFocusListener = e => this._onBoundaryFocus(e, BoundaryPosition.BOTTOM);
+    this._rowElements[0].addEventListener('focus', this._topBoundaryFocusListener);
+    this._rowElements[this._rowElements.length - 1].addEventListener('focus', this._bottomBoundaryFocusListener);
+
+    this._refreshRowsDimensions();
+    this._accessibilityTreeRoot.appendChild(this._rowContainer);
+
+    this._renderRowsDebouncer = new RenderDebouncer(this._renderRows.bind(this));
+    this._refreshRows();
+
+    this._liveRegion = document.createElement('div');
+    this._liveRegion.classList.add('live-region');
+    this._liveRegion.setAttribute('aria-live', 'assertive');
+    this._accessibilityTreeRoot.appendChild(this._liveRegion);
+
+    this._terminal.element.insertAdjacentElement('afterbegin', this._accessibilityTreeRoot);
+
+    this.register(this._renderRowsDebouncer);
+    this.register(this._terminal.onResize(e => this._onResize(e.rows)));
+    this.register(this._terminal.onRender(e => this._refreshRows(e.start, e.end)));
+    this.register(this._terminal.onScroll(() => this._refreshRows()));
+    // Line feed is an issue as the prompt won't be read out after a command is run
+    this.register(this._terminal.addDisposableListener('a11y.char', (char) => this._onChar(char)));
+    this.register(this._terminal.onLineFeed(() => this._onChar('\n')));
+    this.register(this._terminal.addDisposableListener('a11y.tab', spaceCount => this._onTab(spaceCount)));
+    this.register(this._terminal.onKey(e => this._onKey(e.key)));
+    this.register(this._terminal.addDisposableListener('blur', () => this._clearLiveRegion()));
+
+    this._screenDprMonitor = new ScreenDprMonitor();
+    this.register(this._screenDprMonitor);
+    this._screenDprMonitor.setListener(() => this._refreshRowsDimensions());
+    // This shouldn't be needed on modern browsers but is present in case the
+    // media query that drives the ScreenDprMonitor isn't supported
+    this.register(addDisposableDomListener(window, 'resize', () => this._refreshRowsDimensions()));
+  }
+
+  public dispose(): void {
+    super.dispose();
+    this._terminal.element.removeChild(this._accessibilityTreeRoot);
+    this._rowElements.length = 0;
+  }
+
+  private _onBoundaryFocus(e: FocusEvent, position: BoundaryPosition): void {
+    const boundaryElement = <HTMLElement>e.target;
+    const beforeBoundaryElement = this._rowElements[position === BoundaryPosition.TOP ? 1 : this._rowElements.length - 2];
+
+    // Don't scroll if the buffer top has reached the end in that direction
+    const posInSet = boundaryElement.getAttribute('aria-posinset');
+    const lastRowPos = position === BoundaryPosition.TOP ? '1' : `${this._terminal.buffer.lines.length}`;
+    if (posInSet === lastRowPos) {
+      return;
+    }
+
+    // Don't scroll when the last focused item was not the second row (focus is going the other
+    // direction)
+    if (e.relatedTarget !== beforeBoundaryElement) {
+      return;
+    }
+
+    // Remove old boundary element from array
+    let topBoundaryElement: HTMLElement;
+    let bottomBoundaryElement: HTMLElement;
+    if (position === BoundaryPosition.TOP) {
+      topBoundaryElement = boundaryElement;
+      bottomBoundaryElement = this._rowElements.pop()!;
+      this._rowContainer.removeChild(bottomBoundaryElement);
+    } else {
+      topBoundaryElement = this._rowElements.shift()!;
+      bottomBoundaryElement = boundaryElement;
+      this._rowContainer.removeChild(topBoundaryElement);
+    }
+
+    // Remove listeners from old boundary elements
+    topBoundaryElement.removeEventListener('focus', this._topBoundaryFocusListener);
+    bottomBoundaryElement.removeEventListener('focus', this._bottomBoundaryFocusListener);
+
+    // Add new element to array/DOM
+    if (position === BoundaryPosition.TOP) {
+      const newElement = this._createAccessibilityTreeNode();
+      this._rowElements.unshift(newElement);
+      this._rowContainer.insertAdjacentElement('afterbegin', newElement);
+    } else {
+      const newElement = this._createAccessibilityTreeNode();
+      this._rowElements.push(newElement);
+      this._rowContainer.appendChild(newElement);
+    }
+
+    // Add listeners to new boundary elements
+    this._rowElements[0].addEventListener('focus', this._topBoundaryFocusListener);
+    this._rowElements[this._rowElements.length - 1].addEventListener('focus', this._bottomBoundaryFocusListener);
+
+    // Scroll up
+    this._terminal.scrollLines(position === BoundaryPosition.TOP ? -1 : 1);
+
+    // Focus new boundary before element
+    this._rowElements[position === BoundaryPosition.TOP ? 1 : this._rowElements.length - 2].focus();
+
+    // Prevent the standard behavior
+    e.preventDefault();
+    e.stopImmediatePropagation();
+  }
+
+  private _onResize(rows: number): void {
+    // Remove bottom boundary listener
+    this._rowElements[this._rowElements.length - 1].removeEventListener('focus', this._bottomBoundaryFocusListener);
+
+    // Grow rows as required
+    for (let i = this._rowContainer.children.length; i < this._terminal.rows; i++) {
+      this._rowElements[i] = this._createAccessibilityTreeNode();
+      this._rowContainer.appendChild(this._rowElements[i]);
+    }
+    // Shrink rows as required
+    while (this._rowElements.length > rows) {
+      this._rowContainer.removeChild(this._rowElements.pop()!);
+    }
+
+    // Add bottom boundary listener
+    this._rowElements[this._rowElements.length - 1].addEventListener('focus', this._bottomBoundaryFocusListener);
+
+    this._refreshRowsDimensions();
+  }
+
+  private _createAccessibilityTreeNode(): HTMLElement {
+    const element = document.createElement('div');
+    element.setAttribute('role', 'listitem');
+    element.tabIndex = -1;
+    this._refreshRowDimensions(element);
+    return element;
+  }
+
+  private _onTab(spaceCount: number): void {
+    for (let i = 0; i < spaceCount; i++) {
+      this._onChar(' ');
+    }
+  }
+
+  private _onChar(char: string): void {
+    if (this._liveRegionLineCount < MAX_ROWS_TO_READ + 1) {
+      if (this._charsToConsume.length > 0) {
+        // Have the screen reader ignore the char if it was just input
+        const shiftedChar = this._charsToConsume.shift();
+        if (shiftedChar !== char) {
+          this._charsToAnnounce += char;
+        }
+      } else {
+        this._charsToAnnounce += char;
+      }
+
+      if (char === '\n') {
+        this._liveRegionLineCount++;
+        if (this._liveRegionLineCount === MAX_ROWS_TO_READ + 1) {
+          this._liveRegion.textContent += Strings.tooMuchOutput;
+        }
+      }
+
+      // Only detach/attach on mac as otherwise messages can go unaccounced
+      if (isMac) {
+        if (this._liveRegion.textContent && this._liveRegion.textContent.length > 0 && !this._liveRegion.parentNode) {
+          setTimeout(() => {
+            this._accessibilityTreeRoot.appendChild(this._liveRegion);
+          }, 0);
+        }
+      }
+    }
+  }
+
+  private _clearLiveRegion(): void {
+    this._liveRegion.textContent = '';
+    this._liveRegionLineCount = 0;
+
+    // Only detach/attach on mac as otherwise messages can go unaccounced
+    if (isMac) {
+      if (this._liveRegion.parentNode) {
+        this._accessibilityTreeRoot.removeChild(this._liveRegion);
+      }
+    }
+  }
+
+  private _onKey(keyChar: string): void {
+    this._clearLiveRegion();
+    this._charsToConsume.push(keyChar);
+  }
+
+  private _refreshRows(start?: number, end?: number): void {
+    this._renderRowsDebouncer.refresh(start, end, this._terminal.rows);
+  }
+
+  private _renderRows(start: number, end: number): void {
+    const buffer: IBuffer = this._terminal.buffer;
+    const setSize = buffer.lines.length.toString();
+    for (let i = start; i <= end; i++) {
+      const lineData = buffer.translateBufferLineToString(buffer.ydisp + i, true);
+      const posInSet = (buffer.ydisp + i + 1).toString();
+      const element = this._rowElements[i];
+      if (element) {
+        element.textContent = lineData.length === 0 ? Strings.blankLine : lineData;
+        element.setAttribute('aria-posinset', posInSet);
+        element.setAttribute('aria-setsize', setSize);
+      }
+    }
+    this._announceCharacters();
+  }
+
+  private _refreshRowsDimensions(): void {
+    if (!this._dimensions.actualCellHeight) {
+      return;
+    }
+    if (this._rowElements.length !== this._terminal.rows) {
+      this._onResize(this._terminal.rows);
+    }
+    for (let i = 0; i < this._terminal.rows; i++) {
+      this._refreshRowDimensions(this._rowElements[i]);
+    }
+  }
+
+  public setDimensions(dimensions: IRenderDimensions): void {
+    this._dimensions = dimensions;
+    this._refreshRowsDimensions();
+  }
+
+  private _refreshRowDimensions(element: HTMLElement): void {
+    element.style.height = `${this._dimensions.actualCellHeight}px`;
+  }
+
+  private _announceCharacters(): void {
+    if (this._charsToAnnounce.length === 0) {
+      return;
+    }
+    this._liveRegion.textContent += this._charsToAnnounce;
+    this._charsToAnnounce = '';
+  }
+}

src/Buffer.ts

@@ -3,14 +3,13 @@
  * @license MIT
  */
 
-import { ITerminal, IBuffer } from './Interfaces';
-import { CircularList } from './utils/CircularList';
-import { LineData, CharData } from './Types';
+import { CircularList, IInsertEvent } from './common/CircularList';
+import { ITerminal, IBuffer, BufferIndex, IBufferStringIterator, IBufferStringIteratorResult } from './Types';
+import { IBufferLine, ICellData, IAttributeData } from './core/Types';
+import { BufferLine, CellData, NULL_CELL_CHAR, NULL_CELL_WIDTH, NULL_CELL_CODE, WHITESPACE_CELL_CHAR, WHITESPACE_CELL_WIDTH, WHITESPACE_CELL_CODE, CHAR_DATA_WIDTH_INDEX, CHAR_DATA_CHAR_INDEX, DEFAULT_ATTR_DATA } from './core/buffer/BufferLine';
+import { reflowLargerApplyNewLayout, reflowLargerCreateNewLayout, reflowLargerGetLinesToRemove, reflowSmallerGetNewLineLengths, getWrappedLineTrimmedLength } from './core/buffer/BufferReflow';
+import { Marker } from './core/buffer/Marker';
 
-export const CHAR_DATA_ATTR_INDEX = 0;
-export const CHAR_DATA_CHAR_INDEX = 1;
-export const CHAR_DATA_WIDTH_INDEX = 2;
-export const CHAR_DATA_CODE_INDEX = 3;
 export const MAX_BUFFER_SIZE = 4294967295; // 2^32 - 1
 
 /**
@@ -21,8 +20,7 @@ export const MAX_BUFFER_SIZE = 4294967295; // 2^32 - 1
  *   - scroll position
  */
 export class Buffer implements IBuffer {
-  private _lines: CircularList<LineData>;
-
+  public lines: CircularList<IBufferLine>;
   public ydisp: number;
   public ybase: number;
   public y: number;
@@ -32,6 +30,12 @@ export class Buffer implements IBuffer {
   public tabs: any;
   public savedY: number;
   public savedX: number;
+  public savedCurAttrData = DEFAULT_ATTR_DATA.clone();
+  public markers: Marker[] = [];
+  private _nullCell: ICellData = CellData.fromCharData([0, NULL_CELL_CHAR, NULL_CELL_WIDTH, NULL_CELL_CODE]);
+  private _whitespaceCell: ICellData = CellData.fromCharData([0, WHITESPACE_CELL_CHAR, WHITESPACE_CELL_WIDTH, WHITESPACE_CELL_CODE]);
+  private _cols: number;
+  private _rows: number;
 
   /**
    * Create a new Buffer.
@@ -43,21 +47,45 @@ export class Buffer implements IBuffer {
     private _terminal: ITerminal,
     private _hasScrollback: boolean
   ) {
+    this._cols = this._terminal.cols;
+    this._rows = this._terminal.rows;
     this.clear();
   }
 
-  public get lines(): CircularList<LineData> {
-    return this._lines;
+  public getNullCell(attr?: IAttributeData): ICellData {
+    if (attr) {
+      this._nullCell.fg = attr.fg;
+      this._nullCell.bg = attr.bg;
+    } else {
+      this._nullCell.fg = 0;
+      this._nullCell.bg = 0;
+    }
+    return this._nullCell;
+  }
+
+  public getWhitespaceCell(attr?: IAttributeData): ICellData {
+    if (attr) {
+      this._whitespaceCell.fg = attr.fg;
+      this._whitespaceCell.bg = attr.bg;
+    } else {
+      this._whitespaceCell.fg = 0;
+      this._whitespaceCell.bg = 0;
+    }
+    return this._whitespaceCell;
+  }
+
+  public getBlankLine(attr: IAttributeData, isWrapped?: boolean): IBufferLine {
+    return new BufferLine(this._terminal.cols, this.getNullCell(attr), isWrapped);
   }
 
   public get hasScrollback(): boolean {
-    return this._hasScrollback && this.lines.maxLength > this._terminal.rows;
+    return this._hasScrollback && this.lines.maxLength > this._rows;
   }
 
   public get isCursorInViewport(): boolean {
     const absoluteY = this.ybase + this.y;
     const relativeY = absoluteY - this.ydisp;
-    return (relativeY >= 0 && relativeY < this._terminal.rows);
+    return (relativeY >= 0 && relativeY < this._rows);
   }
 
   /**
@@ -78,11 +106,14 @@ export class Buffer implements IBuffer {
   /**
    * Fills the buffer's viewport with blank lines.
    */
-  public fillViewportRows(): void {
-    if (this._lines.length === 0) {
-      let i = this._terminal.rows;
+  public fillViewportRows(fillAttr?: IAttributeData): void {
+    if (this.lines.length === 0) {
+      if (fillAttr === undefined) {
+        fillAttr = DEFAULT_ATTR_DATA;
+      }
+      let i = this._rows;
       while (i--) {
-        this.lines.push(this._terminal.blankLine());
+        this.lines.push(this.getBlankLine(fillAttr));
       }
     }
   }
@@ -95,9 +126,9 @@ export class Buffer implements IBuffer {
     this.ybase = 0;
     this.y = 0;
     this.x = 0;
-    this._lines = new CircularList<LineData>(this._getCorrectBufferLength(this._terminal.rows));
+    this.lines = new CircularList<IBufferLine>(this._getCorrectBufferLength(this._rows));
     this.scrollTop = 0;
-    this.scrollBottom = this._terminal.rows - 1;
+    this.scrollBottom = this._rows - 1;
     this.setupTabStops();
   }
 
@@ -107,37 +138,32 @@ export class Buffer implements IBuffer {
    * @param newRows The new number of rows.
    */
   public resize(newCols: number, newRows: number): void {
+    // store reference to null cell with default attrs
+    const nullCell = this.getNullCell(DEFAULT_ATTR_DATA);
+
     // Increase max length if needed before adjustments to allow space to fill
     // as required.
     const newMaxLength = this._getCorrectBufferLength(newRows);
-    if (newMaxLength > this._lines.maxLength) {
-      this._lines.maxLength = newMaxLength;
+    if (newMaxLength > this.lines.maxLength) {
+      this.lines.maxLength = newMaxLength;
     }
 
     // The following adjustments should only happen if the buffer has been
     // initialized/filled.
-    if (this._lines.length > 0) {
-      // Deal with columns increasing (we don't do anything when columns reduce)
-      if (this._terminal.cols < newCols) {
-        const ch: CharData = [this._terminal.defAttr, ' ', 1, 32]; // does xterm use the default attr?
-        for (let i = 0; i < this._lines.length; i++) {
-          // TODO: This should be removed, with tests setup for the case that was
-          // causing the underlying bug, see https://github.com/sourcelair/xterm.js/issues/824
-          if (this._lines.get(i) === undefined) {
-            this._lines.set(i, this._terminal.blankLine(undefined, undefined, newCols));
-          }
-          while (this._lines.get(i).length < newCols) {
-            this._lines.get(i).push(ch);
-          }
+    if (this.lines.length > 0) {
+      // Deal with columns increasing (reducing needs to happen after reflow)
+      if (this._cols < newCols) {
+        for (let i = 0; i < this.lines.length; i++) {
+          this.lines.get(i).resize(newCols, nullCell);
         }
       }
 
       // Resize rows in both directions as needed
       let addToY = 0;
-      if (this._terminal.rows < newRows) {
-        for (let y = this._terminal.rows; y < newRows; y++) {
-          if (this._lines.length < newRows + this.ybase) {
-            if (this.ybase > 0 && this._lines.length <= this.ybase + this.y + addToY + 1) {
+      if (this._rows < newRows) {
+        for (let y = this._rows; y < newRows; y++) {
+          if (this.lines.length < newRows + this.ybase) {
+            if (this.ybase > 0 && this.lines.length <= this.ybase + this.y + addToY + 1) {
               // There is room above the buffer and there are no empty elements below the line,
               // scroll up
               this.ybase--;
@@ -149,16 +175,16 @@ export class Buffer implements IBuffer {
             } else {
               // Add a blank line if there is no buffer left at the top to scroll to, or if there
               // are blank lines after the cursor
-              this._lines.push(this._terminal.blankLine(undefined, undefined, newCols));
+              this.lines.push(new BufferLine(newCols, nullCell));
             }
           }
         }
-      } else { // (this._terminal.rows >= newRows)
-        for (let y = this._terminal.rows; y > newRows; y--) {
-          if (this._lines.length > newRows + this.ybase) {
-            if (this._lines.length > this.ybase + this.y + 1) {
+      } else { // (this._rows >= newRows)
+        for (let y = this._rows; y > newRows; y--) {
+          if (this.lines.length > newRows + this.ybase) {
+            if (this.lines.length > this.ybase + this.y + 1) {
               // The line is a blank line below the cursor, remove it
-              this._lines.pop();
+              this.lines.pop();
             } else {
               // The line is the cursor, scroll down
               this.ybase++;
@@ -170,33 +196,295 @@ export class Buffer implements IBuffer {
 
       // Reduce max length if needed after adjustments, this is done after as it
       // would otherwise cut data from the bottom of the buffer.
-      if (newMaxLength < this._lines.maxLength) {
+      if (newMaxLength < this.lines.maxLength) {
         // Trim from the top of the buffer and adjust ybase and ydisp.
-        const amountToTrim = this._lines.length - newMaxLength;
+        const amountToTrim = this.lines.length - newMaxLength;
         if (amountToTrim > 0) {
-          this._lines.trimStart(amountToTrim);
+          this.lines.trimStart(amountToTrim);
           this.ybase = Math.max(this.ybase - amountToTrim, 0);
           this.ydisp = Math.max(this.ydisp - amountToTrim, 0);
         }
-        this._lines.maxLength = newMaxLength;
+        this.lines.maxLength = newMaxLength;
       }
 
       // Make sure that the cursor stays on screen
-      if (this.y >= newRows) {
-        this.y = newRows - 1;
-      }
+      this.x = Math.min(this.x, newCols - 1);
+      this.y = Math.min(this.y, newRows - 1);
       if (addToY) {
         this.y += addToY;
       }
-
-      if (this.x >= newCols) {
-        this.x = newCols - 1;
-      }
+      this.savedY = Math.min(this.savedY, newRows - 1);
+      this.savedX = Math.min(this.savedX, newCols - 1);
 
       this.scrollTop = 0;
     }
 
     this.scrollBottom = newRows - 1;
+
+    if (this._isReflowEnabled) {
+      this._reflow(newCols, newRows);
+
+      // Trim the end of the line off if cols shrunk
+      if (this._cols > newCols) {
+        for (let i = 0; i < this.lines.length; i++) {
+          this.lines.get(i).resize(newCols, nullCell);
+        }
+      }
+    }
+
+    this._cols = newCols;
+    this._rows = newRows;
+  }
+
+  private get _isReflowEnabled(): boolean {
+    return this._hasScrollback && !this._terminal.options.windowsMode;
+  }
+
+  private _reflow(newCols: number, newRows: number): void {
+    if (this._cols === newCols) {
+      return;
+    }
+
+    // Iterate through rows, ignore the last one as it cannot be wrapped
+    if (newCols > this._cols) {
+      this._reflowLarger(newCols, newRows);
+    } else {
+      this._reflowSmaller(newCols, newRows);
+    }
+  }
+
+  private _reflowLarger(newCols: number, newRows: number): void {
+    const toRemove: number[] = reflowLargerGetLinesToRemove(this.lines, this._cols, newCols, this.ybase + this.y, this.getNullCell(DEFAULT_ATTR_DATA));
+    if (toRemove.length > 0) {
+      const newLayoutResult = reflowLargerCreateNewLayout(this.lines, toRemove);
+      reflowLargerApplyNewLayout(this.lines, newLayoutResult.layout);
+      this._reflowLargerAdjustViewport(newCols, newRows, newLayoutResult.countRemoved);
+    }
+  }
+
+  private _reflowLargerAdjustViewport(newCols: number, newRows: number, countRemoved: number): void {
+    const nullCell = this.getNullCell(DEFAULT_ATTR_DATA);
+    // Adjust viewport based on number of items removed
+    let viewportAdjustments = countRemoved;
+    while (viewportAdjustments-- > 0) {
+      if (this.ybase === 0) {
+        if (this.y > 0) {
+          this.y--;
+        }
+        if (this.lines.length < newRows) {
+          // Add an extra row at the bottom of the viewport
+          this.lines.push(new BufferLine(newCols, nullCell));
+        }
+      } else {
+        if (this.ydisp === this.ybase) {
+          this.ydisp--;
+        }
+        this.ybase--;
+      }
+    }
+  }
+
+  private _reflowSmaller(newCols: number, newRows: number): void {
+    const nullCell = this.getNullCell(DEFAULT_ATTR_DATA);
+    // Gather all BufferLines that need to be inserted into the Buffer here so that they can be
+    // batched up and only committed once
+    const toInsert = [];
+    let countToInsert = 0;
+    // Go backwards as many lines may be trimmed and this will avoid considering them
+    for (let y = this.lines.length - 1; y >= 0; y--) {
+      // Check whether this line is a problem
+      let nextLine = this.lines.get(y) as BufferLine;
+      if (!nextLine || !nextLine.isWrapped && nextLine.getTrimmedLength() <= newCols) {
+        continue;
+      }
+
+      // Gather wrapped lines and adjust y to be the starting line
+      const wrappedLines: BufferLine[] = [nextLine];
+      while (nextLine.isWrapped && y > 0) {
+        nextLine = this.lines.get(--y) as BufferLine;
+        wrappedLines.unshift(nextLine);
+      }
+
+      // If these lines contain the cursor don't touch them, the program will handle fixing up
+      // wrapped lines with the cursor
+      const absoluteY = this.ybase + this.y;
+      if (absoluteY >= y && absoluteY < y + wrappedLines.length) {
+        continue;
+      }
+
+      const lastLineLength = wrappedLines[wrappedLines.length - 1].getTrimmedLength();
+      const destLineLengths = reflowSmallerGetNewLineLengths(wrappedLines, this._cols, newCols);
+      const linesToAdd = destLineLengths.length - wrappedLines.length;
+      let trimmedLines: number;
+      if (this.ybase === 0 && this.y !== this.lines.length - 1) {
+        // If the top section of the buffer is not yet filled
+        trimmedLines = Math.max(0, this.y - this.lines.maxLength + linesToAdd);
+      } else {
+        trimmedLines = Math.max(0, this.lines.length - this.lines.maxLength + linesToAdd);
+      }
+
+      // Add the new lines
+      const newLines: BufferLine[] = [];
+      for (let i = 0; i < linesToAdd; i++) {
+        const newLine = this.getBlankLine(DEFAULT_ATTR_DATA, true) as BufferLine;
+        newLines.push(newLine);
+      }
+      if (newLines.length > 0) {
+        toInsert.push({
+          // countToInsert here gets the actual index, taking into account other inserted items.
+          // using this we can iterate through the list forwards
+          start: y + wrappedLines.length + countToInsert,
+          newLines
+        });
+        countToInsert += newLines.length;
+      }
+      wrappedLines.push(...newLines);
+
+      // Copy buffer data to new locations, this needs to happen backwards to do in-place
+      let destLineIndex = destLineLengths.length - 1; // Math.floor(cellsNeeded / newCols);
+      let destCol = destLineLengths[destLineIndex]; // cellsNeeded % newCols;
+      if (destCol === 0) {
+        destLineIndex--;
+        destCol = destLineLengths[destLineIndex];
+      }
+      let srcLineIndex = wrappedLines.length - linesToAdd - 1;
+      let srcCol = lastLineLength;
+      while (srcLineIndex >= 0) {
+        const cellsToCopy = Math.min(srcCol, destCol);
+        wrappedLines[destLineIndex].copyCellsFrom(wrappedLines[srcLineIndex], srcCol - cellsToCopy, destCol - cellsToCopy, cellsToCopy, true);
+        destCol -= cellsToCopy;
+        if (destCol === 0) {
+          destLineIndex--;
+          destCol = destLineLengths[destLineIndex];
+        }
+        srcCol -= cellsToCopy;
+        if (srcCol === 0) {
+          srcLineIndex--;
+          const wrappedLinesIndex = Math.max(srcLineIndex, 0);
+          srcCol = getWrappedLineTrimmedLength(wrappedLines, wrappedLinesIndex, this._cols);
+        }
+      }
+
+      // Null out the end of the line ends if a wide character wrapped to the following line
+      for (let i = 0; i < wrappedLines.length; i++) {
+        if (destLineLengths[i] < newCols) {
+          wrappedLines[i].setCell(destLineLengths[i], nullCell);
+        }
+      }
+
+      // Adjust viewport as needed
+      let viewportAdjustments = linesToAdd - trimmedLines;
+      while (viewportAdjustments-- > 0) {
+        if (this.ybase === 0) {
+          if (this.y < newRows - 1) {
+            this.y++;
+            this.lines.pop();
+          } else {
+            this.ybase++;
+            this.ydisp++;
+          }
+        } else {
+          // Ensure ybase does not exceed its maximum value
+          if (this.ybase < Math.min(this.lines.maxLength, this.lines.length + countToInsert) - newRows) {
+            if (this.ybase === this.ydisp) {
+              this.ydisp++;
+            }
+            this.ybase++;
+          }
+        }
+      }
+    }
+
+    // Rearrange lines in the buffer if there are any insertions, this is done at the end rather
+    // than earlier so that it's a single O(n) pass through the buffer, instead of O(n^2) from many
+    // costly calls to CircularList.splice.
+    if (toInsert.length > 0) {
+      // Record buffer insert events and then play them back backwards so that the indexes are
+      // correct
+      const insertEvents: IInsertEvent[] = [];
+
+      // Record original lines so they don't get overridden when we rearrange the list
+      const originalLines: BufferLine[] = [];
+      for (let i = 0; i < this.lines.length; i++) {
+        originalLines.push(this.lines.get(i) as BufferLine);
+      }
+      const originalLinesLength = this.lines.length;
+
+      let originalLineIndex = originalLinesLength - 1;
+      let nextToInsertIndex = 0;
+      let nextToInsert = toInsert[nextToInsertIndex];
+      this.lines.length = Math.min(this.lines.maxLength, this.lines.length + countToInsert);
+      let countInsertedSoFar = 0;
+      for (let i = Math.min(this.lines.maxLength - 1, originalLinesLength + countToInsert - 1); i >= 0; i--) {
+        if (nextToInsert && nextToInsert.start > originalLineIndex + countInsertedSoFar) {
+          // Insert extra lines here, adjusting i as needed
+          for (let nextI = nextToInsert.newLines.length - 1; nextI >= 0; nextI--) {
+            this.lines.set(i--, nextToInsert.newLines[nextI]);
+          }
+          i++;
+
+          // Create insert events for later
+          insertEvents.push({
+            index: originalLineIndex + 1,
+            amount: nextToInsert.newLines.length
+          });
+
+          countInsertedSoFar += nextToInsert.newLines.length;
+          nextToInsert = toInsert[++nextToInsertIndex];
+        } else {
+          this.lines.set(i, originalLines[originalLineIndex--]);
+        }
+      }
+
+      // Update markers
+      let insertCountEmitted = 0;
+      for (let i = insertEvents.length - 1; i >= 0; i--) {
+        insertEvents[i].index += insertCountEmitted;
+        this.lines.onInsertEmitter.fire(insertEvents[i]);
+        insertCountEmitted += insertEvents[i].amount;
+      }
+      const amountToTrim = Math.max(0, originalLinesLength + countToInsert - this.lines.maxLength);
+      if (amountToTrim > 0) {
+        this.lines.onTrimEmitter.fire(amountToTrim);
+      }
+    }
+  }
+
+  // private _reflowSmallerGetLinesNeeded()
+
+  /**
+   * Translates a string index back to a BufferIndex.
+   * To get the correct buffer position the string must start at `startCol` 0
+   * (default in translateBufferLineToString).
+   * The method also works on wrapped line strings given rows were not trimmed.
+   * The method operates on the CharData string length, there are no
+   * additional content or boundary checks. Therefore the string and the buffer
+   * should not be altered in between.
+   * TODO: respect trim flag after fixing #1685
+   * @param lineIndex line index the string was retrieved from
+   * @param stringIndex index within the string
+   * @param startCol column offset the string was retrieved from
+   */
+  public stringIndexToBufferIndex(lineIndex: number, stringIndex: number, trimRight: boolean = false): BufferIndex {
+    while (stringIndex) {
+      const line = this.lines.get(lineIndex);
+      if (!line) {
+        return [-1, -1];
+      }
+      const length = (trimRight) ? line.getTrimmedLength() : line.length;
+      for (let i = 0; i < length; ++i) {
+        if (line.get(i)[CHAR_DATA_WIDTH_INDEX]) {
+          // empty cells report a string length of 0, but get replaced
+          // with a whitespace in translateToString, thus replace with 1
+          stringIndex -= line.get(i)[CHAR_DATA_CHAR_INDEX].length || 1;
+        }
+        if (stringIndex < 0) {
+          return [lineIndex, i];
+        }
+      }
+      lineIndex++;
+    }
+    return [lineIndex, 0];
   }
 
   /**
@@ -209,62 +497,26 @@ export class Buffer implements IBuffer {
    * @param startCol The column to start at.
    * @param endCol The column to end at.
    */
-  public translateBufferLineToString(lineIndex: number, trimRight: boolean, startCol: number = 0, endCol: number = null): string {
-    // Get full line
-    let lineString = '';
+  public translateBufferLineToString(lineIndex: number, trimRight: boolean, startCol: number = 0, endCol?: number): string {
     const line = this.lines.get(lineIndex);
     if (!line) {
       return '';
     }
+    return line.translateToString(trimRight, startCol, endCol);
+  }
 
-    // Initialize column and index values. Column values represent the actual
-    // cell column, indexes represent the index in the string. Indexes are
-    // needed here because some chars are 0 characters long (eg. after wide
-    // chars) and some chars are longer than 1 characters long (eg. emojis).
-    let startIndex = startCol;
-    endCol = endCol || line.length;
-    let endIndex = endCol;
-
-    for (let i = 0; i < line.length; i++) {
-      const char = line[i];
-      lineString += char[CHAR_DATA_CHAR_INDEX];
-      // Adjust start and end cols for wide characters if they affect their
-      // column indexes
-      if (char[CHAR_DATA_WIDTH_INDEX] === 0) {
-        if (startCol >= i) {
-          startIndex--;
-        }
-        if (endCol >= i) {
-          endIndex--;
-        }
-      } else {
-        // Adjust the columns to take glyphs that are represented by multiple
-        // code points into account.
-        if (char[CHAR_DATA_CHAR_INDEX].length > 1) {
-          if (startCol > i) {
-            startIndex += char[CHAR_DATA_CHAR_INDEX].length - 1;
-          }
-          if (endCol > i) {
-            endIndex += char[CHAR_DATA_CHAR_INDEX].length - 1;
-          }
-        }
-      }
+  public getWrappedRangeForLine(y: number): { first: number, last: number } {
+    let first = y;
+    let last = y;
+    // Scan upwards for wrapped lines
+    while (first > 0 && this.lines.get(first).isWrapped) {
+      first--;
     }
-
-    // Calculate the final end col by trimming whitespace on the right of the
-    // line if needed.
-    if (trimRight) {
-      const rightWhitespaceIndex = lineString.search(/\s+$/);
-      if (rightWhitespaceIndex !== -1) {
-        endIndex = Math.min(endIndex, rightWhitespaceIndex);
-      }
-      // Return the empty string if only trimmed whitespace is selected
-      if (endIndex <= startIndex) {
-        return '';
-      }
+    // Scan downwards for wrapped lines
+    while (last + 1 < this.lines.length && this.lines.get(last + 1).isWrapped) {
+      last++;
     }
-
-    return lineString.substring(startIndex, endIndex);
+    return { first, last };
   }
 
   /**
@@ -272,7 +524,7 @@ export class Buffer implements IBuffer {
    * @param i The index to start setting up tab stops from.
    */
   public setupTabStops(i?: number): void {
-    if (i != null) {
+    if (i !== null && i !== undefined) {
       if (!this.tabs[i]) {
         i = this.prevStop(i);
       }
@@ -281,7 +533,7 @@ export class Buffer implements IBuffer {
       i = 0;
     }
 
-    for (; i < this._terminal.cols; i += this._terminal.options.tabStopWidth) {
+    for (; i < this._cols; i += this._terminal.options.tabStopWidth) {
       this.tabs[i] = true;
     }
   }
@@ -291,11 +543,11 @@ export class Buffer implements IBuffer {
    * @param x The position to move the cursor to the previous tab stop.
    */
   public prevStop(x?: number): number {
-    if (x == null) {
+    if (x === null || x === undefined) {
       x = this.x;
     }
     while (!this.tabs[--x] && x > 0);
-    return x >= this._terminal.cols ? this._terminal.cols - 1 : x < 0 ? 0 : x;
+    return x >= this._cols ? this._cols - 1 : x < 0 ? 0 : x;
   }
 
   /**
@@ -303,10 +555,105 @@ export class Buffer implements IBuffer {
    * @param x The position to move the cursor one tab stop forward.
    */
   public nextStop(x?: number): number {
-    if (x == null) {
+    if (x === null || x === undefined) {
       x = this.x;
     }
-    while (!this.tabs[++x] && x < this._terminal.cols);
-    return x >= this._terminal.cols ? this._terminal.cols - 1 : x < 0 ? 0 : x;
+    while (!this.tabs[++x] && x < this._cols);
+    return x >= this._cols ? this._cols - 1 : x < 0 ? 0 : x;
+  }
+
+  public addMarker(y: number): Marker {
+    const marker = new Marker(y);
+    this.markers.push(marker);
+    marker.register(this.lines.onTrim(amount => {
+      marker.line -= amount;
+      // The marker should be disposed when the line is trimmed from the buffer
+      if (marker.line < 0) {
+        marker.dispose();
+      }
+    }));
+    marker.register(this.lines.onInsert(event => {
+      if (marker.line >= event.index) {
+        marker.line += event.amount;
+      }
+    }));
+    marker.register(this.lines.onDelete(event => {
+      // Delete the marker if it's within the range
+      if (marker.line >= event.index && marker.line < event.index + event.amount) {
+        marker.dispose();
+      }
+
+      // Shift the marker if it's after the deleted range
+      if (marker.line > event.index) {
+        marker.line -= event.amount;
+      }
+    }));
+    marker.register(marker.onDispose(() => this._removeMarker(marker)));
+    return marker;
+  }
+
+  private _removeMarker(marker: Marker): void {
+    this.markers.splice(this.markers.indexOf(marker), 1);
+  }
+
+  public iterator(trimRight: boolean, startIndex?: number, endIndex?: number, startOverscan?: number, endOverscan?: number): IBufferStringIterator {
+    return new BufferStringIterator(this, trimRight, startIndex, endIndex, startOverscan, endOverscan);
+  }
+}
+
+/**
+ * Iterator to get unwrapped content strings from the buffer.
+ * The iterator returns at least the string data between the borders
+ * `startIndex` and `endIndex` (exclusive) and will expand the lines
+ * by `startOverscan` to the top and by `endOverscan` to the bottom,
+ * if no new line was found in between.
+ * It will never read/return string data beyond `startIndex - startOverscan`
+ * or `endIndex + endOverscan`. Therefore the first and last line might be truncated.
+ * It is possible to always get the full string for the first and last line as well
+ * by setting the overscan values to the actual buffer length. This not recommended
+ * since it might return the whole buffer within a single string in a worst case scenario.
+ */
+export class BufferStringIterator implements IBufferStringIterator {
+  private _current: number;
+
+  constructor (
+    private _buffer: IBuffer,
+    private _trimRight: boolean,
+    private _startIndex: number = 0,
+    private _endIndex: number = _buffer.lines.length,
+    private _startOverscan: number = 0,
+    private _endOverscan: number = 0
+  ) {
+    if (this._startIndex < 0) {
+      this._startIndex = 0;
+    }
+    if (this._endIndex > this._buffer.lines.length) {
+      this._endIndex = this._buffer.lines.length;
+    }
+    this._current = this._startIndex;
+  }
+
+  public hasNext(): boolean {
+    return this._current < this._endIndex;
+  }
+
+  public next(): IBufferStringIteratorResult {
+    const range = this._buffer.getWrappedRangeForLine(this._current);
+    // limit search window to overscan value at both borders
+    if (range.first < this._startIndex - this._startOverscan) {
+      range.first = this._startIndex - this._startOverscan;
+    }
+    if (range.last > this._endIndex + this._endOverscan) {
+      range.last = this._endIndex + this._endOverscan;
+    }
+    // limit to current buffer length
+    range.first = Math.max(range.first, 0);
+    range.last = Math.min(range.last, this._buffer.lines.length);
+    let result = '';
+    for (let i = range.first; i <= range.last; ++i) {
+      result += this._buffer.translateBufferLineToString(i, this._trimRight);
+    }
+    this._current = range.last + 1;
+    return {range: range, content: result};
   }
 }

src/BufferSet.test.ts

@@ -4,10 +4,10 @@
  */
 
 import { assert } from 'chai';
-import { ITerminal } from './Interfaces';
+import { ITerminal } from './Types';
 import { BufferSet } from './BufferSet';
 import { Buffer } from './Buffer';
-import { MockTerminal } from './utils/TestUtils.test';
+import { MockTerminal } from './TestUtils.test';
 
 describe('BufferSet', () => {
   let terminal: ITerminal;
@@ -15,8 +15,8 @@ describe('BufferSet', () => {
 
   beforeEach(() => {
     terminal = new MockTerminal();
-    terminal.cols = 80;
-    terminal.rows = 24;
+    (terminal as any).cols = 80;
+    (terminal as any).rows = 24;
     terminal.options.scrollback = 1000;
     bufferSet = new BufferSet(terminal);
   });
@@ -48,4 +48,30 @@ describe('BufferSet', () => {
       assert.equal(bufferSet.active, bufferSet.alt);
     });
   });
+
+  describe('cursor handling when swapping buffers', () => {
+    beforeEach(() => {
+      bufferSet.normal.x = 0;
+      bufferSet.normal.y = 0;
+      bufferSet.alt.x = 0;
+      bufferSet.alt.y = 0;
+    });
+
+    it('should keep the cursor stationary when activating alt buffer', () => {
+      bufferSet.activateNormalBuffer();
+      bufferSet.active.x = 30;
+      bufferSet.active.y = 10;
+      bufferSet.activateAltBuffer();
+      assert.equal(bufferSet.active.x, 30);
+      assert.equal(bufferSet.active.y, 10);
+    });
+    it('should keep the cursor stationary when activating normal buffer', () => {
+      bufferSet.activateAltBuffer();
+      bufferSet.active.x = 30;
+      bufferSet.active.y = 10;
+      bufferSet.activateNormalBuffer();
+      assert.equal(bufferSet.active.x, 30);
+      assert.equal(bufferSet.active.y, 10);
+    });
+  });
 });

src/BufferSet.ts

@@ -3,25 +3,29 @@
  * @license MIT
  */
 
-import { ITerminal, IBufferSet } from './Interfaces';
+import { ITerminal, IBufferSet, IBuffer } from './Types';
+import { IAttributeData } from './core/Types';
 import { Buffer } from './Buffer';
-import { EventEmitter } from './EventEmitter';
+import { EventEmitter2, IEvent } from './common/EventEmitter2';
 
 /**
  * The BufferSet represents the set of two buffers used by xterm terminals (normal and alt) and
  * provides also utilities for working with them.
  */
-export class BufferSet extends EventEmitter implements IBufferSet {
+export class BufferSet implements IBufferSet {
   private _normal: Buffer;
   private _alt: Buffer;
   private _activeBuffer: Buffer;
 
+
+  private _onBufferActivate = new EventEmitter2<{activeBuffer: IBuffer, inactiveBuffer: IBuffer}>();
+  public get onBufferActivate(): IEvent<{activeBuffer: IBuffer, inactiveBuffer: IBuffer}> { return this._onBufferActivate.event; }
+
   /**
    * Create a new BufferSet for the given terminal.
-   * @param {Terminal} terminal - The terminal the BufferSet will belong to
+   * @param _terminal - The terminal the BufferSet will belong to
    */
   constructor(private _terminal: ITerminal) {
-    super();
     this._normal = new Buffer(this._terminal, true);
     this._normal.fillViewportRows();
 
@@ -35,7 +39,6 @@ export class BufferSet extends EventEmitter implements IBufferSet {
 
   /**
    * Returns the alt Buffer of the BufferSet
-   * @returns {Buffer}
    */
   public get alt(): Buffer {
     return this._alt;
@@ -43,7 +46,6 @@ export class BufferSet extends EventEmitter implements IBufferSet {
 
   /**
    * Returns the normal Buffer of the BufferSet
-   * @returns {Buffer}
    */
   public get active(): Buffer {
     return this._activeBuffer;
@@ -51,7 +53,6 @@ export class BufferSet extends EventEmitter implements IBufferSet {
 
   /**
    * Returns the currently active Buffer of the BufferSet
-   * @returns {Buffer}
    */
   public get normal(): Buffer {
     return this._normal;
@@ -61,24 +62,39 @@ export class BufferSet extends EventEmitter implements IBufferSet {
    * Sets the normal Buffer of the BufferSet as its currently active Buffer
    */
   public activateNormalBuffer(): void {
+    if (this._activeBuffer === this._normal) {
+      return;
+    }
+    this._normal.x = this._alt.x;
+    this._normal.y = this._alt.y;
     // The alt buffer should always be cleared when we switch to the normal
     // buffer. This frees up memory since the alt buffer should always be new
     // when activated.
     this._alt.clear();
-
     this._activeBuffer = this._normal;
-    this.emit('activate', this._normal);
+    this._onBufferActivate.fire({
+      activeBuffer: this._normal,
+      inactiveBuffer: this._alt
+    });
   }
 
   /**
    * Sets the alt Buffer of the BufferSet as its currently active Buffer
    */
-  public activateAltBuffer(): void {
+  public activateAltBuffer(fillAttr?: IAttributeData): void {
+    if (this._activeBuffer === this._alt) {
+      return;
+    }
     // Since the alt buffer is always cleared when the normal buffer is
     // activated, we want to fill it when switching to it.
-    this._alt.fillViewportRows();
+    this._alt.fillViewportRows(fillAttr);
+    this._alt.x = this._normal.x;
+    this._alt.y = this._normal.y;
     this._activeBuffer = this._alt;
-    this.emit('activate', this._alt);
+    this._onBufferActivate.fire({
+      activeBuffer: this._alt,
+      inactiveBuffer: this._normal
+    });
   }
 
   /**

src/CharMeasure.test.ts

@@ -4,8 +4,8 @@
  */
 
 import jsdom = require('jsdom');
+import { ICharMeasure } from './Types';
 import { assert } from 'chai';
-import { ICharMeasure, ITerminal } from '../Interfaces';
 import { CharMeasure } from './CharMeasure';
 
 describe('CharMeasure', () => {

src/CharMeasure.ts

@@ -3,30 +3,29 @@
  * @license MIT
  */
 
-import { EventEmitter } from '../EventEmitter';
-import { ICharMeasure, ITerminal, ITerminalOptions } from '../Interfaces';
+import { ICharMeasure, ITerminalOptions } from './Types';
+import { EventEmitter2, IEvent } from './common/EventEmitter2';
 
 /**
  * Utility class that measures the size of a character. Measurements are done in
  * the DOM rather than with a canvas context because support for extracting the
  * height of characters is patchy across browsers.
  */
-export class CharMeasure extends EventEmitter implements ICharMeasure {
+export class CharMeasure implements ICharMeasure {
   private _document: Document;
   private _parentElement: HTMLElement;
   private _measureElement: HTMLElement;
   private _width: number;
   private _height: number;
 
+  private _onCharSizeChanged = new EventEmitter2<void>();
+  public get onCharSizeChanged(): IEvent<void> { return this._onCharSizeChanged.event; }
+
   constructor(document: Document, parentElement: HTMLElement) {
-    super();
     this._document = document;
     this._parentElement = parentElement;
     this._measureElement = this._document.createElement('span');
-    this._measureElement.style.position = 'absolute';
-    this._measureElement.style.top = '0';
-    this._measureElement.style.left = '-9999em';
-    this._measureElement.style.lineHeight = 'normal';
+    this._measureElement.classList.add('xterm-char-measure-element');
     this._measureElement.textContent = 'W';
     this._measureElement.setAttribute('aria-hidden', 'true');
     this._parentElement.appendChild(this._measureElement);
@@ -49,11 +48,11 @@ export class CharMeasure extends EventEmitter implements ICharMeasure {
     if (geometry.width === 0 || geometry.height === 0) {
       return;
     }
-    if (this._width !== geometry.width || this._height !== geometry.height) {
+    const adjustedHeight = Math.ceil(geometry.height);
+    if (this._width !== geometry.width || this._height !== adjustedHeight) {
       this._width = geometry.width;
-      this._height = Math.ceil(geometry.height);
-      this.emit('charsizechanged');
+      this._height = adjustedHeight;
+      this._onCharSizeChanged.fire();
     }
   }
-
 }

src/CharWidth.test.ts

@@ -0,0 +1,254 @@
+/**
+ * Copyright (c) 2017 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+import { TestTerminal } from './TestUtils.test';
+import { assert } from 'chai';
+import { getStringCellWidth, wcwidth } from './CharWidth';
+import { IBuffer } from './Types';
+import { CellData, CHAR_DATA_WIDTH_INDEX, CHAR_DATA_CHAR_INDEX } from './core/buffer/BufferLine';
+
+
+describe('getStringCellWidth', function(): void {
+  let terminal: TestTerminal;
+
+  beforeEach(() => {
+    terminal = new TestTerminal({rows: 5, cols: 30});
+  });
+
+  function sumWidths(buffer: IBuffer, start: number, end: number, sentinel: string): number {
+    let result = 0;
+    for (let i = start; i < end; ++i) {
+      const line = buffer.lines.get(i);
+      for (let j = 0; j < line.length; ++j) { // TODO: change to trimBorder with multiline
+        const ch = line.loadCell(j, new CellData()).getAsCharData();
+        result += ch[CHAR_DATA_WIDTH_INDEX];
+        // return on sentinel
+        if (ch[CHAR_DATA_CHAR_INDEX] === sentinel) {
+          return result;
+        }
+      }
+    }
+    return result;
+  }
+
+  it('ASCII chars', function(): void {
+    const input = 'This is just ASCII text.#';
+    terminal.writeSync(input);
+    const s = terminal.buffer.iterator(true).next().content;
+    assert.equal(input, s);
+    assert.equal(getStringCellWidth(s), sumWidths(terminal.buffer, 0, 1, '#'));
+  });
+  it('combining chars', function(): void {
+    const input = 'e\u0301e\u0301e\u0301e\u0301e\u0301e\u0301e\u0301e\u0301e\u0301#';
+    terminal.writeSync(input);
+    const s = terminal.buffer.iterator(true).next().content;
+    assert.equal(input, s);
+    assert.equal(getStringCellWidth(s), sumWidths(terminal.buffer, 0, 1, '#'));
+  });
+  it('surrogate chars', function(): void {
+    const input = '𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞𝄞#';
+    terminal.writeSync(input);
+    const s = terminal.buffer.iterator(true).next().content;
+    assert.equal(input, s);
+    assert.equal(getStringCellWidth(s), sumWidths(terminal.buffer, 0, 1, '#'));
+  });
+  it('surrogate combining chars', function(): void {
+    const input = '𓂀\u0301𓂀\u0301𓂀\u0301𓂀\u0301𓂀\u0301𓂀\u0301𓂀\u0301𓂀\u0301𓂀\u0301𓂀\u0301𓂀\u0301#';
+    terminal.writeSync(input);
+    const s = terminal.buffer.iterator(true).next().content;
+    assert.equal(input, s);
+    assert.equal(getStringCellWidth(s), sumWidths(terminal.buffer, 0, 1, '#'));
+  });
+  it('fullwidth chars', function(): void {
+    const input = '１２３４５６７８９０#';
+    terminal.writeSync(input);
+    const s = terminal.buffer.iterator(true).next().content;
+    assert.equal(input, s);
+    assert.equal(getStringCellWidth(s), sumWidths(terminal.buffer, 0, 1, '#'));
+  });
+  it('fullwidth chars offset 1', function(): void {
+    const input = 'a１２３４５６７８９０#';
+    terminal.writeSync(input);
+    const s = terminal.buffer.iterator(true).next().content;
+    assert.equal(input, s);
+    assert.equal(getStringCellWidth(s), sumWidths(terminal.buffer, 0, 1, '#'));
+  });
+  // TODO: multiline tests once #1685 is resolved
+});
+
+it('wcwidth should match all values from the old implementation', function(): void {
+  // old implementation
+  const wcwidthOld = (function(opts: {nul: number, control: number}): (ucs: number) => number {
+    // extracted from https://www.cl.cam.ac.uk/%7Emgk25/ucs/wcwidth.c
+    // combining characters
+    const COMBINING_BMP = [
+      [0x0300, 0x036F], [0x0483, 0x0486], [0x0488, 0x0489],
+      [0x0591, 0x05BD], [0x05BF, 0x05BF], [0x05C1, 0x05C2],
+      [0x05C4, 0x05C5], [0x05C7, 0x05C7], [0x0600, 0x0603],
+      [0x0610, 0x0615], [0x064B, 0x065E], [0x0670, 0x0670],
+      [0x06D6, 0x06E4], [0x06E7, 0x06E8], [0x06EA, 0x06ED],
+      [0x070F, 0x070F], [0x0711, 0x0711], [0x0730, 0x074A],
+      [0x07A6, 0x07B0], [0x07EB, 0x07F3], [0x0901, 0x0902],
+      [0x093C, 0x093C], [0x0941, 0x0948], [0x094D, 0x094D],
+      [0x0951, 0x0954], [0x0962, 0x0963], [0x0981, 0x0981],
+      [0x09BC, 0x09BC], [0x09C1, 0x09C4], [0x09CD, 0x09CD],
+      [0x09E2, 0x09E3], [0x0A01, 0x0A02], [0x0A3C, 0x0A3C],
+      [0x0A41, 0x0A42], [0x0A47, 0x0A48], [0x0A4B, 0x0A4D],
+      [0x0A70, 0x0A71], [0x0A81, 0x0A82], [0x0ABC, 0x0ABC],
+      [0x0AC1, 0x0AC5], [0x0AC7, 0x0AC8], [0x0ACD, 0x0ACD],
+      [0x0AE2, 0x0AE3], [0x0B01, 0x0B01], [0x0B3C, 0x0B3C],
+      [0x0B3F, 0x0B3F], [0x0B41, 0x0B43], [0x0B4D, 0x0B4D],
+      [0x0B56, 0x0B56], [0x0B82, 0x0B82], [0x0BC0, 0x0BC0],
+      [0x0BCD, 0x0BCD], [0x0C3E, 0x0C40], [0x0C46, 0x0C48],
+      [0x0C4A, 0x0C4D], [0x0C55, 0x0C56], [0x0CBC, 0x0CBC],
+      [0x0CBF, 0x0CBF], [0x0CC6, 0x0CC6], [0x0CCC, 0x0CCD],
+      [0x0CE2, 0x0CE3], [0x0D41, 0x0D43], [0x0D4D, 0x0D4D],
+      [0x0DCA, 0x0DCA], [0x0DD2, 0x0DD4], [0x0DD6, 0x0DD6],
+      [0x0E31, 0x0E31], [0x0E34, 0x0E3A], [0x0E47, 0x0E4E],
+      [0x0EB1, 0x0EB1], [0x0EB4, 0x0EB9], [0x0EBB, 0x0EBC],
+      [0x0EC8, 0x0ECD], [0x0F18, 0x0F19], [0x0F35, 0x0F35],
+      [0x0F37, 0x0F37], [0x0F39, 0x0F39], [0x0F71, 0x0F7E],
+      [0x0F80, 0x0F84], [0x0F86, 0x0F87], [0x0F90, 0x0F97],
+      [0x0F99, 0x0FBC], [0x0FC6, 0x0FC6], [0x102D, 0x1030],
+      [0x1032, 0x1032], [0x1036, 0x1037], [0x1039, 0x1039],
+      [0x1058, 0x1059], [0x1160, 0x11FF], [0x135F, 0x135F],
+      [0x1712, 0x1714], [0x1732, 0x1734], [0x1752, 0x1753],
+      [0x1772, 0x1773], [0x17B4, 0x17B5], [0x17B7, 0x17BD],
+      [0x17C6, 0x17C6], [0x17C9, 0x17D3], [0x17DD, 0x17DD],
+      [0x180B, 0x180D], [0x18A9, 0x18A9], [0x1920, 0x1922],
+      [0x1927, 0x1928], [0x1932, 0x1932], [0x1939, 0x193B],
+      [0x1A17, 0x1A18], [0x1B00, 0x1B03], [0x1B34, 0x1B34],
+      [0x1B36, 0x1B3A], [0x1B3C, 0x1B3C], [0x1B42, 0x1B42],
+      [0x1B6B, 0x1B73], [0x1DC0, 0x1DCA], [0x1DFE, 0x1DFF],
+      [0x200B, 0x200F], [0x202A, 0x202E], [0x2060, 0x2063],
+      [0x206A, 0x206F], [0x20D0, 0x20EF], [0x302A, 0x302F],
+      [0x3099, 0x309A], [0xA806, 0xA806], [0xA80B, 0xA80B],
+      [0xA825, 0xA826], [0xFB1E, 0xFB1E], [0xFE00, 0xFE0F],
+      [0xFE20, 0xFE23], [0xFEFF, 0xFEFF], [0xFFF9, 0xFFFB]
+    ];
+    const COMBINING_HIGH = [
+      [0x10A01, 0x10A03], [0x10A05, 0x10A06], [0x10A0C, 0x10A0F],
+      [0x10A38, 0x10A3A], [0x10A3F, 0x10A3F], [0x1D167, 0x1D169],
+      [0x1D173, 0x1D182], [0x1D185, 0x1D18B], [0x1D1AA, 0x1D1AD],
+      [0x1D242, 0x1D244], [0xE0001, 0xE0001], [0xE0020, 0xE007F],
+      [0xE0100, 0xE01EF]
+    ];
+    // binary search
+    function bisearch(ucs: number, data: number[][]): boolean {
+      let min = 0;
+      let max = data.length - 1;
+      let mid;
+      if (ucs < data[0][0] || ucs > data[max][1]) {
+        return false;
+      }
+      while (max >= min) {
+        mid = (min + max) >> 1;
+        if (ucs > data[mid][1]) {
+          min = mid + 1;
+        } else if (ucs < data[mid][0]) {
+          max = mid - 1;
+        } else {
+          return true;
+        }
+      }
+      return false;
+    }
+    function wcwidthBMP(ucs: number): number {
+      // test for 8-bit control characters
+      if (ucs === 0) {
+        return opts.nul;
+      }
+      if (ucs < 32 || (ucs >= 0x7f && ucs < 0xa0)) {
+        return opts.control;
+      }
+      // binary search in table of non-spacing characters
+      if (bisearch(ucs, COMBINING_BMP)) {
+        return 0;
+      }
+      // if we arrive here, ucs is not a combining or C0/C1 control character
+      if (isWideBMP(ucs)) {
+        return 2;
+      }
+      return 1;
+    }
+    function isWideBMP(ucs: number): boolean {
+      return (
+        ucs >= 0x1100 && (
+        ucs <= 0x115f ||                // Hangul Jamo init. consonants
+        ucs === 0x2329 ||
+        ucs === 0x232a ||
+        (ucs >= 0x2e80 && ucs <= 0xa4cf && ucs !== 0x303f) ||  // CJK..Yi
+        (ucs >= 0xac00 && ucs <= 0xd7a3) ||    // Hangul Syllables
+        (ucs >= 0xf900 && ucs <= 0xfaff) ||    // CJK Compat Ideographs
+        (ucs >= 0xfe10 && ucs <= 0xfe19) ||    // Vertical forms
+        (ucs >= 0xfe30 && ucs <= 0xfe6f) ||    // CJK Compat Forms
+        (ucs >= 0xff00 && ucs <= 0xff60) ||    // Fullwidth Forms
+        (ucs >= 0xffe0 && ucs <= 0xffe6)));
+    }
+    function wcwidthHigh(ucs: number): 0 | 1 | 2 {
+      if (bisearch(ucs, COMBINING_HIGH)) {
+        return 0;
+      }
+      if ((ucs >= 0x20000 && ucs <= 0x2fffd) || (ucs >= 0x30000 && ucs <= 0x3fffd)) {
+        return 2;
+      }
+      return 1;
+    }
+    const control = opts.control | 0;
+    let table: number[] | Uint32Array = null;
+    function initTable(): number[] | Uint32Array {
+      // lookup table for BMP
+      const CODEPOINTS = 65536;  // BMP holds 65536 codepoints
+      const BITWIDTH = 2;        // a codepoint can have a width of 0, 1 or 2
+      const ITEMSIZE = 32;       // using uint32_t
+      const CONTAINERSIZE = CODEPOINTS * BITWIDTH / ITEMSIZE;
+      const CODEPOINTS_PER_ITEM = ITEMSIZE / BITWIDTH;
+      table = (typeof Uint32Array === 'undefined')
+        ? new Array(CONTAINERSIZE)
+        : new Uint32Array(CONTAINERSIZE);
+      for (let i = 0; i < CONTAINERSIZE; ++i) {
+        let num = 0;
+        let pos = CODEPOINTS_PER_ITEM;
+        while (pos--) {
+          num = (num << 2) | wcwidthBMP(CODEPOINTS_PER_ITEM * i + pos);
+        }
+        table[i] = num;
+      }
+      return table;
+    }
+    // get width from lookup table
+    //   position in container   : num / CODEPOINTS_PER_ITEM
+    //     ==> n = table[Math.floor(num / 16)]
+    //     ==> n = table[num >> 4]
+    //   16 codepoints per number:       FFEEDDCCBBAA99887766554433221100
+    //   position in number      : (num % CODEPOINTS_PER_ITEM) * BITWIDTH
+    //     ==> m = (n % 16) * 2
+    //     ==> m = (num & 15) << 1
+    //   right shift to position m
+    //     ==> n = n >> m     e.g. m=12  000000000000FFEEDDCCBBAA99887766
+    //   we are only interested in 2 LSBs, cut off higher bits
+    //     ==> n = n & 3      e.g.       000000000000000000000000000000XX
+    return function (num: number): number {
+      num = num | 0;  // get asm.js like optimization under V8
+      if (num < 32) {
+        return control | 0;
+      }
+      if (num < 127) {
+        return 1;
+      }
+      const t = table || initTable();
+      if (num < 65536) {
+        return t[num >> 4] >> ((num & 15) << 1) & 3;
+      }
+      // do a full search for high codepoints
+      return wcwidthHigh(num);
+    };
+  })({nul: 0, control: 0}); // configurable options
+
+  // test full BMP range old vs new implmenetation
+  for (let i = 0; i < 65536; ++i) {
+    assert.equal(wcwidth(i), wcwidthOld(i), `mismatch for i: ${i}`);
+  }
+});

src/CharWidth.ts

@@ -3,159 +3,169 @@
  * @license MIT
  */
 
+import { fill } from './common/TypedArrayUtils';
+
 export const wcwidth = (function(opts: {nul: number, control: number}): (ucs: number) => number {
-    // extracted from https://www.cl.cam.ac.uk/%7Emgk25/ucs/wcwidth.c
-    // combining characters
-    const COMBINING_BMP = [
-      [0x0300, 0x036F], [0x0483, 0x0486], [0x0488, 0x0489],
-      [0x0591, 0x05BD], [0x05BF, 0x05BF], [0x05C1, 0x05C2],
-      [0x05C4, 0x05C5], [0x05C7, 0x05C7], [0x0600, 0x0603],
-      [0x0610, 0x0615], [0x064B, 0x065E], [0x0670, 0x0670],
-      [0x06D6, 0x06E4], [0x06E7, 0x06E8], [0x06EA, 0x06ED],
-      [0x070F, 0x070F], [0x0711, 0x0711], [0x0730, 0x074A],
-      [0x07A6, 0x07B0], [0x07EB, 0x07F3], [0x0901, 0x0902],
-      [0x093C, 0x093C], [0x0941, 0x0948], [0x094D, 0x094D],
-      [0x0951, 0x0954], [0x0962, 0x0963], [0x0981, 0x0981],
-      [0x09BC, 0x09BC], [0x09C1, 0x09C4], [0x09CD, 0x09CD],
-      [0x09E2, 0x09E3], [0x0A01, 0x0A02], [0x0A3C, 0x0A3C],
-      [0x0A41, 0x0A42], [0x0A47, 0x0A48], [0x0A4B, 0x0A4D],
-      [0x0A70, 0x0A71], [0x0A81, 0x0A82], [0x0ABC, 0x0ABC],
-      [0x0AC1, 0x0AC5], [0x0AC7, 0x0AC8], [0x0ACD, 0x0ACD],
-      [0x0AE2, 0x0AE3], [0x0B01, 0x0B01], [0x0B3C, 0x0B3C],
-      [0x0B3F, 0x0B3F], [0x0B41, 0x0B43], [0x0B4D, 0x0B4D],
-      [0x0B56, 0x0B56], [0x0B82, 0x0B82], [0x0BC0, 0x0BC0],
-      [0x0BCD, 0x0BCD], [0x0C3E, 0x0C40], [0x0C46, 0x0C48],
-      [0x0C4A, 0x0C4D], [0x0C55, 0x0C56], [0x0CBC, 0x0CBC],
-      [0x0CBF, 0x0CBF], [0x0CC6, 0x0CC6], [0x0CCC, 0x0CCD],
-      [0x0CE2, 0x0CE3], [0x0D41, 0x0D43], [0x0D4D, 0x0D4D],
-      [0x0DCA, 0x0DCA], [0x0DD2, 0x0DD4], [0x0DD6, 0x0DD6],
-      [0x0E31, 0x0E31], [0x0E34, 0x0E3A], [0x0E47, 0x0E4E],
-      [0x0EB1, 0x0EB1], [0x0EB4, 0x0EB9], [0x0EBB, 0x0EBC],
-      [0x0EC8, 0x0ECD], [0x0F18, 0x0F19], [0x0F35, 0x0F35],
-      [0x0F37, 0x0F37], [0x0F39, 0x0F39], [0x0F71, 0x0F7E],
-      [0x0F80, 0x0F84], [0x0F86, 0x0F87], [0x0F90, 0x0F97],
-      [0x0F99, 0x0FBC], [0x0FC6, 0x0FC6], [0x102D, 0x1030],
-      [0x1032, 0x1032], [0x1036, 0x1037], [0x1039, 0x1039],
-      [0x1058, 0x1059], [0x1160, 0x11FF], [0x135F, 0x135F],
-      [0x1712, 0x1714], [0x1732, 0x1734], [0x1752, 0x1753],
-      [0x1772, 0x1773], [0x17B4, 0x17B5], [0x17B7, 0x17BD],
-      [0x17C6, 0x17C6], [0x17C9, 0x17D3], [0x17DD, 0x17DD],
-      [0x180B, 0x180D], [0x18A9, 0x18A9], [0x1920, 0x1922],
-      [0x1927, 0x1928], [0x1932, 0x1932], [0x1939, 0x193B],
-      [0x1A17, 0x1A18], [0x1B00, 0x1B03], [0x1B34, 0x1B34],
-      [0x1B36, 0x1B3A], [0x1B3C, 0x1B3C], [0x1B42, 0x1B42],
-      [0x1B6B, 0x1B73], [0x1DC0, 0x1DCA], [0x1DFE, 0x1DFF],
-      [0x200B, 0x200F], [0x202A, 0x202E], [0x2060, 0x2063],
-      [0x206A, 0x206F], [0x20D0, 0x20EF], [0x302A, 0x302F],
-      [0x3099, 0x309A], [0xA806, 0xA806], [0xA80B, 0xA80B],
-      [0xA825, 0xA826], [0xFB1E, 0xFB1E], [0xFE00, 0xFE0F],
-      [0xFE20, 0xFE23], [0xFEFF, 0xFEFF], [0xFFF9, 0xFFFB],
-    ];
-    const COMBINING_HIGH = [
-      [0x10A01, 0x10A03], [0x10A05, 0x10A06], [0x10A0C, 0x10A0F],
-      [0x10A38, 0x10A3A], [0x10A3F, 0x10A3F], [0x1D167, 0x1D169],
-      [0x1D173, 0x1D182], [0x1D185, 0x1D18B], [0x1D1AA, 0x1D1AD],
-      [0x1D242, 0x1D244], [0xE0001, 0xE0001], [0xE0020, 0xE007F],
-      [0xE0100, 0xE01EF]
-    ];
-    // binary search
-    function bisearch(ucs: number, data: number[][]): boolean {
-      let min = 0;
-      let max = data.length - 1;
-      let mid;
-      if (ucs < data[0][0] || ucs > data[max][1])
-        return false;
-      while (max >= min) {
-        mid = (min + max) >> 1;
-        if (ucs > data[mid][1])
-          min = mid + 1;
-        else if (ucs < data[mid][0])
-          max = mid - 1;
-        else
-          return true;
-      }
+  // extracted from https://www.cl.cam.ac.uk/%7Emgk25/ucs/wcwidth.c
+  // combining characters
+  const COMBINING_BMP = [
+    [0x0300, 0x036F], [0x0483, 0x0486], [0x0488, 0x0489],
+    [0x0591, 0x05BD], [0x05BF, 0x05BF], [0x05C1, 0x05C2],
+    [0x05C4, 0x05C5], [0x05C7, 0x05C7], [0x0600, 0x0603],
+    [0x0610, 0x0615], [0x064B, 0x065E], [0x0670, 0x0670],
+    [0x06D6, 0x06E4], [0x06E7, 0x06E8], [0x06EA, 0x06ED],
+    [0x070F, 0x070F], [0x0711, 0x0711], [0x0730, 0x074A],
+    [0x07A6, 0x07B0], [0x07EB, 0x07F3], [0x0901, 0x0902],
+    [0x093C, 0x093C], [0x0941, 0x0948], [0x094D, 0x094D],
+    [0x0951, 0x0954], [0x0962, 0x0963], [0x0981, 0x0981],
+    [0x09BC, 0x09BC], [0x09C1, 0x09C4], [0x09CD, 0x09CD],
+    [0x09E2, 0x09E3], [0x0A01, 0x0A02], [0x0A3C, 0x0A3C],
+    [0x0A41, 0x0A42], [0x0A47, 0x0A48], [0x0A4B, 0x0A4D],
+    [0x0A70, 0x0A71], [0x0A81, 0x0A82], [0x0ABC, 0x0ABC],
+    [0x0AC1, 0x0AC5], [0x0AC7, 0x0AC8], [0x0ACD, 0x0ACD],
+    [0x0AE2, 0x0AE3], [0x0B01, 0x0B01], [0x0B3C, 0x0B3C],
+    [0x0B3F, 0x0B3F], [0x0B41, 0x0B43], [0x0B4D, 0x0B4D],
+    [0x0B56, 0x0B56], [0x0B82, 0x0B82], [0x0BC0, 0x0BC0],
+    [0x0BCD, 0x0BCD], [0x0C3E, 0x0C40], [0x0C46, 0x0C48],
+    [0x0C4A, 0x0C4D], [0x0C55, 0x0C56], [0x0CBC, 0x0CBC],
+    [0x0CBF, 0x0CBF], [0x0CC6, 0x0CC6], [0x0CCC, 0x0CCD],
+    [0x0CE2, 0x0CE3], [0x0D41, 0x0D43], [0x0D4D, 0x0D4D],
+    [0x0DCA, 0x0DCA], [0x0DD2, 0x0DD4], [0x0DD6, 0x0DD6],
+    [0x0E31, 0x0E31], [0x0E34, 0x0E3A], [0x0E47, 0x0E4E],
+    [0x0EB1, 0x0EB1], [0x0EB4, 0x0EB9], [0x0EBB, 0x0EBC],
+    [0x0EC8, 0x0ECD], [0x0F18, 0x0F19], [0x0F35, 0x0F35],
+    [0x0F37, 0x0F37], [0x0F39, 0x0F39], [0x0F71, 0x0F7E],
+    [0x0F80, 0x0F84], [0x0F86, 0x0F87], [0x0F90, 0x0F97],
+    [0x0F99, 0x0FBC], [0x0FC6, 0x0FC6], [0x102D, 0x1030],
+    [0x1032, 0x1032], [0x1036, 0x1037], [0x1039, 0x1039],
+    [0x1058, 0x1059], [0x1160, 0x11FF], [0x135F, 0x135F],
+    [0x1712, 0x1714], [0x1732, 0x1734], [0x1752, 0x1753],
+    [0x1772, 0x1773], [0x17B4, 0x17B5], [0x17B7, 0x17BD],
+    [0x17C6, 0x17C6], [0x17C9, 0x17D3], [0x17DD, 0x17DD],
+    [0x180B, 0x180D], [0x18A9, 0x18A9], [0x1920, 0x1922],
+    [0x1927, 0x1928], [0x1932, 0x1932], [0x1939, 0x193B],
+    [0x1A17, 0x1A18], [0x1B00, 0x1B03], [0x1B34, 0x1B34],
+    [0x1B36, 0x1B3A], [0x1B3C, 0x1B3C], [0x1B42, 0x1B42],
+    [0x1B6B, 0x1B73], [0x1DC0, 0x1DCA], [0x1DFE, 0x1DFF],
+    [0x200B, 0x200F], [0x202A, 0x202E], [0x2060, 0x2063],
+    [0x206A, 0x206F], [0x20D0, 0x20EF], [0x302A, 0x302F],
+    [0x3099, 0x309A], [0xA806, 0xA806], [0xA80B, 0xA80B],
+    [0xA825, 0xA826], [0xFB1E, 0xFB1E], [0xFE00, 0xFE0F],
+    [0xFE20, 0xFE23], [0xFEFF, 0xFEFF], [0xFFF9, 0xFFFB]
+  ];
+  const COMBINING_HIGH = [
+    [0x10A01, 0x10A03], [0x10A05, 0x10A06], [0x10A0C, 0x10A0F],
+    [0x10A38, 0x10A3A], [0x10A3F, 0x10A3F], [0x1D167, 0x1D169],
+    [0x1D173, 0x1D182], [0x1D185, 0x1D18B], [0x1D1AA, 0x1D1AD],
+    [0x1D242, 0x1D244], [0xE0001, 0xE0001], [0xE0020, 0xE007F],
+    [0xE0100, 0xE01EF]
+  ];
+  // binary search
+  function bisearch(ucs: number, data: number[][]): boolean {
+    let min = 0;
+    let max = data.length - 1;
+    let mid;
+    if (ucs < data[0][0] || ucs > data[max][1]) {
       return false;
     }
-    function wcwidthBMP(ucs: number): number {
-      // test for 8-bit control characters
-      if (ucs === 0)
-        return opts.nul;
-      if (ucs < 32 || (ucs >= 0x7f && ucs < 0xa0))
-        return opts.control;
-      // binary search in table of non-spacing characters
-      if (bisearch(ucs, COMBINING_BMP))
-        return 0;
-      // if we arrive here, ucs is not a combining or C0/C1 control character
-      if (isWideBMP(ucs)) {
-        return 2;
+    while (max >= min) {
+      mid = (min + max) >> 1;
+      if (ucs > data[mid][1]) {
+        min = mid + 1;
+      } else if (ucs < data[mid][0]) {
+        max = mid - 1;
+      } else {
+        return true;
       }
+    }
+    return false;
+  }
+  function wcwidthHigh(ucs: number): 0 | 1 | 2 {
+    if (bisearch(ucs, COMBINING_HIGH)) {
+      return 0;
+    }
+    if ((ucs >= 0x20000 && ucs <= 0x2fffd) || (ucs >= 0x30000 && ucs <= 0x3fffd)) {
+      return 2;
+    }
+    return 1;
+  }
+  const control = opts.control | 0;
+
+  // create lookup table for BMP plane
+  const table = new Uint8Array(65536);
+  fill(table, 1);
+  table[0] = opts.nul;
+  // control chars
+  fill(table, opts.control, 1, 32);
+  fill(table, opts.control, 0x7f, 0xa0);
+
+  // apply wide char rules first
+  // wide chars
+  fill(table, 2, 0x1100, 0x1160);
+  table[0x2329] = 2;
+  table[0x232a] = 2;
+  fill(table, 2, 0x2e80, 0xa4d0);
+  table[0x303f] = 1;  // wrongly in last line
+
+  fill(table, 2, 0xac00, 0xd7a4);
+  fill(table, 2, 0xf900, 0xfb00);
+  fill(table, 2, 0xfe10, 0xfe1a);
+  fill(table, 2, 0xfe30, 0xfe70);
+  fill(table, 2, 0xff00, 0xff61);
+  fill(table, 2, 0xffe0, 0xffe7);
+
+  // apply combining last to ensure we overwrite
+  // wrongly wide set chars:
+  //    the original algo evals combining first and falls
+  //    through to wide check so we simply do here the opposite
+  // combining 0
+  for (let r = 0; r < COMBINING_BMP.length; ++r) {
+    fill(table, 0, COMBINING_BMP[r][0], COMBINING_BMP[r][1] + 1);
+  }
+
+  return function (num: number): number {
+    if (num < 32) {
+      return control | 0;
+    }
+    if (num < 127) {
       return 1;
     }
-    function isWideBMP(ucs: number): boolean {
-      return (
-        ucs >= 0x1100 && (
-        ucs <= 0x115f ||                // Hangul Jamo init. consonants
-        ucs === 0x2329 ||
-        ucs === 0x232a ||
-        (ucs >= 0x2e80 && ucs <= 0xa4cf && ucs !== 0x303f) ||  // CJK..Yi
-        (ucs >= 0xac00 && ucs <= 0xd7a3) ||    // Hangul Syllables
-        (ucs >= 0xf900 && ucs <= 0xfaff) ||    // CJK Compat Ideographs
-        (ucs >= 0xfe10 && ucs <= 0xfe19) ||    // Vertical forms
-        (ucs >= 0xfe30 && ucs <= 0xfe6f) ||    // CJK Compat Forms
-        (ucs >= 0xff00 && ucs <= 0xff60) ||    // Fullwidth Forms
-        (ucs >= 0xffe0 && ucs <= 0xffe6)));
+    if (num < 65536) {
+      return table[num];
     }
-    function wcwidthHigh(ucs: number): 0 | 1 | 2 {
-      if (bisearch(ucs, COMBINING_HIGH))
-        return 0;
-      if ((ucs >= 0x20000 && ucs <= 0x2fffd) || (ucs >= 0x30000 && ucs <= 0x3fffd)) {
-        return 2;
-      }
-      return 1;
-    }
-    const control = opts.control | 0;
-    let table: number[] | Uint32Array = null;
-    function init_table(): number[] | Uint32Array {
-      // lookup table for BMP
-      const CODEPOINTS = 65536;  // BMP holds 65536 codepoints
-      const BITWIDTH = 2;        // a codepoint can have a width of 0, 1 or 2
-      const ITEMSIZE = 32;       // using uint32_t
-      const CONTAINERSIZE = CODEPOINTS * BITWIDTH / ITEMSIZE;
-      const CODEPOINTS_PER_ITEM = ITEMSIZE / BITWIDTH;
-      table = (typeof Uint32Array === 'undefined')
-        ? new Array(CONTAINERSIZE)
-        : new Uint32Array(CONTAINERSIZE);
-      for (let i = 0; i < CONTAINERSIZE; ++i) {
-        let num = 0;
-        let pos = CODEPOINTS_PER_ITEM;
-        while (pos--)
-          num = (num << 2) | wcwidthBMP(CODEPOINTS_PER_ITEM * i + pos);
-        table[i] = num;
-      }
-      return table;
-    }
-    // get width from lookup table
-    //   position in container   : num / CODEPOINTS_PER_ITEM
-    //     ==> n = table[Math.floor(num / 16)]
-    //     ==> n = table[num >> 4]
-    //   16 codepoints per number:       FFEEDDCCBBAA99887766554433221100
-    //   position in number      : (num % CODEPOINTS_PER_ITEM) * BITWIDTH
-    //     ==> m = (n % 16) * 2
-    //     ==> m = (num & 15) << 1
-    //   right shift to position m
-    //     ==> n = n >> m     e.g. m=12  000000000000FFEEDDCCBBAA99887766
-    //   we are only interested in 2 LSBs, cut off higher bits
-    //     ==> n = n & 3      e.g.       000000000000000000000000000000XX
-    return function (num: number): number {
-      num = num | 0;  // get asm.js like optimization under V8
-      if (num < 32)
-        return control | 0;
-      if (num < 127)
-        return 1;
-      let t = table || init_table();
-      if (num < 65536)
-        return t[num >> 4] >> ((num & 15) << 1) & 3;
-      // do a full search for high codepoints
-      return wcwidthHigh(num);
-    };
+    // do a full search for high codepoints
+    return wcwidthHigh(num);
+  };
 })({nul: 0, control: 0});  // configurable options
+
+/**
+ * Get the terminal cell width for a string.
+ */
+export function getStringCellWidth(s: string): number {
+  let result = 0;
+  const length = s.length;
+  for (let i = 0; i < length; ++i) {
+    let code = s.charCodeAt(i);
+    // surrogate pair first
+    if (0xD800 <= code && code <= 0xDBFF) {
+      if (++i >= length) {
+        // this should not happen with strings retrieved from
+        // Buffer.translateToString as it converts from UTF-32
+        // and therefore always should contain the second part
+        // for any other string we still have to handle it somehow:
+        // simply treat the lonely surrogate first as a single char (UCS-2 behavior)
+        return result + wcwidth(code);
+      }
+      const second = s.charCodeAt(i);
+      // convert surrogate pair to high codepoint only for valid second part (UTF-16)
+      // otherwise treat them independently (UCS-2 behavior)
+      if (0xDC00 <= second && second <= 0xDFFF) {
+        code = (code - 0xD800) * 0x400 + second - 0xDC00 + 0x10000;
+      } else {
+        result += wcwidth(second);
+      }
+    }
+    result += wcwidth(code);
+  }
+  return result;
+}

src/Clipboard.test.ts

@@ -4,17 +4,22 @@
  */
 
 import { assert } from 'chai';
-import * as Terminal from '../Terminal';
 import * as Clipboard from './Clipboard';
 
 describe('evaluatePastedTextProcessing', () => {
-  it('should replace carriage return + line feed with line feed on windows', () => {
-    const pastedText = 'foo\r\nbar\r\n';
-    const processedText = Clipboard.prepareTextForTerminal(pastedText, false);
-    const windowsProcessedText = Clipboard.prepareTextForTerminal(pastedText, true);
+  it('should replace carriage return and/or line feed with carriage return', () => {
+    const pastedText = {
+      unix: 'foo\nbar\n',
+      windows: 'foo\r\nbar\r\n'
+    };
 
-    assert.equal(processedText, 'foo\r\nbar\r\n');
-    assert.equal(windowsProcessedText, 'foo\rbar\r');
+    const processedText = {
+      unix: Clipboard.prepareTextForTerminal(pastedText.unix),
+      windows: Clipboard.prepareTextForTerminal(pastedText.windows)
+    };
+
+    assert.equal(processedText.unix, 'foo\rbar\r');
+    assert.equal(processedText.windows, 'foo\rbar\r');
   });
   it('should bracket pasted text in bracketedPasteMode', () => {
     const pastedText = 'foo bar';

src/Clipboard.ts

@@ -3,7 +3,7 @@
  * @license MIT
  */
 
-import { ITerminal, ISelectionManager } from '../Interfaces';
+import { ITerminal, ISelectionManager } from './Types';
 
 interface IWindow extends Window {
   clipboardData?: {
@@ -18,11 +18,8 @@ declare var window: IWindow;
  * Prepares text to be pasted into the terminal by normalizing the line endings
  * @param text The pasted text that needs processing before inserting into the terminal
  */
-export function prepareTextForTerminal(text: string, isMSWindows: boolean): string {
-  if (isMSWindows) {
-    return text.replace(/\r?\n/g, '\r');
-  }
-  return text;
+export function prepareTextForTerminal(text: string): string {
+  return text.replace(/\r?\n/g, '\r');
 }
 
 /**
@@ -38,7 +35,7 @@ export function bracketTextForPaste(text: string, bracketedPasteMode: boolean):
 
 /**
  * Binds copy functionality to the given terminal.
- * @param {ClipboardEvent} ev The original copy event to be handled
+ * @param ev The original copy event to be handled
  */
 export function copyHandler(ev: ClipboardEvent, term: ITerminal, selectionManager: ISelectionManager): void {
   if (term.browser.isMSIE) {
@@ -53,16 +50,16 @@ export function copyHandler(ev: ClipboardEvent, term: ITerminal, selectionManage
 
 /**
  * Redirect the clipboard's data to the terminal's input handler.
- * @param {ClipboardEvent} ev The original paste event to be handled
- * @param {Terminal} term The terminal on which to apply the handled paste event
+ * @param ev The original paste event to be handled
+ * @param term The terminal on which to apply the handled paste event
  */
 export function pasteHandler(ev: ClipboardEvent, term: ITerminal): void {
   ev.stopPropagation();
 
   let text: string;
 
-  let dispatchPaste = function(text: string): void {
-    text = prepareTextForTerminal(text, term.browser.isMSWindows);
+  const dispatchPaste = function(text: string): void {
+    text = prepareTextForTerminal(text);
     text = bracketTextForPaste(text, term.bracketedPasteMode);
     term.handler(text);
     term.textarea.value = '';
@@ -88,26 +85,33 @@ export function pasteHandler(ev: ClipboardEvent, term: ITerminal): void {
  * @param ev The original right click event to be handled.
  * @param textarea The terminal's textarea.
  */
-export function moveTextAreaUnderMouseCursor(ev: MouseEvent, textarea: HTMLTextAreaElement): void {
-  // Bring textarea at the cursor position
-  textarea.style.position = 'fixed';
-  textarea.style.width = '20px';
-  textarea.style.height = '20px';
-  textarea.style.left = (ev.clientX - 10) + 'px';
-  textarea.style.top = (ev.clientY - 10) + 'px';
-  textarea.style.zIndex = '1000';
+export function moveTextAreaUnderMouseCursor(ev: MouseEvent, term: ITerminal): void {
 
-  textarea.focus();
+  // Calculate textarea position relative to the screen element
+  const pos = term.screenElement.getBoundingClientRect();
+  const left = ev.clientX - pos.left - 10;
+  const top = ev.clientY - pos.top - 10;
+
+  // Bring textarea at the cursor position
+  term.textarea.style.position = 'absolute';
+  term.textarea.style.width = '20px';
+  term.textarea.style.height = '20px';
+  term.textarea.style.left = `${left}px`;
+  term.textarea.style.top = `${top}px`;
+  term.textarea.style.zIndex = '1000';
+
+  term.textarea.focus();
 
   // Reset the terminal textarea's styling
+  // Timeout needs to be long enough for click event to be handled.
   setTimeout(() => {
-    textarea.style.position = null;
-    textarea.style.width = null;
-    textarea.style.height = null;
-    textarea.style.left = null;
-    textarea.style.top = null;
-    textarea.style.zIndex = null;
-  }, 4);
+    term.textarea.style.position = null;
+    term.textarea.style.width = null;
+    term.textarea.style.height = null;
+    term.textarea.style.left = null;
+    term.textarea.style.top = null;
+    term.textarea.style.zIndex = null;
+  }, 200);
 }
 
 /**
@@ -115,11 +119,16 @@ export function moveTextAreaUnderMouseCursor(ev: MouseEvent, textarea: HTMLTextA
  * @param ev The original right click event to be handled.
  * @param textarea The terminal's textarea.
  * @param selectionManager The terminal's selection manager.
+ * @param shouldSelectWord If true and there is no selection the current word will be selected
  */
-export function rightClickHandler(ev: MouseEvent, textarea: HTMLTextAreaElement, selectionManager: ISelectionManager): void {
-  moveTextAreaUnderMouseCursor(ev, textarea);
+export function rightClickHandler(ev: MouseEvent, term: ITerminal, selectionManager: ISelectionManager, shouldSelectWord: boolean): void {
+  moveTextAreaUnderMouseCursor(ev, term);
+
+  if (shouldSelectWord && !selectionManager.isClickInSelection(ev)) {
+    selectionManager.selectWordAtCursor(ev);
+  }
 
   // Get textarea ready to copy from the context menu
-  textarea.value = selectionManager.selectionText;
-  textarea.select();
+  term.textarea.value = selectionManager.selectionText;
+  term.textarea.select();
 }

src/CompositionHelper.test.ts

@@ -5,19 +5,20 @@
 
 import { assert } from 'chai';
 import { CompositionHelper } from './CompositionHelper';
+import { ITerminal } from './Types';
 
 describe('CompositionHelper', () => {
-  let terminal;
-  let compositionHelper;
-  let compositionView;
-  let textarea;
-  let handledText;
+  let terminal: ITerminal;
+  let compositionHelper: CompositionHelper;
+  let compositionView: HTMLElement;
+  let textarea: HTMLTextAreaElement;
+  let handledText: string;
 
   beforeEach(() => {
     compositionView = {
       classList: {
         add: () => {},
-        remove: () => {},
+        remove: () => {}
       },
       getBoundingClientRect: () => {
         return { width: 0 };
@@ -27,14 +28,14 @@ describe('CompositionHelper', () => {
         top: 0
       },
       textContent: ''
-    };
+    } as any;
     textarea = {
       value: '',
       style: {
         left: 0,
         top: 0
       }
-    };
+    } as any;
     terminal = {
       element: {
         querySelector: () => {
@@ -54,7 +55,7 @@ describe('CompositionHelper', () => {
       options: {
         lineHeight: 1
       }
-    };
+    } as any;
     handledText = '';
     compositionHelper = new CompositionHelper(textarea, compositionView, terminal);
   });
@@ -63,7 +64,7 @@ describe('CompositionHelper', () => {
     it('Should insert simple characters', (done) => {
       // First character 'ㅇ'
       compositionHelper.compositionstart();
-      compositionHelper.compositionupdate({ data: 'ㅇ' });
+      compositionHelper.compositionupdate(<CompositionEvent><CompositionEvent>{ data: 'ㅇ' });
       textarea.value = 'ㅇ';
       setTimeout(() => { // wait for any textarea updates
         compositionHelper.compositionend();
@@ -71,7 +72,7 @@ describe('CompositionHelper', () => {
           assert.equal(handledText, 'ㅇ');
           // Second character 'ㅇ'
           compositionHelper.compositionstart();
-          compositionHelper.compositionupdate({ data: 'ㅇ' });
+          compositionHelper.compositionupdate(<CompositionEvent><CompositionEvent>{ data: 'ㅇ' });
           textarea.value = 'ㅇㅇ';
           setTimeout(() => { // wait for any textarea updates
             compositionHelper.compositionend();
@@ -87,13 +88,13 @@ describe('CompositionHelper', () => {
     it('Should insert complex characters', (done) => {
       // First character '앙'
       compositionHelper.compositionstart();
-      compositionHelper.compositionupdate({ data: 'ㅇ' });
+      compositionHelper.compositionupdate(<CompositionEvent>{ data: 'ㅇ' });
       textarea.value = 'ㅇ';
       setTimeout(() => { // wait for any textarea updates
-        compositionHelper.compositionupdate({ data: '아' });
+        compositionHelper.compositionupdate(<CompositionEvent>{ data: '아' });
         textarea.value = '아';
         setTimeout(() => { // wait for any textarea updates
-          compositionHelper.compositionupdate({ data: '앙' });
+          compositionHelper.compositionupdate(<CompositionEvent>{ data: '앙' });
           textarea.value = '앙';
           setTimeout(() => { // wait for any textarea updates
             compositionHelper.compositionend();
@@ -101,13 +102,13 @@ describe('CompositionHelper', () => {
               assert.equal(handledText, '앙');
               // Second character '앙'
               compositionHelper.compositionstart();
-              compositionHelper.compositionupdate({ data: 'ㅇ' });
+              compositionHelper.compositionupdate(<CompositionEvent>{ data: 'ㅇ' });
               textarea.value = '앙ㅇ';
               setTimeout(() => { // wait for any textarea updates
-                compositionHelper.compositionupdate({ data: '아' });
+                compositionHelper.compositionupdate(<CompositionEvent>{ data: '아' });
                 textarea.value = '앙아';
                 setTimeout(() => { // wait for any textarea updates
-                  compositionHelper.compositionupdate({ data: '앙' });
+                  compositionHelper.compositionupdate(<CompositionEvent>{ data: '앙' });
                   textarea.value = '앙앙';
                   setTimeout(() => { // wait for any textarea updates
                     compositionHelper.compositionend();
@@ -127,19 +128,19 @@ describe('CompositionHelper', () => {
     it('Should insert complex characters that change with following character', (done) => {
       // First character '아'
       compositionHelper.compositionstart();
-      compositionHelper.compositionupdate({ data: 'ㅇ' });
+      compositionHelper.compositionupdate(<CompositionEvent>{ data: 'ㅇ' });
       textarea.value = 'ㅇ';
       setTimeout(() => { // wait for any textarea updates
-        compositionHelper.compositionupdate({ data: '아' });
+        compositionHelper.compositionupdate(<CompositionEvent>{ data: '아' });
         textarea.value = '아';
         setTimeout(() => { // wait for any textarea updates
           // Start second character '아' in first character
-          compositionHelper.compositionupdate({ data: '앙' });
+          compositionHelper.compositionupdate(<CompositionEvent>{ data: '앙' });
           textarea.value = '앙';
           setTimeout(() => { // wait for any textarea updates
             compositionHelper.compositionend();
             compositionHelper.compositionstart();
-            compositionHelper.compositionupdate({ data: '아' });
+            compositionHelper.compositionupdate(<CompositionEvent>{ data: '아' });
             textarea.value = '아아';
             setTimeout(() => { // wait for any textarea updates
               compositionHelper.compositionend();
@@ -156,14 +157,14 @@ describe('CompositionHelper', () => {
     it('Should insert multi-characters compositions', (done) => {
       // First character 'だ'
       compositionHelper.compositionstart();
-      compositionHelper.compositionupdate({ data: 'd' });
+      compositionHelper.compositionupdate(<CompositionEvent>{ data: 'd' });
       textarea.value = 'd';
       setTimeout(() => { // wait for any textarea updates
-        compositionHelper.compositionupdate({ data: 'だ' });
+        compositionHelper.compositionupdate(<CompositionEvent>{ data: 'だ' });
         textarea.value = 'だ';
         setTimeout(() => { // wait for any textarea updates
           // Second character 'あ'
-          compositionHelper.compositionupdate({ data: 'だあ' });
+          compositionHelper.compositionupdate(<CompositionEvent>{ data: 'だあ' });
           textarea.value = 'だあ';
           setTimeout(() => { // wait for any textarea updates
             compositionHelper.compositionend();
@@ -179,18 +180,18 @@ describe('CompositionHelper', () => {
     it('Should insert multi-character compositions that are converted to other characters with the same length', (done) => {
       // First character 'だ'
       compositionHelper.compositionstart();
-      compositionHelper.compositionupdate({ data: 'd' });
+      compositionHelper.compositionupdate(<CompositionEvent>{ data: 'd' });
       textarea.value = 'd';
       setTimeout(() => { // wait for any textarea updates
-        compositionHelper.compositionupdate({ data: 'だ' });
+        compositionHelper.compositionupdate(<CompositionEvent>{ data: 'だ' });
         textarea.value = 'だ';
         setTimeout(() => { // wait for any textarea updates
           // Second character 'ー'
-          compositionHelper.compositionupdate({ data: 'だー' });
+          compositionHelper.compositionupdate(<CompositionEvent>{ data: 'だー' });
           textarea.value = 'だー';
           setTimeout(() => { // wait for any textarea updates
             // Convert to katakana 'ダー'
-            compositionHelper.compositionupdate({ data: 'ダー' });
+            compositionHelper.compositionupdate(<CompositionEvent>{ data: 'ダー' });
             textarea.value = 'ダー';
             setTimeout(() => { // wait for any textarea updates
               compositionHelper.compositionend();
@@ -207,18 +208,18 @@ describe('CompositionHelper', () => {
     it('Should insert multi-character compositions that are converted to other characters with different lengths', (done) => {
       // First character 'い'
       compositionHelper.compositionstart();
-      compositionHelper.compositionupdate({ data: 'い' });
+      compositionHelper.compositionupdate(<CompositionEvent>{ data: 'い' });
       textarea.value = 'い';
       setTimeout(() => { // wait for any textarea updates
         // Second character 'ま'
-        compositionHelper.compositionupdate({ data: 'いm' });
+        compositionHelper.compositionupdate(<CompositionEvent>{ data: 'いm' });
         textarea.value = 'いm';
         setTimeout(() => { // wait for any textarea updates
-          compositionHelper.compositionupdate({ data: 'いま' });
+          compositionHelper.compositionupdate(<CompositionEvent>{ data: 'いま' });
           textarea.value = 'いま';
           setTimeout(() => { // wait for any textarea updates
             // Convert to kanji '今'
-            compositionHelper.compositionupdate({ data: '今' });
+            compositionHelper.compositionupdate(<CompositionEvent>{ data: '今' });
             textarea.value = '今';
             setTimeout(() => { // wait for any textarea updates
               compositionHelper.compositionend();
@@ -235,7 +236,7 @@ describe('CompositionHelper', () => {
     it('Should insert non-composition characters input immediately after composition characters', (done) => {
       // First character 'ㅇ'
       compositionHelper.compositionstart();
-      compositionHelper.compositionupdate({ data: 'ㅇ' });
+      compositionHelper.compositionupdate(<CompositionEvent>{ data: 'ㅇ' });
       textarea.value = 'ㅇ';
       setTimeout(() => { // wait for any textarea updates
         compositionHelper.compositionend();

src/CompositionHelper.ts

@@ -3,7 +3,7 @@
  * @license MIT
  */
 
-import { ITerminal } from './Interfaces';
+import { ITerminal } from './Types';
 
 interface IPosition {
   start: number;
@@ -20,54 +20,54 @@ export class CompositionHelper {
    * Whether input composition is currently happening, eg. via a mobile keyboard, speech input or
    * IME. This variable determines whether the compositionText should be displayed on the UI.
    */
-  private isComposing: boolean;
+  private _isComposing: boolean;
 
   /**
    * The position within the input textarea's value of the current composition.
    */
-  private compositionPosition: IPosition;
+  private _compositionPosition: IPosition;
 
   /**
    * Whether a composition is in the process of being sent, setting this to false will cancel any
    * in-progress composition.
    */
-  private isSendingComposition: boolean;
+  private _isSendingComposition: boolean;
 
   /**
    * Creates a new CompositionHelper.
-   * @param textarea The textarea that xterm uses for input.
-   * @param compositionView The element to display the in-progress composition in.
-   * @param terminal The Terminal to forward the finished composition to.
+   * @param _textarea The textarea that xterm uses for input.
+   * @param _compositionView The element to display the in-progress composition in.
+   * @param _terminal The Terminal to forward the finished composition to.
    */
   constructor(
-    private textarea: HTMLTextAreaElement,
-    private compositionView: HTMLElement,
-    private terminal: ITerminal
+    private _textarea: HTMLTextAreaElement,
+    private _compositionView: HTMLElement,
+    private _terminal: ITerminal
   ) {
-    this.isComposing = false;
-    this.isSendingComposition = false;
-    this.compositionPosition = { start: null, end: null };
+    this._isComposing = false;
+    this._isSendingComposition = false;
+    this._compositionPosition = { start: null, end: null };
   }
 
   /**
    * Handles the compositionstart event, activating the composition view.
    */
   public compositionstart(): void {
-    this.isComposing = true;
-    this.compositionPosition.start = this.textarea.value.length;
-    this.compositionView.textContent = '';
-    this.compositionView.classList.add('active');
+    this._isComposing = true;
+    this._compositionPosition.start = this._textarea.value.length;
+    this._compositionView.textContent = '';
+    this._compositionView.classList.add('active');
   }
 
   /**
    * Handles the compositionupdate event, updating the composition view.
-   * @param {CompositionEvent} ev The event.
+   * @param ev The event.
    */
   public compositionupdate(ev: CompositionEvent): void {
-    this.compositionView.textContent = ev.data;
+    this._compositionView.textContent = ev.data;
     this.updateCompositionElements();
     setTimeout(() => {
-      this.compositionPosition.end = this.textarea.value.length;
+      this._compositionPosition.end = this._textarea.value.length;
     }, 0);
   }
 
@@ -76,7 +76,7 @@ export class CompositionHelper {
    * the handler.
    */
   public compositionend(): void {
-    this.finalizeComposition(true);
+    this._finalizeComposition(true);
   }
 
   /**
@@ -85,24 +85,23 @@ export class CompositionHelper {
    * @return Whether the Terminal should continue processing the keydown event.
    */
   public keydown(ev: KeyboardEvent): boolean {
-    if (this.isComposing || this.isSendingComposition) {
+    if (this._isComposing || this._isSendingComposition) {
       if (ev.keyCode === 229) {
         // Continue composing if the keyCode is the "composition character"
         return false;
       } else if (ev.keyCode === 16 || ev.keyCode === 17 || ev.keyCode === 18) {
         // Continue composing if the keyCode is a modifier key
         return false;
-      } else {
-        // Finish composition immediately. This is mainly here for the case where enter is
-        // pressed and the handler needs to be triggered before the command is executed.
-        this.finalizeComposition(false);
       }
+      // Finish composition immediately. This is mainly here for the case where enter is
+      // pressed and the handler needs to be triggered before the command is executed.
+      this._finalizeComposition(false);
     }
 
     if (ev.keyCode === 229) {
       // If the "composition character" is used but gets to this point it means a non-composition
       // character (eg. numbers and punctuation) was pressed when the IME was active.
-      this.handleAnyTextareaChanges();
+      this._handleAnyTextareaChanges();
       return false;
     }
 
@@ -112,53 +111,53 @@ export class CompositionHelper {
   /**
    * Finalizes the composition, resuming regular input actions. This is called when a composition
    * is ending.
-   * @param waitForPropogation Whether to wait for events to propogate before sending
+   * @param waitForPropagation Whether to wait for events to propagate before sending
    *   the input. This should be false if a non-composition keystroke is entered before the
-   *   compositionend event is triggered, such as enter, so that the composition is send before
+   *   compositionend event is triggered, such as enter, so that the composition is sent before
    *   the command is executed.
    */
-  private finalizeComposition(waitForPropogation: boolean): void {
-    this.compositionView.classList.remove('active');
-    this.isComposing = false;
-    this.clearTextareaPosition();
+  private _finalizeComposition(waitForPropagation: boolean): void {
+    this._compositionView.classList.remove('active');
+    this._isComposing = false;
+    this._clearTextareaPosition();
 
-    if (!waitForPropogation) {
+    if (!waitForPropagation) {
       // Cancel any delayed composition send requests and send the input immediately.
-      this.isSendingComposition = false;
-      const input = this.textarea.value.substring(this.compositionPosition.start, this.compositionPosition.end);
-      this.terminal.handler(input);
+      this._isSendingComposition = false;
+      const input = this._textarea.value.substring(this._compositionPosition.start, this._compositionPosition.end);
+      this._terminal.handler(input);
     } else {
       // Make a deep copy of the composition position here as a new compositionstart event may
       // fire before the setTimeout executes.
       const currentCompositionPosition = {
-        start: this.compositionPosition.start,
-        end: this.compositionPosition.end,
+        start: this._compositionPosition.start,
+        end: this._compositionPosition.end
       };
 
       // Since composition* events happen before the changes take place in the textarea on most
       // browsers, use a setTimeout with 0ms time to allow the native compositionend event to
-      // complete. This ensures the correct character is retrieved, this solution was used
-      // because:
+      // complete. This ensures the correct character is retrieved.
+      // This solution was used because:
       // - The compositionend event's data property is unreliable, at least on Chromium
       // - The last compositionupdate event's data property does not always accurately describe
       //   the character, a counter example being Korean where an ending consonsant can move to
       //   the following character if the following input is a vowel.
-      this.isSendingComposition = true;
+      this._isSendingComposition = true;
       setTimeout(() => {
         // Ensure that the input has not already been sent
-        if (this.isSendingComposition) {
-          this.isSendingComposition = false;
+        if (this._isSendingComposition) {
+          this._isSendingComposition = false;
           let input;
-          if (this.isComposing) {
+          if (this._isComposing) {
             // Use the end position to get the string if a new composition has started.
-            input = this.textarea.value.substring(currentCompositionPosition.start, currentCompositionPosition.end);
+            input = this._textarea.value.substring(currentCompositionPosition.start, currentCompositionPosition.end);
           } else {
             // Don't use the end position here in order to pick up any characters after the
             // composition has finished, for example when typing a non-composition character
             // (eg. 2) after a composition character.
-            input = this.textarea.value.substring(currentCompositionPosition.start);
+            input = this._textarea.value.substring(currentCompositionPosition.start);
           }
-          this.terminal.handler(input);
+          this._terminal.handler(input);
         }
       }, 0);
     }
@@ -170,15 +169,15 @@ export class CompositionHelper {
    * character" (229) is triggered, in order to allow non-composition text to be entered when an
    * IME is active.
    */
-  private handleAnyTextareaChanges(): void {
-    const oldValue = this.textarea.value;
+  private _handleAnyTextareaChanges(): void {
+    const oldValue = this._textarea.value;
     setTimeout(() => {
       // Ignore if a composition has started since the timeout
-      if (!this.isComposing) {
-        const newValue = this.textarea.value;
+      if (!this._isComposing) {
+        const newValue = this._textarea.value;
         const diff = newValue.replace(oldValue, '');
         if (diff.length > 0) {
-          this.terminal.handler(diff);
+          this._terminal.handler(diff);
         }
       }
     }, 0);
@@ -191,40 +190,42 @@ export class CompositionHelper {
    *   necessary as the IME events across browsers are not consistently triggered.
    */
   public updateCompositionElements(dontRecurse?: boolean): void {
-    if (!this.isComposing) {
+    if (!this._isComposing) {
       return;
     }
 
-    if (this.terminal.buffer.isCursorInViewport) {
-      const cellHeight = Math.ceil(this.terminal.charMeasure.height * this.terminal.options.lineHeight);
-      const cursorTop = this.terminal.buffer.y * cellHeight;
-      const cursorLeft = this.terminal.buffer.x * this.terminal.charMeasure.width;
+    if (this._terminal.buffer.isCursorInViewport) {
+      const cellHeight = Math.ceil(this._terminal.charMeasure.height * this._terminal.options.lineHeight);
+      const cursorTop = this._terminal.buffer.y * cellHeight;
+      const cursorLeft = this._terminal.buffer.x * this._terminal.charMeasure.width;
 
-      this.compositionView.style.left = cursorLeft + 'px';
-      this.compositionView.style.top = cursorTop + 'px';
-      this.compositionView.style.height = cellHeight + 'px';
-      this.compositionView.style.lineHeight = cellHeight + 'px';
+      this._compositionView.style.left = cursorLeft + 'px';
+      this._compositionView.style.top = cursorTop + 'px';
+      this._compositionView.style.height = cellHeight + 'px';
+      this._compositionView.style.lineHeight = cellHeight + 'px';
+      this._compositionView.style.fontFamily = this._terminal.options.fontFamily;
+      this._compositionView.style.fontSize = this._terminal.options.fontSize + 'px';
       // Sync the textarea to the exact position of the composition view so the IME knows where the
       // text is.
-      const compositionViewBounds = this.compositionView.getBoundingClientRect();
-      this.textarea.style.left = cursorLeft + 'px';
-      this.textarea.style.top = cursorTop + 'px';
-      this.textarea.style.width = compositionViewBounds.width + 'px';
-      this.textarea.style.height = compositionViewBounds.height + 'px';
-      this.textarea.style.lineHeight = compositionViewBounds.height + 'px';
+      const compositionViewBounds = this._compositionView.getBoundingClientRect();
+      this._textarea.style.left = cursorLeft + 'px';
+      this._textarea.style.top = cursorTop + 'px';
+      this._textarea.style.width = compositionViewBounds.width + 'px';
+      this._textarea.style.height = compositionViewBounds.height + 'px';
+      this._textarea.style.lineHeight = compositionViewBounds.height + 'px';
     }
 
     if (!dontRecurse) {
       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 = '';
-  };
+  private _clearTextareaPosition(): void {
+    this._textarea.style.left = '';
+    this._textarea.style.top = '';
+  }
 }

src/EscapeSequenceParser.ts

@@ -0,0 +1,632 @@
+/**
+ * Copyright (c) 2018 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+import { ParserState, ParserAction, IParsingState, IDcsHandler, IEscapeSequenceParser } from './Types';
+import { IDisposable } from 'xterm';
+import { Disposable } from './common/Lifecycle';
+import { utf32ToString } from './core/input/TextDecoder';
+
+interface IHandlerCollection<T> {
+  [key: string]: T[];
+}
+
+type CsiHandler = (params: number[], collect: string) => boolean | void;
+type OscHandler = (data: string) => boolean | void;
+
+/**
+ * Returns an array filled with numbers between the low and high parameters (right exclusive).
+ * @param low The low number.
+ * @param high The high number.
+ */
+function r(low: number, high: number): number[] {
+  let c = high - low;
+  const arr = new Array(c);
+  while (c--) {
+    arr[c] = --high;
+  }
+  return arr;
+}
+
+/**
+ * Transition table for EscapeSequenceParser.
+ * NOTE: data in the underlying table is packed like this:
+ *   currentState << 8 | characterCode  -->  action << 4 | nextState
+ */
+export class TransitionTable {
+  public table: Uint8Array | number[];
+
+  constructor(length: number) {
+    this.table = (typeof Uint8Array === 'undefined')
+      ? new Array(length)
+      : new Uint8Array(length);
+  }
+
+  /**
+   * Add a transition to the transition table.
+   * @param code input character code
+   * @param state current parser state
+   * @param action parser action to be done
+   * @param next next parser state
+   */
+  add(code: number, state: number, action: number | null, next: number | null): void {
+    this.table[state << 8 | code] = ((action | 0) << 4) | ((next === undefined) ? state : next);
+  }
+
+  /**
+   * Add transitions for multiple input character codes.
+   * @param codes input character code array
+   * @param state current parser state
+   * @param action parser action to be done
+   * @param next next parser state
+   */
+  addMany(codes: number[], state: number, action: number | null, next: number | null): void {
+    for (let i = 0; i < codes.length; i++) {
+      this.add(codes[i], state, action, next);
+    }
+  }
+}
+
+
+/**
+ * Default definitions for the VT500_TRANSITION_TABLE.
+ */
+const PRINTABLES = r(0x20, 0x7f);
+const EXECUTABLES = r(0x00, 0x18);
+EXECUTABLES.push(0x19);
+EXECUTABLES.push.apply(EXECUTABLES, r(0x1c, 0x20));
+// Pseudo-character placeholder for printable non-ascii characters.
+const NON_ASCII_PRINTABLE = 0xA0;
+
+/**
+ * VT500 compatible transition table.
+ * Taken from https://vt100.net/emu/dec_ansi_parser.
+ */
+export const VT500_TRANSITION_TABLE = (function (): TransitionTable {
+  const table: TransitionTable = new TransitionTable(4095);
+
+  const states: number[] = r(ParserState.GROUND, ParserState.DCS_PASSTHROUGH + 1);
+  let state: any;
+
+  // table with default transition
+  for (state in states) {
+    // NOTE: table lookup is capped at 0xa0 in parse to keep the table small
+    for (let code = 0; code <= NON_ASCII_PRINTABLE; ++code) {
+      table.add(code, state, ParserAction.ERROR, ParserState.GROUND);
+    }
+  }
+  // printables
+  table.addMany(PRINTABLES, ParserState.GROUND, ParserAction.PRINT, ParserState.GROUND);
+  // global anywhere rules
+  for (state in states) {
+    table.addMany([0x18, 0x1a, 0x99, 0x9a], state, ParserAction.EXECUTE, ParserState.GROUND);
+    table.addMany(r(0x80, 0x90), state, ParserAction.EXECUTE, ParserState.GROUND);
+    table.addMany(r(0x90, 0x98), state, ParserAction.EXECUTE, ParserState.GROUND);
+    table.add(0x9c, state, ParserAction.IGNORE, ParserState.GROUND); // ST as terminator
+    table.add(0x1b, state, ParserAction.CLEAR, ParserState.ESCAPE);  // ESC
+    table.add(0x9d, state, ParserAction.OSC_START, ParserState.OSC_STRING);  // OSC
+    table.addMany([0x98, 0x9e, 0x9f], state, ParserAction.IGNORE, ParserState.SOS_PM_APC_STRING);
+    table.add(0x9b, state, ParserAction.CLEAR, ParserState.CSI_ENTRY);  // CSI
+    table.add(0x90, state, ParserAction.CLEAR, ParserState.DCS_ENTRY);  // DCS
+  }
+  // rules for executables and 7f
+  table.addMany(EXECUTABLES, ParserState.GROUND, ParserAction.EXECUTE, ParserState.GROUND);
+  table.addMany(EXECUTABLES, ParserState.ESCAPE, ParserAction.EXECUTE, ParserState.ESCAPE);
+  table.add(0x7f, ParserState.ESCAPE, ParserAction.IGNORE, ParserState.ESCAPE);
+  table.addMany(EXECUTABLES, ParserState.OSC_STRING, ParserAction.IGNORE, ParserState.OSC_STRING);
+  table.addMany(EXECUTABLES, ParserState.CSI_ENTRY, ParserAction.EXECUTE, ParserState.CSI_ENTRY);
+  table.add(0x7f, ParserState.CSI_ENTRY, ParserAction.IGNORE, ParserState.CSI_ENTRY);
+  table.addMany(EXECUTABLES, ParserState.CSI_PARAM, ParserAction.EXECUTE, ParserState.CSI_PARAM);
+  table.add(0x7f, ParserState.CSI_PARAM, ParserAction.IGNORE, ParserState.CSI_PARAM);
+  table.addMany(EXECUTABLES, ParserState.CSI_IGNORE, ParserAction.EXECUTE, ParserState.CSI_IGNORE);
+  table.addMany(EXECUTABLES, ParserState.CSI_INTERMEDIATE, ParserAction.EXECUTE, ParserState.CSI_INTERMEDIATE);
+  table.add(0x7f, ParserState.CSI_INTERMEDIATE, ParserAction.IGNORE, ParserState.CSI_INTERMEDIATE);
+  table.addMany(EXECUTABLES, ParserState.ESCAPE_INTERMEDIATE, ParserAction.EXECUTE, ParserState.ESCAPE_INTERMEDIATE);
+  table.add(0x7f, ParserState.ESCAPE_INTERMEDIATE, ParserAction.IGNORE, ParserState.ESCAPE_INTERMEDIATE);
+  // osc
+  table.add(0x5d, ParserState.ESCAPE, ParserAction.OSC_START, ParserState.OSC_STRING);
+  table.addMany(PRINTABLES, ParserState.OSC_STRING, ParserAction.OSC_PUT, ParserState.OSC_STRING);
+  table.add(0x7f, ParserState.OSC_STRING, ParserAction.OSC_PUT, ParserState.OSC_STRING);
+  table.addMany([0x9c, 0x1b, 0x18, 0x1a, 0x07], ParserState.OSC_STRING, ParserAction.OSC_END, ParserState.GROUND);
+  table.addMany(r(0x1c, 0x20), ParserState.OSC_STRING, ParserAction.IGNORE, ParserState.OSC_STRING);
+  // sos/pm/apc does nothing
+  table.addMany([0x58, 0x5e, 0x5f], ParserState.ESCAPE, ParserAction.IGNORE, ParserState.SOS_PM_APC_STRING);
+  table.addMany(PRINTABLES, ParserState.SOS_PM_APC_STRING, ParserAction.IGNORE, ParserState.SOS_PM_APC_STRING);
+  table.addMany(EXECUTABLES, ParserState.SOS_PM_APC_STRING, ParserAction.IGNORE, ParserState.SOS_PM_APC_STRING);
+  table.add(0x9c, ParserState.SOS_PM_APC_STRING, ParserAction.IGNORE, ParserState.GROUND);
+  table.add(0x7f, ParserState.SOS_PM_APC_STRING, ParserAction.IGNORE, ParserState.SOS_PM_APC_STRING);
+  // csi entries
+  table.add(0x5b, ParserState.ESCAPE, ParserAction.CLEAR, ParserState.CSI_ENTRY);
+  table.addMany(r(0x40, 0x7f), ParserState.CSI_ENTRY, ParserAction.CSI_DISPATCH, ParserState.GROUND);
+  table.addMany(r(0x30, 0x3a), ParserState.CSI_ENTRY, ParserAction.PARAM, ParserState.CSI_PARAM);
+  table.add(0x3b, ParserState.CSI_ENTRY, ParserAction.PARAM, ParserState.CSI_PARAM);
+  table.addMany([0x3c, 0x3d, 0x3e, 0x3f], ParserState.CSI_ENTRY, ParserAction.COLLECT, ParserState.CSI_PARAM);
+  table.addMany(r(0x30, 0x3a), ParserState.CSI_PARAM, ParserAction.PARAM, ParserState.CSI_PARAM);
+  table.add(0x3b, ParserState.CSI_PARAM, ParserAction.PARAM, ParserState.CSI_PARAM);
+  table.addMany(r(0x40, 0x7f), ParserState.CSI_PARAM, ParserAction.CSI_DISPATCH, ParserState.GROUND);
+  table.addMany([0x3a, 0x3c, 0x3d, 0x3e, 0x3f], ParserState.CSI_PARAM, ParserAction.IGNORE, ParserState.CSI_IGNORE);
+  table.addMany(r(0x20, 0x40), ParserState.CSI_IGNORE, ParserAction.IGNORE, ParserState.CSI_IGNORE);
+  table.add(0x7f, ParserState.CSI_IGNORE, ParserAction.IGNORE, ParserState.CSI_IGNORE);
+  table.addMany(r(0x40, 0x7f), ParserState.CSI_IGNORE, ParserAction.IGNORE, ParserState.GROUND);
+  table.add(0x3a, ParserState.CSI_ENTRY, ParserAction.IGNORE, ParserState.CSI_IGNORE);
+  table.addMany(r(0x20, 0x30), ParserState.CSI_ENTRY, ParserAction.COLLECT, ParserState.CSI_INTERMEDIATE);
+  table.addMany(r(0x20, 0x30), ParserState.CSI_INTERMEDIATE, ParserAction.COLLECT, ParserState.CSI_INTERMEDIATE);
+  table.addMany(r(0x30, 0x40), ParserState.CSI_INTERMEDIATE, ParserAction.IGNORE, ParserState.CSI_IGNORE);
+  table.addMany(r(0x40, 0x7f), ParserState.CSI_INTERMEDIATE, ParserAction.CSI_DISPATCH, ParserState.GROUND);
+  table.addMany(r(0x20, 0x30), ParserState.CSI_PARAM, ParserAction.COLLECT, ParserState.CSI_INTERMEDIATE);
+  // esc_intermediate
+  table.addMany(r(0x20, 0x30), ParserState.ESCAPE, ParserAction.COLLECT, ParserState.ESCAPE_INTERMEDIATE);
+  table.addMany(r(0x20, 0x30), ParserState.ESCAPE_INTERMEDIATE, ParserAction.COLLECT, ParserState.ESCAPE_INTERMEDIATE);
+  table.addMany(r(0x30, 0x7f), ParserState.ESCAPE_INTERMEDIATE, ParserAction.ESC_DISPATCH, ParserState.GROUND);
+  table.addMany(r(0x30, 0x50), ParserState.ESCAPE, ParserAction.ESC_DISPATCH, ParserState.GROUND);
+  table.addMany(r(0x51, 0x58), ParserState.ESCAPE, ParserAction.ESC_DISPATCH, ParserState.GROUND);
+  table.addMany([0x59, 0x5a, 0x5c], ParserState.ESCAPE, ParserAction.ESC_DISPATCH, ParserState.GROUND);
+  table.addMany(r(0x60, 0x7f), ParserState.ESCAPE, ParserAction.ESC_DISPATCH, ParserState.GROUND);
+  // dcs entry
+  table.add(0x50, ParserState.ESCAPE, ParserAction.CLEAR, ParserState.DCS_ENTRY);
+  table.addMany(EXECUTABLES, ParserState.DCS_ENTRY, ParserAction.IGNORE, ParserState.DCS_ENTRY);
+  table.add(0x7f, ParserState.DCS_ENTRY, ParserAction.IGNORE, ParserState.DCS_ENTRY);
+  table.addMany(r(0x1c, 0x20), ParserState.DCS_ENTRY, ParserAction.IGNORE, ParserState.DCS_ENTRY);
+  table.addMany(r(0x20, 0x30), ParserState.DCS_ENTRY, ParserAction.COLLECT, ParserState.DCS_INTERMEDIATE);
+  table.add(0x3a, ParserState.DCS_ENTRY, ParserAction.IGNORE, ParserState.DCS_IGNORE);
+  table.addMany(r(0x30, 0x3a), ParserState.DCS_ENTRY, ParserAction.PARAM, ParserState.DCS_PARAM);
+  table.add(0x3b, ParserState.DCS_ENTRY, ParserAction.PARAM, ParserState.DCS_PARAM);
+  table.addMany([0x3c, 0x3d, 0x3e, 0x3f], ParserState.DCS_ENTRY, ParserAction.COLLECT, ParserState.DCS_PARAM);
+  table.addMany(EXECUTABLES, ParserState.DCS_IGNORE, ParserAction.IGNORE, ParserState.DCS_IGNORE);
+  table.addMany(r(0x20, 0x80), ParserState.DCS_IGNORE, ParserAction.IGNORE, ParserState.DCS_IGNORE);
+  table.addMany(r(0x1c, 0x20), ParserState.DCS_IGNORE, ParserAction.IGNORE, ParserState.DCS_IGNORE);
+  table.addMany(EXECUTABLES, ParserState.DCS_PARAM, ParserAction.IGNORE, ParserState.DCS_PARAM);
+  table.add(0x7f, ParserState.DCS_PARAM, ParserAction.IGNORE, ParserState.DCS_PARAM);
+  table.addMany(r(0x1c, 0x20), ParserState.DCS_PARAM, ParserAction.IGNORE, ParserState.DCS_PARAM);
+  table.addMany(r(0x30, 0x3a), ParserState.DCS_PARAM, ParserAction.PARAM, ParserState.DCS_PARAM);
+  table.add(0x3b, ParserState.DCS_PARAM, ParserAction.PARAM, ParserState.DCS_PARAM);
+  table.addMany([0x3a, 0x3c, 0x3d, 0x3e, 0x3f], ParserState.DCS_PARAM, ParserAction.IGNORE, ParserState.DCS_IGNORE);
+  table.addMany(r(0x20, 0x30), ParserState.DCS_PARAM, ParserAction.COLLECT, ParserState.DCS_INTERMEDIATE);
+  table.addMany(EXECUTABLES, ParserState.DCS_INTERMEDIATE, ParserAction.IGNORE, ParserState.DCS_INTERMEDIATE);
+  table.add(0x7f, ParserState.DCS_INTERMEDIATE, ParserAction.IGNORE, ParserState.DCS_INTERMEDIATE);
+  table.addMany(r(0x1c, 0x20), ParserState.DCS_INTERMEDIATE, ParserAction.IGNORE, ParserState.DCS_INTERMEDIATE);
+  table.addMany(r(0x20, 0x30), ParserState.DCS_INTERMEDIATE, ParserAction.COLLECT, ParserState.DCS_INTERMEDIATE);
+  table.addMany(r(0x30, 0x40), ParserState.DCS_INTERMEDIATE, ParserAction.IGNORE, ParserState.DCS_IGNORE);
+  table.addMany(r(0x40, 0x7f), ParserState.DCS_INTERMEDIATE, ParserAction.DCS_HOOK, ParserState.DCS_PASSTHROUGH);
+  table.addMany(r(0x40, 0x7f), ParserState.DCS_PARAM, ParserAction.DCS_HOOK, ParserState.DCS_PASSTHROUGH);
+  table.addMany(r(0x40, 0x7f), ParserState.DCS_ENTRY, ParserAction.DCS_HOOK, ParserState.DCS_PASSTHROUGH);
+  table.addMany(EXECUTABLES, ParserState.DCS_PASSTHROUGH, ParserAction.DCS_PUT, ParserState.DCS_PASSTHROUGH);
+  table.addMany(PRINTABLES, ParserState.DCS_PASSTHROUGH, ParserAction.DCS_PUT, ParserState.DCS_PASSTHROUGH);
+  table.add(0x7f, ParserState.DCS_PASSTHROUGH, ParserAction.IGNORE, ParserState.DCS_PASSTHROUGH);
+  table.addMany([0x1b, 0x9c], ParserState.DCS_PASSTHROUGH, ParserAction.DCS_UNHOOK, ParserState.GROUND);
+  table.add(NON_ASCII_PRINTABLE, ParserState.OSC_STRING, ParserAction.OSC_PUT, ParserState.OSC_STRING);
+  return table;
+})();
+
+/**
+ * Dummy DCS handler as default fallback.
+ */
+class DcsDummy implements IDcsHandler {
+  hook(collect: string, params: number[], flag: number): void { }
+  put(data: Uint32Array, start: number, end: number): void { }
+  unhook(): void { }
+}
+
+/**
+ * EscapeSequenceParser.
+ * This class implements the ANSI/DEC compatible parser described by
+ * Paul Williams (https://vt100.net/emu/dec_ansi_parser).
+ * To implement custom ANSI compliant escape sequences it is not needed to
+ * alter this parser, instead consider registering a custom handler.
+ * For non ANSI compliant sequences change the transition table with
+ * the optional `transitions` contructor argument and
+ * reimplement the `parse` method.
+ * NOTE: The parameter element notation is currently not supported.
+ * TODO: implement error recovery hook via error handler return values
+ */
+export class EscapeSequenceParser extends Disposable implements IEscapeSequenceParser {
+  public initialState: number;
+  public currentState: number;
+
+  // buffers over several parse calls
+  protected _osc: string;
+  protected _params: number[];
+  protected _collect: string;
+
+  // handler lookup containers
+  protected _printHandler: (data: Uint32Array, start: number, end: number) => void;
+  protected _executeHandlers: any;
+  protected _csiHandlers: IHandlerCollection<CsiHandler>;
+  protected _escHandlers: any;
+  protected _oscHandlers: IHandlerCollection<OscHandler>;
+  protected _dcsHandlers: any;
+  protected _activeDcsHandler: IDcsHandler | null;
+  protected _errorHandler: (state: IParsingState) => IParsingState;
+
+  // fallback handlers
+  protected _printHandlerFb: (data: Uint32Array, start: number, end: number) => void;
+  protected _executeHandlerFb: (code: number) => void;
+  protected _csiHandlerFb: (collect: string, params: number[], flag: number) => void;
+  protected _escHandlerFb: (collect: string, flag: number) => void;
+  protected _oscHandlerFb: (identifier: number, data: string) => void;
+  protected _dcsHandlerFb: IDcsHandler;
+  protected _errorHandlerFb: (state: IParsingState) => IParsingState;
+
+  constructor(readonly TRANSITIONS: TransitionTable = VT500_TRANSITION_TABLE) {
+    super();
+
+    this.initialState = ParserState.GROUND;
+    this.currentState = this.initialState;
+    this._osc = '';
+    this._params = [0];
+    this._collect = '';
+
+    // set default fallback handlers and handler lookup containers
+    this._printHandlerFb = (data, start, end): void => { };
+    this._executeHandlerFb = (code: number): void => { };
+    this._csiHandlerFb = (collect: string, params: number[], flag: number): void => { };
+    this._escHandlerFb = (collect: string, flag: number): void => { };
+    this._oscHandlerFb = (identifier: number, data: string): void => { };
+    this._dcsHandlerFb = new DcsDummy();
+    this._errorHandlerFb = (state: IParsingState): IParsingState => state;
+    this._printHandler = this._printHandlerFb;
+    this._executeHandlers = Object.create(null);
+    this._csiHandlers = Object.create(null);
+    this._escHandlers = Object.create(null);
+    this._oscHandlers = Object.create(null);
+    this._dcsHandlers = Object.create(null);
+    this._activeDcsHandler = null;
+    this._errorHandler = this._errorHandlerFb;
+
+    // swallow 7bit ST (ESC+\)
+    this.setEscHandler('\\', () => {});
+  }
+
+  public dispose(): void {
+    this._printHandlerFb = null;
+    this._executeHandlerFb = null;
+    this._csiHandlerFb = null;
+    this._escHandlerFb = null;
+    this._oscHandlerFb = null;
+    this._dcsHandlerFb = null;
+    this._errorHandlerFb = null;
+    this._printHandler = null;
+    this._executeHandlers = null;
+    this._escHandlers = null;
+    this._csiHandlers = null;
+    this._oscHandlers = null;
+    this._dcsHandlers = null;
+    this._activeDcsHandler = null;
+    this._errorHandler = null;
+  }
+
+  setPrintHandler(callback: (data: Uint32Array, start: number, end: number) => void): void {
+    this._printHandler = callback;
+  }
+  clearPrintHandler(): void {
+    this._printHandler = this._printHandlerFb;
+  }
+
+  setExecuteHandler(flag: string, callback: () => void): void {
+    this._executeHandlers[flag.charCodeAt(0)] = callback;
+  }
+  clearExecuteHandler(flag: string): void {
+    if (this._executeHandlers[flag.charCodeAt(0)]) delete this._executeHandlers[flag.charCodeAt(0)];
+  }
+  setExecuteHandlerFallback(callback: (code: number) => void): void {
+    this._executeHandlerFb = callback;
+  }
+
+  addCsiHandler(flag: string, callback: CsiHandler): IDisposable {
+    const index = flag.charCodeAt(0);
+    if (this._csiHandlers[index] === undefined) {
+      this._csiHandlers[index] = [];
+    }
+    const handlerList = this._csiHandlers[index];
+    handlerList.push(callback);
+    return {
+      dispose: () => {
+        const handlerIndex = handlerList.indexOf(callback);
+        if (handlerIndex !== -1) {
+          handlerList.splice(handlerIndex, 1);
+        }
+      }
+    };
+  }
+  setCsiHandler(flag: string, callback: (params: number[], collect: string) => void): void {
+    this._csiHandlers[flag.charCodeAt(0)] = [callback];
+  }
+  clearCsiHandler(flag: string): void {
+    if (this._csiHandlers[flag.charCodeAt(0)]) delete this._csiHandlers[flag.charCodeAt(0)];
+  }
+  setCsiHandlerFallback(callback: (collect: string, params: number[], flag: number) => void): void {
+    this._csiHandlerFb = callback;
+  }
+
+  setEscHandler(collectAndFlag: string, callback: () => void): void {
+    this._escHandlers[collectAndFlag] = callback;
+  }
+  clearEscHandler(collectAndFlag: string): void {
+    if (this._escHandlers[collectAndFlag]) delete this._escHandlers[collectAndFlag];
+  }
+  setEscHandlerFallback(callback: (collect: string, flag: number) => void): void {
+    this._escHandlerFb = callback;
+  }
+
+  addOscHandler(ident: number, callback: (data: string) => boolean): IDisposable {
+    if (this._oscHandlers[ident] === undefined) {
+      this._oscHandlers[ident] = [];
+    }
+    const handlerList = this._oscHandlers[ident];
+    handlerList.push(callback);
+    return {
+      dispose: () => {
+        const handlerIndex = handlerList.indexOf(callback);
+        if (handlerIndex !== -1) {
+          handlerList.splice(handlerIndex, 1);
+        }
+      }
+    };
+  }
+  setOscHandler(ident: number, callback: (data: string) => void): void {
+    this._oscHandlers[ident] = [callback];
+  }
+  clearOscHandler(ident: number): void {
+    if (this._oscHandlers[ident]) delete this._oscHandlers[ident];
+  }
+  setOscHandlerFallback(callback: (identifier: number, data: string) => void): void {
+    this._oscHandlerFb = callback;
+  }
+
+  setDcsHandler(collectAndFlag: string, handler: IDcsHandler): void {
+    this._dcsHandlers[collectAndFlag] = handler;
+  }
+  clearDcsHandler(collectAndFlag: string): void {
+    if (this._dcsHandlers[collectAndFlag]) delete this._dcsHandlers[collectAndFlag];
+  }
+  setDcsHandlerFallback(handler: IDcsHandler): void {
+    this._dcsHandlerFb = handler;
+  }
+
+  setErrorHandler(callback: (state: IParsingState) => IParsingState): void {
+    this._errorHandler = callback;
+  }
+  clearErrorHandler(): void {
+    this._errorHandler = this._errorHandlerFb;
+  }
+
+  reset(): void {
+    this.currentState = this.initialState;
+    this._osc = '';
+    this._params = [0];
+    this._collect = '';
+    this._activeDcsHandler = null;
+  }
+
+  parse(data: Uint32Array, length: number): void {
+    let code = 0;
+    let transition = 0;
+    let error = false;
+    let currentState = this.currentState;
+    let print = -1;
+    let dcs = -1;
+    let osc = this._osc;
+    let collect = this._collect;
+    let params = this._params;
+    const table: Uint8Array | number[] = this.TRANSITIONS.table;
+    let dcsHandler: IDcsHandler | null = this._activeDcsHandler;
+    let callback: Function | null = null;
+
+    // process input string
+    for (let i = 0; i < length; ++i) {
+      code = data[i];
+
+      // shortcut for most chars (print action)
+      if (currentState === ParserState.GROUND && code > 0x1f && code < 0x80) {
+        print = (~print) ? print : i;
+        do i++;
+        while (i < length && data[i] > 0x1f && data[i] < 0x80);
+        i--;
+        continue;
+      }
+
+      // shortcut for CSI params
+      if (currentState === ParserState.CSI_PARAM && (code > 0x2f && code < 0x39)) {
+        params[params.length - 1] = params[params.length - 1] * 10 + code - 48;
+        continue;
+      }
+
+      // normal transition & action lookup
+      transition = table[currentState << 8 | (code < 0xa0 ? code : NON_ASCII_PRINTABLE)];
+      switch (transition >> 4) {
+        case ParserAction.PRINT:
+          print = (~print) ? print : i;
+          break;
+        case ParserAction.EXECUTE:
+          if (~print) {
+            this._printHandler(data, print, i);
+            print = -1;
+          }
+          callback = this._executeHandlers[code];
+          if (callback) callback();
+          else this._executeHandlerFb(code);
+          break;
+        case ParserAction.IGNORE:
+          // handle leftover print or dcs chars
+          if (~print) {
+            this._printHandler(data, print, i);
+            print = -1;
+          } else if (~dcs) {
+            dcsHandler.put(data, dcs, i);
+            dcs = -1;
+          }
+          break;
+        case ParserAction.ERROR:
+          // chars higher than 0x9f are handled by this action
+          // to keep the transition table small
+          if (code > 0x9f) {
+            switch (currentState) {
+              case ParserState.GROUND:
+                print = (~print) ? print : i;
+                break;
+              case ParserState.CSI_IGNORE:
+                transition |= ParserState.CSI_IGNORE;
+                break;
+              case ParserState.DCS_IGNORE:
+                transition |= ParserState.DCS_IGNORE;
+                break;
+              case ParserState.DCS_PASSTHROUGH:
+                dcs = (~dcs) ? dcs : i;
+                transition |= ParserState.DCS_PASSTHROUGH;
+                break;
+              default:
+                error = true;
+            }
+          } else {
+            error = true;
+          }
+          // if we end up here a real error happened
+          if (error) {
+            const inject: IParsingState = this._errorHandler(
+              {
+                position: i,
+                code,
+                currentState,
+                print,
+                dcs,
+                osc,
+                collect,
+                params,
+                abort: false
+              });
+            if (inject.abort) return;
+          // TODO: inject return values
+            error = false;
+          }
+          break;
+        case ParserAction.CSI_DISPATCH:
+          // Trigger CSI Handler
+          const handlers = this._csiHandlers[code];
+          let j = handlers ? handlers.length - 1 : -1;
+          for (; j >= 0; j--) {
+            // undefined or true means success and to stop bubbling
+            if (handlers[j](params, collect) !== false) {
+              break;
+            }
+          }
+          if (j < 0) {
+            this._csiHandlerFb(collect, params, code);
+          }
+          break;
+        case ParserAction.PARAM:
+          if (code === 0x3b) params.push(0);
+          else params[params.length - 1] = params[params.length - 1] * 10 + code - 48;
+          break;
+        case ParserAction.COLLECT:
+          collect += String.fromCharCode(code);
+          break;
+        case ParserAction.ESC_DISPATCH:
+          callback = this._escHandlers[collect + String.fromCharCode(code)];
+          if (callback) callback(collect, code);
+          else this._escHandlerFb(collect, code);
+          break;
+        case ParserAction.CLEAR:
+          if (~print) {
+            this._printHandler(data, print, i);
+            print = -1;
+          }
+          osc = '';
+          params = [0];
+          collect = '';
+          dcs = -1;
+          break;
+        case ParserAction.DCS_HOOK:
+          dcsHandler = this._dcsHandlers[collect + String.fromCharCode(code)];
+          if (!dcsHandler) dcsHandler = this._dcsHandlerFb;
+          dcsHandler.hook(collect, params, code);
+          break;
+        case ParserAction.DCS_PUT:
+          dcs = (~dcs) ? dcs : i;
+          break;
+        case ParserAction.DCS_UNHOOK:
+          if (dcsHandler) {
+            if (~dcs) dcsHandler.put(data, dcs, i);
+            dcsHandler.unhook();
+            dcsHandler = null;
+          }
+          if (code === 0x1b) transition |= ParserState.ESCAPE;
+          osc = '';
+          params = [0];
+          collect = '';
+          dcs = -1;
+          break;
+        case ParserAction.OSC_START:
+          if (~print) {
+            this._printHandler(data, print, i);
+            print = -1;
+          }
+          osc = '';
+          break;
+        case ParserAction.OSC_PUT:
+          for (let j = i + 1; ; j++) {
+            if (j >= length
+                || (code = data[j]) < 0x20
+                || (code > 0x7f && code <= 0x9f)) {
+              osc += utf32ToString(data, i, j);
+              i = j - 1;
+              break;
+            }
+          }
+          break;
+        case ParserAction.OSC_END:
+          if (osc && code !== 0x18 && code !== 0x1a) {
+            // NOTE: OSC subparsing is not part of the original parser
+            // we do basic identifier parsing here to offer a jump table for OSC as well
+            const idx = osc.indexOf(';');
+            if (idx === -1) {
+              this._oscHandlerFb(-1, osc);  // this is an error (malformed OSC)
+            } else {
+              // Note: NaN is not handled here
+              // either catch it with the fallback handler
+              // or with an explicit NaN OSC handler
+              const identifier = parseInt(osc.substring(0, idx));
+              const content = osc.substring(idx + 1);
+              // Trigger OSC Handler
+              const handlers = this._oscHandlers[identifier];
+              let j = handlers ? handlers.length - 1 : -1;
+              for (; j >= 0; j--) {
+                // undefined or true means success and to stop bubbling
+                if (handlers[j](content) !== false) {
+                  break;
+                }
+              }
+              if (j < 0) {
+                this._oscHandlerFb(identifier, content);
+              }
+            }
+          }
+          if (code === 0x1b) transition |= ParserState.ESCAPE;
+          osc = '';
+          params = [0];
+          collect = '';
+          dcs = -1;
+          break;
+      }
+      currentState = transition & 15;
+    }
+
+    // push leftover pushable buffers to terminal
+    if (currentState === ParserState.GROUND && ~print) {
+      this._printHandler(data, print, length);
+    } else if (currentState === ParserState.DCS_PASSTHROUGH && ~dcs && dcsHandler) {
+      dcsHandler.put(data, dcs, length);
+    }
+
+    // save non pushable buffers
+    this._osc = osc;
+    this._collect = collect;
+    this._params = params;
+
+    // save active dcs handler reference
+    this._activeDcsHandler = dcsHandler;
+
+    // save state
+    this.currentState = currentState;
+  }
+}

src/EventEmitter.ts

@@ -1,71 +0,0 @@
-/**
- * Copyright (c) 2017 The xterm.js authors. All rights reserved.
- * @license MIT
- */
-
-import { IEventEmitter, IListenerType } from './Interfaces';
-
-export class EventEmitter implements IEventEmitter {
-  private _events: {[type: string]: IListenerType[]};
-
-  constructor() {
-    // Restore the previous events if available, this will happen if the
-    // constructor is called multiple times on the same object (terminal reset).
-    this._events = this._events || {};
-  }
-
-  public on(type: string, listener: IListenerType): void {
-    this._events[type] = this._events[type] || [];
-    this._events[type].push(listener);
-  }
-
-  public off(type: string, listener: IListenerType): void {
-    if (!this._events[type]) {
-      return;
-    }
-
-    let obj = this._events[type];
-    let i = obj.length;
-
-    while (i--) {
-      if (obj[i] === listener || obj[i].listener === listener) {
-        obj.splice(i, 1);
-        return;
-      }
-    }
-  }
-
-  public removeAllListeners(type: string): void {
-    if (this._events[type]) {
-       delete this._events[type];
-    }
-  }
-
-  public once(type: string, listener: IListenerType): void {
-    function on(): void {
-      let args = Array.prototype.slice.call(arguments);
-      this.off(type, on);
-      listener.apply(this, args);
-    }
-    (<any>on).listener = listener;
-    this.on(type, on);
-  }
-
-  public emit(type: string, ...args: any[]): void {
-    if (!this._events[type]) {
-      return;
-    }
-    let obj = this._events[type];
-    for (let i = 0; i < obj.length; i++) {
-      obj[i].apply(this, args);
-    }
-  }
-
-  public listeners(type: string): IListenerType[] {
-    return this._events[type] || [];
-  }
-
-  protected destroy(): void {
-    this._events = {};
-  }
-}

src/InputHandler.api.ts

@@ -0,0 +1,251 @@
+/**
+ * Copyright (c) 2019 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+import * as puppeteer from 'puppeteer';
+import { assert } from 'chai';
+import { ITerminalOptions } from './Types';
+
+const APP = 'http://127.0.0.1:3000/test';
+
+let browser: puppeteer.Browser;
+let page: puppeteer.Page;
+const width = 800;
+const height = 600;
+
+describe('InputHandler Integration Tests', function(): void {
+  this.timeout(20000);
+
+  before(async function(): Promise<any> {
+    browser = await puppeteer.launch({
+      headless: process.argv.indexOf('--headless') !== -1,
+      slowMo: 80,
+      args: [`--window-size=${width},${height}`]
+    });
+    page = (await browser.pages())[0];
+    await page.setViewport({ width, height });
+    await page.goto(APP);
+    await openTerminal();
+  });
+
+  after(() => {
+    browser.close();
+  });
+
+  describe('CSI', () => {
+    beforeEach(async () => {
+      await page.evaluate(`window.term.reset()`);
+    });
+
+    it('ICH: Insert Ps (Blank) Character(s) (default = 1) - CSI Ps @', async function(): Promise<any> {
+      await page.evaluate(`
+        // Default
+        window.term.write('foo\\x1b[3D\\x1b[@\\n\\r')
+        // Explicit
+        window.term.write('bar\\x1b[3D\\x1b[4@')
+      `);
+      assert.deepEqual(await getLinesAsArray(2), [' foo', '    bar']);
+    });
+
+    it('CUU: Cursor Up Ps Times (default = 1) - CSI Ps A', async function(): Promise<any> {
+      await page.evaluate(`
+        // Default
+        window.term.write('\\n\\n\\n\\n\x1b[Aa')
+        // Explicit
+        window.term.write('\x1b[2Ab')
+      `);
+      assert.deepEqual(await getLinesAsArray(4), ['', ' b', '', 'a']);
+    });
+
+    it('CUD: Cursor Down Ps Times (default = 1) - CSI Ps B', async function(): Promise<any> {
+      await page.evaluate(`
+        // Default
+        window.term.write('\x1b[Ba')
+        // Explicit
+        window.term.write('\x1b[2Bb')
+      `);
+      assert.deepEqual(await getLinesAsArray(4), ['', 'a', '', ' b']);
+    });
+
+    it('CUF: Cursor Forward Ps Times (default = 1) - CSI Ps C', async function(): Promise<any> {
+      await page.evaluate(`
+        // Default
+        window.term.write('\x1b[Ca')
+        // Explicit
+        window.term.write('\x1b[2Cb')
+      `);
+      assert.deepEqual(await getLinesAsArray(1), [' a  b']);
+    });
+
+    it('CUB: Cursor Backward Ps Times (default = 1) - CSI Ps D', async function(): Promise<any> {
+      await page.evaluate(`
+        // Default
+        window.term.write('foo\x1b[Da')
+        // Explicit
+        window.term.write('\x1b[2Db')
+      `);
+      assert.deepEqual(await getLinesAsArray(1), ['fba']);
+    });
+
+    it('CNL: Cursor Next Line Ps Times (default = 1) - CSI Ps E', async function(): Promise<any> {
+      await page.evaluate(`
+        // Default
+        window.term.write('\x1b[Ea')
+        // Explicit
+        window.term.write('\x1b[2Eb')
+      `);
+      assert.deepEqual(await getLinesAsArray(4), ['', 'a', '', 'b']);
+    });
+
+    it('CPL: Cursor Preceding Line Ps Times (default = 1) - CSI Ps F', async function(): Promise<any> {
+      await page.evaluate(`
+        // Default
+        window.term.write('\\n\\n\\n\\n\x1b[Fa')
+        // Explicit
+        window.term.write('\x1b[2Fb')
+      `);
+      assert.deepEqual(await getLinesAsArray(5), ['', 'b', '', 'a', '']);
+    });
+
+    it('CHA: Cursor Character Absolute [column] (default = [row,1]) - CSI Ps G', async function(): Promise<any> {
+      await page.evaluate(`
+        // Default
+        window.term.write('foo\x1b[Ga')
+        // Explicit
+        window.term.write('\x1b[10Gb')
+      `);
+      assert.deepEqual(await getLinesAsArray(1), ['aoo      b']);
+    });
+
+    it('CUP: Cursor Position [row;column] (default = [1,1]) - CSI Ps ; Ps H', async function(): Promise<any> {
+      await page.evaluate(`
+        // Default
+        window.term.write('foo\x1b[Ha')
+        // Explicit
+        window.term.write('\x1b[3;3Hb')
+      `);
+      assert.deepEqual(await getLinesAsArray(3), ['aoo', '', '  b']);
+    });
+
+    it('CHT: Cursor Forward Tabulation Ps tab stops (default = 1) - CSI Ps I', async function(): Promise<any> {
+      await page.evaluate(`
+        // Default
+        window.term.write('\x1b[Ia')
+        // Explicit
+        window.term.write('\\n\\r\x1b[2Ib')
+      `);
+      assert.deepEqual(await getLinesAsArray(2), ['        a', '                b']);
+    });
+
+    it('ED: Erase in Display, VT100 - CSI Ps J', async function(): Promise<any> {
+      const fixture = 'abc\\n\\rdef\\n\\rghi\x1b[2;2H';
+      await page.evaluate(`
+        // Default: Erase Below
+        window.term.resize(5, 5);
+        window.term.write('${fixture}\x1b[J')
+      `);
+      assert.deepEqual(await getLinesAsArray(3), ['abc', 'd', '']);
+      await page.evaluate(`
+        // 0: Erase Below
+        window.term.reset()
+        window.term.write('${fixture}\x1b[0J')
+      `);
+      assert.deepEqual(await getLinesAsArray(3), ['abc', 'd', '']);
+      await page.evaluate(`
+        // 1: Erase Above
+        window.term.reset()
+        window.term.write('${fixture}\x1b[1J')
+      `);
+      assert.deepEqual(await getLinesAsArray(3), ['', '  f', 'ghi']);
+      await page.evaluate(`
+        // 2: Erase Saved Lines (scrollback)
+        window.term.reset()
+        window.term.write('1\\n2\\n3\\n4\\n5${fixture}\x1b[3J')
+      `);
+      assert.equal(await page.evaluate(`window.term.buffer.length`), 5);
+      assert.deepEqual(await getLinesAsArray(5), ['   4', '    5', 'abc', 'def', 'ghi']);
+    });
+
+    it('DECSED: Erase in Display, VT220 - CSI ? Ps J', async function(): Promise<any> {
+      const fixture = 'abc\\n\\rdef\\n\\rghi\x1b[2;2H';
+      await page.evaluate(`
+        // Default: Erase Below
+        window.term.resize(5, 5);
+        window.term.write('${fixture}\x1b[?J')
+      `);
+      assert.deepEqual(await getLinesAsArray(3), ['abc', 'd', '']);
+      await page.evaluate(`
+        // 0: Erase Below
+        window.term.reset()
+        window.term.write('${fixture}\x1b[?0J')
+      `);
+      assert.deepEqual(await getLinesAsArray(3), ['abc', 'd', '']);
+      await page.evaluate(`
+        // 1: Erase Above
+        window.term.reset()
+        window.term.write('${fixture}\x1b[?1J')
+      `);
+      assert.deepEqual(await getLinesAsArray(3), ['', '  f', 'ghi']);
+      await page.evaluate(`
+        // 2: Erase Saved Lines (scrollback)
+        window.term.reset()
+        window.term.write('1\\n2\\n3\\n4\\n5${fixture}\x1b[?3J')
+      `);
+      assert.equal(await page.evaluate(`window.term.buffer.length`), 5);
+      assert.deepEqual(await getLinesAsArray(5), ['   4', '    5', 'abc', 'def', 'ghi']);
+    });
+
+    describe('DSR: Device Status Report', () => {
+      it('Status Report - CSI 5 n', async function(): Promise<any> {
+        await page.evaluate(`
+          window.term.onData(e => window.result = e);
+          window.term.write('\\x1b[5n');
+        `);
+        assert.equal(await page.evaluate(`window.result`), '\x1b[0n');
+      });
+
+      it('Report Cursor Position (CPR) - CSI 6 n', async function(): Promise<any> {
+        await page.evaluate(`window.term.write('\\n\\nfoo')`);
+        assert.deepEqual(await page.evaluate(`
+          [window.term.buffer.cursorY, window.term.buffer.cursorX]
+        `), [2, 3]);
+        await page.evaluate(`
+          window.term.onData(e => window.result = e);
+          window.term.write('\\x1b[6n');
+        `);
+        assert.equal(await page.evaluate(`window.result`), '\x1b[3;4R');
+      });
+
+      it('Report Cursor Position (DECXCPR) - CSI ? 6 n', async function(): Promise<any> {
+        await page.evaluate(`window.term.write('\\n\\nfoo')`);
+        assert.deepEqual(await page.evaluate(`
+          [window.term.buffer.cursorY, window.term.buffer.cursorX]
+        `), [2, 3]);
+        await page.evaluate(`
+          window.term.onData(e => window.result = e);
+          window.term.write('\\x1b[?6n');
+        `);
+        assert.equal(await page.evaluate(`window.result`), '\x1b[?3;4R');
+      });
+    });
+  });
+});
+
+async function openTerminal(options: ITerminalOptions = {}): Promise<void> {
+  await page.evaluate(`window.term = new Terminal(${JSON.stringify(options)})`);
+  await page.evaluate(`window.term.open(document.querySelector('#terminal-container'))`);
+  if (options.rendererType === 'dom') {
+    await page.waitForSelector('.xterm-rows');
+  } else {
+    await page.waitForSelector('.xterm-text-layer');
+  }
+}
+
+async function getLinesAsArray(count: number, start: number = 0): Promise<string[]> {
+  let text = '';
+  for (let i = start; i < start + count; i++) {
+    text += `window.term.buffer.getLine(${i}).translateToString(true),`;
+  }
+  return await page.evaluate(`[${text}]`);
+}

src/InputHandler.test.ts

@@ -3,80 +3,542 @@
  * @license MIT
  */
 
-import { assert } from 'chai';
+import { assert, expect } from 'chai';
 import { InputHandler } from './InputHandler';
-import { MockInputHandlingTerminal } from './utils/TestUtils.test';
+import { MockInputHandlingTerminal, TestTerminal } from './TestUtils.test';
+import { Terminal } from './Terminal';
+import { IBufferLine } from './core/Types';
+import { CellData, Attributes, AttributeData, DEFAULT_ATTR_DATA } from './core/buffer/BufferLine';
 
 describe('InputHandler', () => {
   describe('save and restore cursor', () => {
-    let terminal = new MockInputHandlingTerminal();
+    const terminal = new MockInputHandlingTerminal();
     terminal.buffer.x = 1;
     terminal.buffer.y = 2;
-    let inputHandler = new InputHandler(terminal);
+    terminal.curAttrData.fg = 3;
+    const inputHandler = new InputHandler(terminal);
     // Save cursor position
     inputHandler.saveCursor([]);
     assert.equal(terminal.buffer.x, 1);
     assert.equal(terminal.buffer.y, 2);
+    assert.equal(terminal.curAttrData.fg, 3);
     // Change cursor position
     terminal.buffer.x = 10;
     terminal.buffer.y = 20;
+    terminal.curAttrData.fg = 30;
     // Restore cursor position
     inputHandler.restoreCursor([]);
     assert.equal(terminal.buffer.x, 1);
     assert.equal(terminal.buffer.y, 2);
+    assert.equal(terminal.curAttrData.fg, 3);
   });
   describe('setCursorStyle', () => {
     it('should call Terminal.setOption with correct params', () => {
-      let terminal = new MockInputHandlingTerminal();
-      let inputHandler = new InputHandler(terminal);
+      const terminal = new MockInputHandlingTerminal();
+      const inputHandler = new InputHandler(terminal);
+      const collect = ' ';
 
-      inputHandler.setCursorStyle([0]);
+      inputHandler.setCursorStyle([0], collect);
       assert.equal(terminal.options['cursorStyle'], 'block');
       assert.equal(terminal.options['cursorBlink'], true);
 
       terminal.options = {};
-      inputHandler.setCursorStyle([1]);
+      inputHandler.setCursorStyle([1], collect);
       assert.equal(terminal.options['cursorStyle'], 'block');
       assert.equal(terminal.options['cursorBlink'], true);
 
       terminal.options = {};
-      inputHandler.setCursorStyle([2]);
+      inputHandler.setCursorStyle([2], collect);
       assert.equal(terminal.options['cursorStyle'], 'block');
       assert.equal(terminal.options['cursorBlink'], false);
 
       terminal.options = {};
-      inputHandler.setCursorStyle([3]);
+      inputHandler.setCursorStyle([3], collect);
       assert.equal(terminal.options['cursorStyle'], 'underline');
       assert.equal(terminal.options['cursorBlink'], true);
 
       terminal.options = {};
-      inputHandler.setCursorStyle([4]);
+      inputHandler.setCursorStyle([4], collect);
       assert.equal(terminal.options['cursorStyle'], 'underline');
       assert.equal(terminal.options['cursorBlink'], false);
 
       terminal.options = {};
-      inputHandler.setCursorStyle([5]);
+      inputHandler.setCursorStyle([5], collect);
       assert.equal(terminal.options['cursorStyle'], 'bar');
       assert.equal(terminal.options['cursorBlink'], true);
 
       terminal.options = {};
-      inputHandler.setCursorStyle([6]);
+      inputHandler.setCursorStyle([6], collect);
       assert.equal(terminal.options['cursorStyle'], 'bar');
       assert.equal(terminal.options['cursorBlink'], false);
     });
   });
   describe('setMode', () => {
     it('should toggle Terminal.bracketedPasteMode', () => {
-      let terminal = new MockInputHandlingTerminal();
-      terminal.prefix = '?';
+      const terminal = new MockInputHandlingTerminal();
+      const collect = '?';
       terminal.bracketedPasteMode = false;
-      let inputHandler = new InputHandler(terminal);
+      const inputHandler = new InputHandler(terminal);
       // Set bracketed paste mode
-      inputHandler.setMode([2004]);
+      inputHandler.setMode([2004], collect);
       assert.equal(terminal.bracketedPasteMode, true);
       // Reset bracketed paste mode
-      inputHandler.resetMode([2004]);
+      inputHandler.resetMode([2004], collect);
       assert.equal(terminal.bracketedPasteMode, false);
     });
   });
+  describe('regression tests', function(): void {
+    function termContent(term: Terminal, trim: boolean): string[] {
+      const result = [];
+      for (let i = 0; i < term.rows; ++i) result.push(term.buffer.lines.get(i).translateToString(trim));
+      return result;
+    }
+
+    it('insertChars', function(): void {
+      const term = new Terminal();
+      const inputHandler = new InputHandler(term);
+
+      // insert some data in first and second line
+      inputHandler.parse(Array(term.cols - 9).join('a'));
+      inputHandler.parse('1234567890');
+      inputHandler.parse(Array(term.cols - 9).join('a'));
+      inputHandler.parse('1234567890');
+      const line1: IBufferLine = term.buffer.lines.get(0);
+      expect(line1.translateToString(false)).equals(Array(term.cols - 9).join('a') + '1234567890');
+
+      // insert one char from params = [0]
+      term.buffer.y = 0;
+      term.buffer.x = 70;
+      inputHandler.insertChars([0]);
+      expect(line1.translateToString(false)).equals(Array(term.cols - 9).join('a') + ' 123456789');
+
+      // insert one char from params = [1]
+      term.buffer.y = 0;
+      term.buffer.x = 70;
+      inputHandler.insertChars([1]);
+      expect(line1.translateToString(false)).equals(Array(term.cols - 9).join('a') + '  12345678');
+
+      // insert two chars from params = [2]
+      term.buffer.y = 0;
+      term.buffer.x = 70;
+      inputHandler.insertChars([2]);
+      expect(line1.translateToString(false)).equals(Array(term.cols - 9).join('a') + '    123456');
+
+      // insert 10 chars from params = [10]
+      term.buffer.y = 0;
+      term.buffer.x = 70;
+      inputHandler.insertChars([10]);
+      expect(line1.translateToString(false)).equals(Array(term.cols - 9).join('a') + '          ');
+      expect(line1.translateToString(true)).equals(Array(term.cols - 9).join('a'));
+    });
+    it('deleteChars', function(): void {
+      const term = new Terminal();
+      const inputHandler = new InputHandler(term);
+
+      // insert some data in first and second line
+      inputHandler.parse(Array(term.cols - 9).join('a'));
+      inputHandler.parse('1234567890');
+      inputHandler.parse(Array(term.cols - 9).join('a'));
+      inputHandler.parse('1234567890');
+      const line1: IBufferLine = term.buffer.lines.get(0);
+      expect(line1.translateToString(false)).equals(Array(term.cols - 9).join('a') + '1234567890');
+
+      // delete one char from params = [0]
+      term.buffer.y = 0;
+      term.buffer.x = 70;
+      inputHandler.deleteChars([0]);
+      expect(line1.translateToString(false)).equals(Array(term.cols - 9).join('a') + '234567890 ');
+      expect(line1.translateToString(true)).equals(Array(term.cols - 9).join('a') + '234567890');
+
+      // insert one char from params = [1]
+      term.buffer.y = 0;
+      term.buffer.x = 70;
+      inputHandler.deleteChars([1]);
+      expect(line1.translateToString(false)).equals(Array(term.cols - 9).join('a') + '34567890  ');
+      expect(line1.translateToString(true)).equals(Array(term.cols - 9).join('a') + '34567890');
+
+      // insert two chars from params = [2]
+      term.buffer.y = 0;
+      term.buffer.x = 70;
+      inputHandler.deleteChars([2]);
+      expect(line1.translateToString(false)).equals(Array(term.cols - 9).join('a') + '567890    ');
+      expect(line1.translateToString(true)).equals(Array(term.cols - 9).join('a') + '567890');
+
+      // insert 10 chars from params = [10]
+      term.buffer.y = 0;
+      term.buffer.x = 70;
+      inputHandler.deleteChars([10]);
+      expect(line1.translateToString(false)).equals(Array(term.cols - 9).join('a') + '          ');
+      expect(line1.translateToString(true)).equals(Array(term.cols - 9).join('a'));
+    });
+    it('eraseInLine', function(): void {
+      const term = new Terminal();
+      const inputHandler = new InputHandler(term);
+
+      // fill 6 lines to test 3 different states
+      inputHandler.parse(Array(term.cols + 1).join('a'));
+      inputHandler.parse(Array(term.cols + 1).join('a'));
+      inputHandler.parse(Array(term.cols + 1).join('a'));
+
+      // params[0] - right erase
+      term.buffer.y = 0;
+      term.buffer.x = 70;
+      inputHandler.eraseInLine([0]);
+      expect(term.buffer.lines.get(0).translateToString(false)).equals(Array(71).join('a') + '          ');
+
+      // params[1] - left erase
+      term.buffer.y = 1;
+      term.buffer.x = 70;
+      inputHandler.eraseInLine([1]);
+      expect(term.buffer.lines.get(1).translateToString(false)).equals(Array(71).join(' ') + ' aaaaaaaaa');
+
+      // params[1] - left erase
+      term.buffer.y = 2;
+      term.buffer.x = 70;
+      inputHandler.eraseInLine([2]);
+      expect(term.buffer.lines.get(2).translateToString(false)).equals(Array(term.cols + 1).join(' '));
+
+    });
+    it('eraseInDisplay', function(): void {
+      const term = new Terminal({cols: 80, rows: 7});
+      const inputHandler = new InputHandler(term);
+
+      // fill display with a's
+      for (let i = 0; i < term.rows; ++i) inputHandler.parse(Array(term.cols + 1).join('a'));
+
+      // params [0] - right and below erase
+      term.buffer.y = 5;
+      term.buffer.x = 40;
+      inputHandler.eraseInDisplay([0]);
+      expect(termContent(term, false)).eql([
+        Array(term.cols + 1).join('a'),
+        Array(term.cols + 1).join('a'),
+        Array(term.cols + 1).join('a'),
+        Array(term.cols + 1).join('a'),
+        Array(term.cols + 1).join('a'),
+        Array(40 + 1).join('a') + Array(term.cols - 40 + 1).join(' '),
+        Array(term.cols + 1).join(' ')
+      ]);
+      expect(termContent(term, true)).eql([
+        Array(term.cols + 1).join('a'),
+        Array(term.cols + 1).join('a'),
+        Array(term.cols + 1).join('a'),
+        Array(term.cols + 1).join('a'),
+        Array(term.cols + 1).join('a'),
+        Array(40 + 1).join('a'),
+        ''
+      ]);
+
+      // reset
+      term.buffer.y = 0;
+      term.buffer.x = 0;
+      for (let i = 0; i < term.rows; ++i) inputHandler.parse(Array(term.cols + 1).join('a'));
+
+      // params [1] - left and above
+      term.buffer.y = 5;
+      term.buffer.x = 40;
+      inputHandler.eraseInDisplay([1]);
+      expect(termContent(term, false)).eql([
+        Array(term.cols + 1).join(' '),
+        Array(term.cols + 1).join(' '),
+        Array(term.cols + 1).join(' '),
+        Array(term.cols + 1).join(' '),
+        Array(term.cols + 1).join(' '),
+        Array(41 + 1).join(' ') + Array(term.cols - 41 + 1).join('a'),
+        Array(term.cols + 1).join('a')
+      ]);
+      expect(termContent(term, true)).eql([
+        '',
+        '',
+        '',
+        '',
+        '',
+        Array(41 + 1).join(' ') + Array(term.cols - 41 + 1).join('a'),
+        Array(term.cols + 1).join('a')
+      ]);
+
+      // reset
+      term.buffer.y = 0;
+      term.buffer.x = 0;
+      for (let i = 0; i < term.rows; ++i) inputHandler.parse(Array(term.cols + 1).join('a'));
+
+      // params [2] - whole screen
+      term.buffer.y = 5;
+      term.buffer.x = 40;
+      inputHandler.eraseInDisplay([2]);
+      expect(termContent(term, false)).eql([
+        Array(term.cols + 1).join(' '),
+        Array(term.cols + 1).join(' '),
+        Array(term.cols + 1).join(' '),
+        Array(term.cols + 1).join(' '),
+        Array(term.cols + 1).join(' '),
+        Array(term.cols + 1).join(' '),
+        Array(term.cols + 1).join(' ')
+      ]);
+      expect(termContent(term, true)).eql([
+        '',
+        '',
+        '',
+        '',
+        '',
+        '',
+        ''
+      ]);
+
+      // reset and add a wrapped line
+      term.buffer.y = 0;
+      term.buffer.x = 0;
+      inputHandler.parse(Array(term.cols + 1).join('a')); // line 0
+      inputHandler.parse(Array(term.cols + 10).join('a')); // line 1 and 2
+      for (let i = 3; i < term.rows; ++i) inputHandler.parse(Array(term.cols + 1).join('a'));
+
+      // params[1] left and above with wrap
+      // confirm precondition that line 2 is wrapped
+      expect(term.buffer.lines.get(2).isWrapped).true;
+      term.buffer.y = 2;
+      term.buffer.x = 40;
+      inputHandler.eraseInDisplay([1]);
+      expect(term.buffer.lines.get(2).isWrapped).false;
+
+      // reset and add a wrapped line
+      term.buffer.y = 0;
+      term.buffer.x = 0;
+      inputHandler.parse(Array(term.cols + 1).join('a')); // line 0
+      inputHandler.parse(Array(term.cols + 10).join('a')); // line 1 and 2
+      for (let i = 3; i < term.rows; ++i) inputHandler.parse(Array(term.cols + 1).join('a'));
+
+      // params[1] left and above with wrap
+      // confirm precondition that line 2 is wrapped
+      expect(term.buffer.lines.get(2).isWrapped).true;
+      term.buffer.y = 1;
+      term.buffer.x = 90; // Cursor is beyond last column
+      inputHandler.eraseInDisplay([1]);
+      expect(term.buffer.lines.get(2).isWrapped).false;
+    });
+  });
+  it('convertEol setting', function(): void {
+    // not converting
+    const termNotConverting = new Terminal({cols: 15, rows: 10});
+    (termNotConverting as any)._inputHandler.parse('Hello\nWorld');
+    expect(termNotConverting.buffer.lines.get(0).translateToString(false)).equals('Hello          ');
+    expect(termNotConverting.buffer.lines.get(1).translateToString(false)).equals('     World     ');
+    expect(termNotConverting.buffer.lines.get(0).translateToString(true)).equals('Hello');
+    expect(termNotConverting.buffer.lines.get(1).translateToString(true)).equals('     World');
+
+    // converting
+    const termConverting = new Terminal({cols: 15, rows: 10, convertEol: true});
+    (termConverting as any)._inputHandler.parse('Hello\nWorld');
+    expect(termConverting.buffer.lines.get(0).translateToString(false)).equals('Hello          ');
+    expect(termConverting.buffer.lines.get(1).translateToString(false)).equals('World          ');
+    expect(termConverting.buffer.lines.get(0).translateToString(true)).equals('Hello');
+    expect(termConverting.buffer.lines.get(1).translateToString(true)).equals('World');
+  });
+  describe('print', () => {
+    it('should not cause an infinite loop (regression test)', () => {
+      const term = new Terminal();
+      const inputHandler = new InputHandler(term);
+      const container = new Uint32Array(10);
+      container[0] = 0x200B;
+      inputHandler.print(container, 0, 1);
+    });
+  });
+
+  describe('alt screen', () => {
+    let term: Terminal;
+    let handler: InputHandler;
+
+    beforeEach(() => {
+      term = new Terminal();
+      handler = new InputHandler(term);
+    });
+    it('should handle DECSET/DECRST 47 (alt screen buffer)', () => {
+      handler.parse('\x1b[?47h\r\n\x1b[31mJUNK\x1b[?47lTEST');
+      expect(term.buffer.translateBufferLineToString(0, true)).to.equal('');
+      expect(term.buffer.translateBufferLineToString(1, true)).to.equal('    TEST');
+      // Text color of 'TEST' should be red
+      expect((term.buffer.lines.get(1).loadCell(4, new CellData()).getFgColor())).to.equal(1);
+    });
+    it('should handle DECSET/DECRST 1047 (alt screen buffer)', () => {
+      handler.parse('\x1b[?1047h\r\n\x1b[31mJUNK\x1b[?1047lTEST');
+      expect(term.buffer.translateBufferLineToString(0, true)).to.equal('');
+      expect(term.buffer.translateBufferLineToString(1, true)).to.equal('    TEST');
+      // Text color of 'TEST' should be red
+      expect((term.buffer.lines.get(1).loadCell(4, new CellData()).getFgColor())).to.equal(1);
+    });
+    it('should handle DECSET/DECRST 1048 (alt screen cursor)', () => {
+      handler.parse('\x1b[?1048h\r\n\x1b[31mJUNK\x1b[?1048lTEST');
+      expect(term.buffer.translateBufferLineToString(0, true)).to.equal('TEST');
+      expect(term.buffer.translateBufferLineToString(1, true)).to.equal('JUNK');
+      // Text color of 'TEST' should be default
+      expect(term.buffer.lines.get(0).loadCell(0, new CellData()).fg).to.equal(DEFAULT_ATTR_DATA.fg);
+      // Text color of 'JUNK' should be red
+      expect((term.buffer.lines.get(1).loadCell(0, new CellData()).getFgColor())).to.equal(1);
+    });
+    it('should handle DECSET/DECRST 1049 (alt screen buffer+cursor)', () => {
+      handler.parse('\x1b[?1049h\r\n\x1b[31mJUNK\x1b[?1049lTEST');
+      expect(term.buffer.translateBufferLineToString(0, true)).to.equal('TEST');
+      expect(term.buffer.translateBufferLineToString(1, true)).to.equal('');
+      // Text color of 'TEST' should be default
+      expect(term.buffer.lines.get(0).loadCell(0, new CellData()).fg).to.equal(DEFAULT_ATTR_DATA.fg);
+    });
+    it('should handle DECSET/DECRST 1049 - maintains saved cursor for alt buffer', () => {
+      handler.parse('\x1b[?1049h\r\n\x1b[31m\x1b[s\x1b[?1049lTEST');
+      expect(term.buffer.translateBufferLineToString(0, true)).to.equal('TEST');
+      // Text color of 'TEST' should be default
+      expect(term.buffer.lines.get(0).loadCell(0, new CellData()).fg).to.equal(DEFAULT_ATTR_DATA.fg);
+      handler.parse('\x1b[?1049h\x1b[uTEST');
+      expect(term.buffer.translateBufferLineToString(1, true)).to.equal('TEST');
+      // Text color of 'TEST' should be red
+      expect((term.buffer.lines.get(1).loadCell(0, new CellData()).getFgColor())).to.equal(1);
+    });
+    it('should handle DECSET/DECRST 1049 - clears alt buffer with erase attributes', () => {
+      handler.parse('\x1b[42m\x1b[?1049h');
+      // Buffer should be filled with green background
+      expect(term.buffer.lines.get(20).loadCell(10, new CellData()).getBgColor()).to.equal(2);
+    });
+  });
+
+  describe('text attributes', () => {
+    let term: TestTerminal;
+    beforeEach(() => {
+      term = new TestTerminal();
+    });
+    it('bold', () => {
+      term.writeSync('\x1b[1m');
+      assert.equal(!!term.curAttrData.isBold(), true);
+      term.writeSync('\x1b[22m');
+      assert.equal(!!term.curAttrData.isBold(), false);
+    });
+    it('dim', () => {
+      term.writeSync('\x1b[2m');
+      assert.equal(!!term.curAttrData.isDim(), true);
+      term.writeSync('\x1b[22m');
+      assert.equal(!!term.curAttrData.isDim(), false);
+    });
+    it('italic', () => {
+      term.writeSync('\x1b[3m');
+      assert.equal(!!term.curAttrData.isItalic(), true);
+      term.writeSync('\x1b[23m');
+      assert.equal(!!term.curAttrData.isItalic(), false);
+    });
+    it('underline', () => {
+      term.writeSync('\x1b[4m');
+      assert.equal(!!term.curAttrData.isUnderline(), true);
+      term.writeSync('\x1b[24m');
+      assert.equal(!!term.curAttrData.isUnderline(), false);
+    });
+    it('blink', () => {
+      term.writeSync('\x1b[5m');
+      assert.equal(!!term.curAttrData.isBlink(), true);
+      term.writeSync('\x1b[25m');
+      assert.equal(!!term.curAttrData.isBlink(), false);
+    });
+    it('inverse', () => {
+      term.writeSync('\x1b[7m');
+      assert.equal(!!term.curAttrData.isInverse(), true);
+      term.writeSync('\x1b[27m');
+      assert.equal(!!term.curAttrData.isInverse(), false);
+    });
+    it('invisible', () => {
+      term.writeSync('\x1b[8m');
+      assert.equal(!!term.curAttrData.isInvisible(), true);
+      term.writeSync('\x1b[28m');
+      assert.equal(!!term.curAttrData.isInvisible(), false);
+    });
+    it('colormode palette 16', () => {
+      assert.equal(term.curAttrData.getFgColorMode(), 0); // DEFAULT
+      assert.equal(term.curAttrData.getBgColorMode(), 0); // DEFAULT
+      // lower 8 colors
+      for (let i = 0; i < 8; ++i) {
+        term.writeSync(`\x1b[${i + 30};${i + 40}m`);
+        assert.equal(term.curAttrData.getFgColorMode(), Attributes.CM_P16);
+        assert.equal(term.curAttrData.getFgColor(), i);
+        assert.equal(term.curAttrData.getBgColorMode(), Attributes.CM_P16);
+        assert.equal(term.curAttrData.getBgColor(), i);
+      }
+      // reset to DEFAULT
+      term.writeSync(`\x1b[39;49m`);
+      assert.equal(term.curAttrData.getFgColorMode(), 0);
+      assert.equal(term.curAttrData.getBgColorMode(), 0);
+    });
+    it('colormode palette 256', () => {
+      assert.equal(term.curAttrData.getFgColorMode(), 0); // DEFAULT
+      assert.equal(term.curAttrData.getBgColorMode(), 0); // DEFAULT
+      // lower 8 colors
+      for (let i = 0; i < 256; ++i) {
+        term.writeSync(`\x1b[38;5;${i};48;5;${i}m`);
+        assert.equal(term.curAttrData.getFgColorMode(), Attributes.CM_P256);
+        assert.equal(term.curAttrData.getFgColor(), i);
+        assert.equal(term.curAttrData.getBgColorMode(), Attributes.CM_P256);
+        assert.equal(term.curAttrData.getBgColor(), i);
+      }
+      // reset to DEFAULT
+      term.writeSync(`\x1b[39;49m`);
+      assert.equal(term.curAttrData.getFgColorMode(), 0);
+      assert.equal(term.curAttrData.getFgColor(), -1);
+      assert.equal(term.curAttrData.getBgColorMode(), 0);
+      assert.equal(term.curAttrData.getBgColor(), -1);
+    });
+    it('colormode RGB', () => {
+      assert.equal(term.curAttrData.getFgColorMode(), 0); // DEFAULT
+      assert.equal(term.curAttrData.getBgColorMode(), 0); // DEFAULT
+      term.writeSync(`\x1b[38;2;1;2;3;48;2;4;5;6m`);
+      assert.equal(term.curAttrData.getFgColorMode(), Attributes.CM_RGB);
+      assert.equal(term.curAttrData.getFgColor(), 1 << 16 | 2 << 8 | 3);
+      assert.deepEqual(AttributeData.toColorRGB(term.curAttrData.getFgColor()), [1, 2, 3]);
+      assert.equal(term.curAttrData.getBgColorMode(), Attributes.CM_RGB);
+      assert.deepEqual(AttributeData.toColorRGB(term.curAttrData.getBgColor()), [4, 5, 6]);
+      // reset to DEFAULT
+      term.writeSync(`\x1b[39;49m`);
+      assert.equal(term.curAttrData.getFgColorMode(), 0);
+      assert.equal(term.curAttrData.getFgColor(), -1);
+      assert.equal(term.curAttrData.getBgColorMode(), 0);
+      assert.equal(term.curAttrData.getBgColor(), -1);
+    });
+    it('colormode transition RGB to 256', () => {
+      // enter RGB for FG and BG
+      term.writeSync(`\x1b[38;2;1;2;3;48;2;4;5;6m`);
+      // enter 256 for FG and BG
+      term.writeSync(`\x1b[38;5;255;48;5;255m`);
+      assert.equal(term.curAttrData.getFgColorMode(), Attributes.CM_P256);
+      assert.equal(term.curAttrData.getFgColor(), 255);
+      assert.equal(term.curAttrData.getBgColorMode(), Attributes.CM_P256);
+      assert.equal(term.curAttrData.getBgColor(), 255);
+    });
+    it('colormode transition RGB to 16', () => {
+      // enter RGB for FG and BG
+      term.writeSync(`\x1b[38;2;1;2;3;48;2;4;5;6m`);
+      // enter 16 for FG and BG
+      term.writeSync(`\x1b[37;47m`);
+      assert.equal(term.curAttrData.getFgColorMode(), Attributes.CM_P16);
+      assert.equal(term.curAttrData.getFgColor(), 7);
+      assert.equal(term.curAttrData.getBgColorMode(), Attributes.CM_P16);
+      assert.equal(term.curAttrData.getBgColor(), 7);
+    });
+    it('colormode transition 16 to 256', () => {
+      // enter 16 for FG and BG
+      term.writeSync(`\x1b[37;47m`);
+      // enter 256 for FG and BG
+      term.writeSync(`\x1b[38;5;255;48;5;255m`);
+      assert.equal(term.curAttrData.getFgColorMode(), Attributes.CM_P256);
+      assert.equal(term.curAttrData.getFgColor(), 255);
+      assert.equal(term.curAttrData.getBgColorMode(), Attributes.CM_P256);
+      assert.equal(term.curAttrData.getBgColor(), 255);
+    });
+    it('colormode transition 256 to 16', () => {
+      // enter 256 for FG and BG
+      term.writeSync(`\x1b[38;5;255;48;5;255m`);
+      // enter 16 for FG and BG
+      term.writeSync(`\x1b[37;47m`);
+      assert.equal(term.curAttrData.getFgColorMode(), Attributes.CM_P16);
+      assert.equal(term.curAttrData.getFgColor(), 7);
+      assert.equal(term.curAttrData.getBgColorMode(), Attributes.CM_P16);
+      assert.equal(term.curAttrData.getBgColor(), 7);
+    });
+    it('should zero missing RGB values', () => {
+      term.writeSync(`\x1b[38;2;1;2;3m`);
+      term.writeSync(`\x1b[38;2;5m`);
+      assert.deepEqual(AttributeData.toColorRGB(term.curAttrData.getFgColor()), [5, 0, 0]);
+    });
+  });
 });

src/Interfaces.ts

@@ -1,354 +0,0 @@
-/**
- * Copyright (c) 2017 The xterm.js authors. All rights reserved.
- * @license MIT
- */
-
-import { ILinkMatcherOptions } from './Interfaces';
-import { LinkMatcherHandler, LinkMatcherValidationCallback, Charset, LineData } from './Types';
-import { IColorSet, IRenderer } from './renderer/Interfaces';
-import { IMouseZoneManager } from './input/Interfaces';
-
-export interface IBrowser {
-  isNode: boolean;
-  userAgent: string;
-  platform: string;
-  isFirefox: boolean;
-  isMSIE: boolean;
-  isMac: boolean;
-  isIpad: boolean;
-  isIphone: boolean;
-  isMSWindows: boolean;
-}
-
-export interface IBufferAccessor {
-  buffer: IBuffer;
-}
-
-export interface IElementAccessor {
-  element: HTMLElement;
-}
-
-export interface ILinkifierAccessor {
-  linkifier: ILinkifier;
-}
-
-export interface ITerminal extends ILinkifierAccessor, IBufferAccessor, IElementAccessor, IEventEmitter {
-  selectionManager: ISelectionManager;
-  charMeasure: ICharMeasure;
-  textarea: HTMLTextAreaElement;
-  renderer: IRenderer;
-  rows: number;
-  cols: number;
-  browser: IBrowser;
-  writeBuffer: string[];
-  cursorHidden: boolean;
-  cursorState: number;
-  defAttr: number;
-  options: ITerminalOptions;
-  buffers: IBufferSet;
-  isFocused: boolean;
-  mouseHelper: IMouseHelper;
-  bracketedPasteMode: boolean;
-
-  /**
-   * Emit the 'data' event and populate the given data.
-   * @param data The data to populate in the event.
-   */
-  handler(data: string): void;
-  scrollLines(disp: number, suppressScrollEvent?: boolean): void;
-  cancel(ev: Event, force?: boolean): boolean | void;
-  log(text: string): void;
-  reset(): void;
-  showCursor(): void;
-  blankLine(cur?: boolean, isWrapped?: boolean, cols?: number): LineData;
-  refresh(start: number, end: number): void;
-}
-
-/**
- * This interface encapsulates everything needed from the Terminal by the
- * InputHandler. This cleanly separates the large amount of methods needed by
- * InputHandler cleanly from the ITerminal interface.
- */
-export interface IInputHandlingTerminal extends IEventEmitter {
-  element: HTMLElement;
-  options: ITerminalOptions;
-  cols: number;
-  rows: number;
-  charset: Charset;
-  gcharset: number;
-  glevel: number;
-  charsets: Charset[];
-  applicationKeypad: boolean;
-  applicationCursor: boolean;
-  originMode: boolean;
-  insertMode: boolean;
-  wraparoundMode: boolean;
-  bracketedPasteMode: boolean;
-  defAttr: number;
-  curAttr: number;
-  prefix: string;
-  savedCols: number;
-  x10Mouse: boolean;
-  vt200Mouse: boolean;
-  normalMouse: boolean;
-  mouseEvents: boolean;
-  sendFocus: boolean;
-  utfMouse: boolean;
-  sgrMouse: boolean;
-  urxvtMouse: boolean;
-  cursorHidden: boolean;
-
-  buffers: IBufferSet;
-  buffer: IBuffer;
-  viewport: IViewport;
-  selectionManager: ISelectionManager;
-
-  bell(): void;
-  focus(): void;
-  convertEol: boolean;
-  updateRange(y: number): void;
-  scroll(isWrapped?: boolean): void;
-  setgLevel(g: number): void;
-  eraseAttr(): number;
-  eraseRight(x: number, y: number): void;
-  eraseLine(y: number): void;
-  eraseLeft(x: number, y: number): void;
-  blankLine(cur?: boolean, isWrapped?: boolean): LineData;
-  is(term: string): boolean;
-  send(data: string): void;
-  setgCharset(g: number, charset: Charset): void;
-  resize(x: number, y: number): void;
-  log(text: string, data?: any): void;
-  reset(): void;
-  showCursor(): void;
-  refresh(start: number, end: number): void;
-  matchColor(r1: number, g1: number, b1: number): number;
-  error(text: string, data?: any): void;
-  setOption(key: string, value: any): void;
-}
-
-export interface ITerminalOptions {
-  bellSound?: string;
-  bellStyle?: string;
-  cancelEvents?: boolean;
-  cols?: number;
-  convertEol?: boolean;
-  cursorBlink?: boolean;
-  cursorStyle?: string;
-  debug?: boolean;
-  disableStdin?: boolean;
-  enableBold?: boolean;
-  fontSize?: number;
-  fontFamily?: string;
-  handler?: (data: string) => void;
-  letterSpacing?: number;
-  lineHeight?: number;
-  rows?: number;
-  screenKeys?: boolean;
-  scrollback?: number;
-  tabStopWidth?: number;
-  termName?: string;
-  theme?: ITheme;
-  useFlowControl?: boolean;
-}
-
-export interface IBuffer {
-  lines: ICircularList<LineData>;
-  ydisp: number;
-  ybase: number;
-  y: number;
-  x: number;
-  tabs: any;
-  scrollBottom: number;
-  scrollTop: number;
-  savedY: number;
-  savedX: number;
-  isCursorInViewport: boolean;
-  translateBufferLineToString(lineIndex: number, trimRight: boolean, startCol?: number, endCol?: number): string;
-  nextStop(x?: number): number;
-  prevStop(x?: number): number;
-}
-
-export interface IBufferSet {
-  alt: IBuffer;
-  normal: IBuffer;
-  active: IBuffer;
-
-  activateNormalBuffer(): void;
-  activateAltBuffer(): void;
-}
-
-export interface IMouseHelper {
-  getCoords(event: {pageX: number, pageY: number}, element: HTMLElement, charMeasure: ICharMeasure, lineHeight: number, colCount: number, rowCount: number, isSelection?: boolean): [number, number];
-  getRawByteCoords(event: MouseEvent, element: HTMLElement, charMeasure: ICharMeasure, lineHeight: number, colCount: number, rowCount: number): { x: number, y: number };
-}
-
-export interface IViewport {
-  syncScrollArea(): void;
-  onWheel(ev: WheelEvent): void;
-  onTouchStart(ev: TouchEvent): void;
-  onTouchMove(ev: TouchEvent): void;
-  onThemeChanged(colors: IColorSet): void;
-}
-
-export interface ISelectionManager {
-  selectionText: string;
-  selectionStart: [number, number];
-  selectionEnd: [number, number];
-
-  disable(): void;
-  enable(): void;
-  setBuffer(buffer: IBuffer): void;
-  setSelection(row: number, col: number, length: number): void;
-}
-
-export interface ICompositionHelper {
-  compositionstart(): void;
-  compositionupdate(ev: CompositionEvent): void;
-  compositionend(): void;
-  updateCompositionElements(dontRecurse?: boolean): void;
-  keydown(ev: KeyboardEvent): boolean;
-}
-
-export interface ICharMeasure {
-  width: number;
-  height: number;
-  measure(options: ITerminalOptions): void;
-}
-
-export interface ILinkifier extends IEventEmitter {
-  attachToDom(mouseZoneManager: IMouseZoneManager): void;
-  linkifyRows(start: number, end: number): void;
-  setHypertextLinkHandler(handler: LinkMatcherHandler): void;
-  setHypertextValidationCallback(callback: LinkMatcherValidationCallback): void;
-  registerLinkMatcher(regex: RegExp, handler: LinkMatcherHandler, options?: ILinkMatcherOptions): number;
-  deregisterLinkMatcher(matcherId: number): boolean;
-}
-
-export interface ICircularList<T> extends IEventEmitter {
-  length: number;
-  maxLength: number;
-  forEach: (callbackfn: (value: T, index: number) => void) => void;
-
-  get(index: number): T;
-  set(index: number, value: T): void;
-  push(value: T): void;
-  pop(): T;
-  splice(start: number, deleteCount: number, ...items: T[]): void;
-  trimStart(count: number): void;
-  shiftElements(start: number, count: number, offset: number): void;
-}
-
-export interface IEventEmitter {
-  on(type: string, listener: IListenerType): void;
-  off(type: string, listener: IListenerType): void;
-  emit(type: string, data?: any): void;
-}
-
-export interface IListenerType {
-    (data?: any): void;
-    listener?: (data?: any) => void;
-};
-
-export interface ILinkMatcherOptions {
-  /**
-   * The index of the link from the regex.match(text) call. This defaults to 0
-   * (for regular expressions without capture groups).
-   */
-  matchIndex?: number;
-  /**
-   * A callback that validates an individual link, returning true if valid and
-   * false if invalid.
-   */
-  validationCallback?: LinkMatcherValidationCallback;
-  /**
-   * A callback that fires when the mouse hovers over a link.
-   */
-  tooltipCallback?: LinkMatcherHandler;
-  /**
-   * A callback that fires when the mouse leaves a link that was hovered.
-   */
-  leaveCallback?: () => void;
-  /**
-   * The priority of the link matcher, this defines the order in which the link
-   * matcher is evaluated relative to others, from highest to lowest. The
-   * default value is 0.
-   */
-  priority?: number;
-}
-
-/**
- * Handles actions generated by the parser.
- */
-export interface IInputHandler {
-  addChar(char: string, code: number): void;
-
-  /** C0 BEL */ bell(): void;
-  /** C0 LF */ lineFeed(): void;
-  /** C0 CR */ carriageReturn(): void;
-  /** C0 BS */ backspace(): void;
-  /** C0 HT */ tab(): void;
-  /** C0 SO */ shiftOut(): void;
-  /** C0 SI */ shiftIn(): void;
-
-  /** CSI @ */ insertChars(params?: number[]): void;
-  /** CSI A */ cursorUp(params?: number[]): void;
-  /** CSI B */ cursorDown(params?: number[]): void;
-  /** CSI C */ cursorForward(params?: number[]): void;
-  /** CSI D */ cursorBackward(params?: number[]): void;
-  /** CSI E */ cursorNextLine(params?: number[]): void;
-  /** CSI F */ cursorPrecedingLine(params?: number[]): void;
-  /** CSI G */ cursorCharAbsolute(params?: number[]): void;
-  /** CSI H */ cursorPosition(params?: number[]): void;
-  /** CSI I */ cursorForwardTab(params?: number[]): void;
-  /** CSI J */ eraseInDisplay(params?: number[]): void;
-  /** CSI K */ eraseInLine(params?: number[]): void;
-  /** CSI L */ insertLines(params?: number[]): void;
-  /** CSI M */ deleteLines(params?: number[]): void;
-  /** CSI P */ deleteChars(params?: number[]): void;
-  /** CSI S */ scrollUp(params?: number[]): void;
-  /** CSI T */ scrollDown(params?: number[]): void;
-  /** CSI X */ eraseChars(params?: number[]): void;
-  /** CSI Z */ cursorBackwardTab(params?: number[]): void;
-  /** CSI ` */ charPosAbsolute(params?: number[]): void;
-  /** CSI a */ HPositionRelative(params?: number[]): void;
-  /** CSI b */ repeatPrecedingCharacter(params?: number[]): void;
-  /** CSI c */ sendDeviceAttributes(params?: number[]): void;
-  /** CSI d */ linePosAbsolute(params?: number[]): void;
-  /** CSI e */ VPositionRelative(params?: number[]): void;
-  /** CSI f */ HVPosition(params?: number[]): void;
-  /** CSI g */ tabClear(params?: number[]): void;
-  /** CSI h */ setMode(params?: number[]): void;
-  /** CSI l */ resetMode(params?: number[]): void;
-  /** CSI m */ charAttributes(params?: number[]): void;
-  /** CSI n */ deviceStatus(params?: number[]): void;
-  /** CSI p */ softReset(params?: number[]): void;
-  /** CSI q */ setCursorStyle(params?: number[]): void;
-  /** CSI r */ setScrollRegion(params?: number[]): void;
-  /** CSI s */ saveCursor(params?: number[]): void;
-  /** CSI u */ restoreCursor(params?: number[]): void;
-}
-
-export interface ITheme {
-  foreground?: string;
-  background?: string;
-  cursor?: string;
-  cursorAccent?: string;
-  selection?: string;
-  black?: string;
-  red?: string;
-  green?: string;
-  yellow?: string;
-  blue?: string;
-  magenta?: string;
-  cyan?: string;
-  white?: string;
-  brightBlack?: string;
-  brightRed?: string;
-  brightGreen?: string;
-  brightYellow?: string;
-  brightBlue?: string;
-  brightMagenta?: string;
-  brightCyan?: string;
-  brightWhite?: string;
-}

src/Linkifier.test.ts

@@ -4,24 +4,26 @@
  */
 
 import { assert } from 'chai';
-import { ITerminal, ILinkifier, IBuffer, IBufferAccessor, IElementAccessor } from './Interfaces';
+import { IMouseZoneManager, IMouseZone, ILinkMatcher, ITerminal } from './Types';
+import { IBufferLine } from './core/Types';
 import { Linkifier } from './Linkifier';
-import { LinkMatcher, LineData } from './Types';
-import { IMouseZoneManager, IMouseZone } from './input/Interfaces';
-import { MockBuffer } from './utils/TestUtils.test';
-import { CircularList } from './utils/CircularList';
+import { MockBuffer, MockTerminal, TestTerminal } from './TestUtils.test';
+import { CircularList } from './common/CircularList';
+import { BufferLine, CellData } from './core/buffer/BufferLine';
 
 class TestLinkifier extends Linkifier {
-  constructor(_terminal: IBufferAccessor & IElementAccessor) {
-    super(_terminal);
-    Linkifier.TIME_BEFORE_LINKIFY = 0;
+  constructor(terminal: ITerminal) {
+    super(terminal);
+    (<any>Linkifier).TIME_BEFORE_LINKIFY = 0;
   }
 
-  public get linkMatchers(): LinkMatcher[] { return this._linkMatchers; }
+  public get linkMatchers(): ILinkMatcher[] { return this._linkMatchers; }
   public linkifyRows(): void { super.linkifyRows(0, this._terminal.buffer.lines.length - 1); }
 }
 
 class TestMouseZoneManager implements IMouseZoneManager {
+  dispose(): void {
+  }
   public clears: number = 0;
   public zones: IMouseZone[] = [];
   add(zone: IMouseZone): void {
@@ -33,25 +35,25 @@ class TestMouseZoneManager implements IMouseZoneManager {
 }
 
 describe('Linkifier', () => {
-  let terminal: IBufferAccessor & IElementAccessor;
+  let terminal: ITerminal;
   let linkifier: TestLinkifier;
   let mouseZoneManager: TestMouseZoneManager;
 
   beforeEach(() => {
-    terminal = {
-      buffer: new MockBuffer(),
-      element: <HTMLElement>{}
-    };
-    terminal.buffer.lines = new CircularList<LineData>(20);
+    terminal = new MockTerminal();
+    (terminal as any).cols = 100;
+    (terminal as any).rows = 10;
+    terminal.buffer = new MockBuffer();
+    (<MockBuffer>terminal.buffer).setLines(new CircularList<IBufferLine>(20));
     terminal.buffer.ydisp = 0;
     linkifier = new TestLinkifier(terminal);
     mouseZoneManager = new TestMouseZoneManager();
   });
 
-  function stringToRow(text: string): LineData {
-    let result: LineData = [];
+  function stringToRow(text: string): IBufferLine {
+    const result = new BufferLine(text.length);
     for (let i = 0; i < text.length; i++) {
-      result.push([0, text.charAt(i), 1, text.charCodeAt(i)]);
+      result.setCell(i, CellData.fromCharData([0, text.charAt(i), 1, text.charCodeAt(i)]));
     }
     return result;
   }
@@ -60,20 +62,10 @@ describe('Linkifier', () => {
     terminal.buffer.lines.push(stringToRow(text));
   }
 
-  function assertLinkifiesEntireRow(uri: string, done: MochaDone): void {
-    addRow(uri);
-    linkifier.linkifyRows();
-    setTimeout(() => {
-      assert.equal(mouseZoneManager.zones[0].x1, 1);
-      assert.equal(mouseZoneManager.zones[0].x2, uri.length + 1);
-      assert.equal(mouseZoneManager.zones[0].y, terminal.buffer.lines.length);
-      done();
-    }, 0);
-  }
-
   function assertLinkifiesRow(rowText: string, linkMatcherRegex: RegExp, links: {x: number, length: number}[], done: MochaDone): void {
     addRow(rowText);
     linkifier.registerLinkMatcher(linkMatcherRegex, () => {});
+    (terminal as any).rows = terminal.buffer.lines.length - 1;
     linkifier.linkifyRows();
     // Allow linkify to happen
     setTimeout(() => {
@@ -81,7 +73,25 @@ describe('Linkifier', () => {
       links.forEach((l, i) => {
         assert.equal(mouseZoneManager.zones[i].x1, l.x + 1);
         assert.equal(mouseZoneManager.zones[i].x2, l.x + l.length + 1);
-        assert.equal(mouseZoneManager.zones[i].y, terminal.buffer.lines.length);
+        assert.equal(mouseZoneManager.zones[i].y1, terminal.buffer.lines.length);
+        assert.equal(mouseZoneManager.zones[i].y2, terminal.buffer.lines.length);
+      });
+      done();
+    }, 0);
+  }
+
+  function assertLinkifiesMultiLineLink(rowText: string, linkMatcherRegex: RegExp, links: {x1: number, y1: number, x2: number, y2: number}[], done: MochaDone): void {
+    addRow(rowText);
+    linkifier.registerLinkMatcher(linkMatcherRegex, () => {});
+    linkifier.linkifyRows();
+    // Allow linkify to happen
+    setTimeout(() => {
+      assert.equal(mouseZoneManager.zones.length, links.length);
+      links.forEach((l, i) => {
+        assert.equal(mouseZoneManager.zones[i].x1, l.x1 + 1);
+        assert.equal(mouseZoneManager.zones[i].x2, l.x2 + 1);
+        assert.equal(mouseZoneManager.zones[i].y1, l.y1 + 1);
+        assert.equal(mouseZoneManager.zones[i].y2, l.y2 + 1);
       });
       done();
     }, 0);
@@ -102,12 +112,6 @@ describe('Linkifier', () => {
       linkifier.attachToDom(mouseZoneManager);
     });
 
-    describe('http links', () => {
-      it('should allow ~ character in URI path', (done) => {
-        assertLinkifiesEntireRow('http://foo.com/a~b#c~d?e~f', done);
-      });
-    });
-
     describe('link matcher', () => {
       it('should match a single link', done => {
         assertLinkifiesRow('foo', /foo/, [{x: 0, length: 3}], done);
@@ -136,6 +140,24 @@ describe('Linkifier', () => {
         // character (U+1F537) which caused the path to be duplicated. See #642.
         assertLinkifiesRow('echo \'🔷foo\'', /foo/, [{x: 8, length: 3}], done);
       });
+      describe('multi-line links', () => {
+        it('should match links that start on line 1/2 of a wrapped line and end on the last character of line 1/2', done => {
+          (terminal as any).cols = 4;
+          assertLinkifiesMultiLineLink('12345', /1234/, [{x1: 0, x2: 4, y1: 0, y2: 0}], done);
+        });
+        it('should match links that start on line 1/2 of a wrapped line and wrap to line 2/2', done => {
+          (terminal as any).cols = 4;
+          assertLinkifiesMultiLineLink('12345', /12345/, [{x1: 0, x2: 1, y1: 0, y2: 1}], done);
+        });
+        it('should match links that start and end on line 2/2 of a wrapped line', done => {
+          (terminal as any).cols = 4;
+          assertLinkifiesMultiLineLink('12345678', /5678/, [{x1: 0, x2: 4, y1: 1, y2: 1}], done);
+        });
+        it('should match links that start on line 2/3 of a wrapped line and wrap to line 3/3', done => {
+          (terminal as any).cols = 4;
+          assertLinkifiesMultiLineLink('123456789', /56789/, [{x1: 0, x2: 1, y1: 1, y2: 2}], done);
+        });
+      });
     });
 
     describe('validationCallback', () => {
@@ -148,7 +170,8 @@ describe('Linkifier', () => {
             assert.equal(mouseZoneManager.zones.length, 1);
             assert.equal(mouseZoneManager.zones[0].x1, 1);
             assert.equal(mouseZoneManager.zones[0].x2, 5);
-            assert.equal(mouseZoneManager.zones[0].y, 1);
+            assert.equal(mouseZoneManager.zones[0].y1, 1);
+            assert.equal(mouseZoneManager.zones[0].y2, 1);
             // Fires done()
             mouseZoneManager.zones[0].clickCallback(<any>{});
           }
@@ -201,19 +224,113 @@ describe('Linkifier', () => {
       it('should order the list from highest priority to lowest #1', () => {
         const aId = linkifier.registerLinkMatcher(/a/, () => {}, { priority: 1 });
         const bId = linkifier.registerLinkMatcher(/b/, () => {}, { priority: -1 });
-        assert.deepEqual(linkifier.linkMatchers.map(lm => lm.id), [aId, 0, bId]);
+        assert.deepEqual(linkifier.linkMatchers.map(lm => lm.id), [aId, bId]);
       });
 
       it('should order the list from highest priority to lowest #2', () => {
         const aId = linkifier.registerLinkMatcher(/a/, () => {}, { priority: -1 });
         const bId = linkifier.registerLinkMatcher(/b/, () => {}, { priority: 1 });
-        assert.deepEqual(linkifier.linkMatchers.map(lm => lm.id), [bId, 0, aId]);
+        assert.deepEqual(linkifier.linkMatchers.map(lm => lm.id), [bId, aId]);
       });
 
       it('should order items of equal priority in the order they are added', () => {
         const aId = linkifier.registerLinkMatcher(/a/, () => {}, { priority: 0 });
         const bId = linkifier.registerLinkMatcher(/b/, () => {}, { priority: 0 });
-        assert.deepEqual(linkifier.linkMatchers.map(lm => lm.id), [0, aId, bId]);
+        assert.deepEqual(linkifier.linkMatchers.map(lm => lm.id), [aId, bId]);
+      });
+    });
+  });
+  describe('unicode handling', () => {
+    let terminal: TestTerminal;
+
+    // other than the tests above unicode testing needs the full terminal instance
+    // to get the special handling of fullwidth, surrogate and combining chars in the input handler
+    beforeEach(() => {
+      terminal = new TestTerminal({cols: 10, rows: 5});
+      linkifier = new TestLinkifier(terminal);
+      mouseZoneManager = new TestMouseZoneManager();
+      linkifier.attachToDom(mouseZoneManager);
+    });
+
+    function assertLinkifiesInTerminal(rowText: string, linkMatcherRegex: RegExp, links: {x1: number, y1: number, x2: number, y2: number}[], done: MochaDone): void {
+      terminal.writeSync(rowText);
+      linkifier.registerLinkMatcher(linkMatcherRegex, () => {});
+      linkifier.linkifyRows();
+      // Allow linkify to happen
+      setTimeout(() => {
+        assert.equal(mouseZoneManager.zones.length, links.length);
+        links.forEach((l, i) => {
+          assert.equal(mouseZoneManager.zones[i].x1, l.x1 + 1);
+          assert.equal(mouseZoneManager.zones[i].x2, l.x2 + 1);
+          assert.equal(mouseZoneManager.zones[i].y1, l.y1 + 1);
+          assert.equal(mouseZoneManager.zones[i].y2, l.y2 + 1);
+        });
+        done();
+      }, 0);
+    }
+
+    describe('unicode before the match', () => {
+      it('combining - match within one line', function(done: () => void): void {
+        assertLinkifiesInTerminal('e\u0301e\u0301e\u0301 foo', /foo/, [{x1: 4, x2: 7, y1: 0, y2: 0}], done);
+      });
+      it('combining - match over two lines', function(done: () => void): void {
+        assertLinkifiesInTerminal('e\u0301e\u0301e\u0301     foo', /foo/, [{x1: 8, x2: 1, y1: 0, y2: 1}], done);
+      });
+      it('surrogate - match within one line', function(done: () => void): void {
+        assertLinkifiesInTerminal('𝄞𝄞𝄞 foo', /foo/, [{x1: 4, x2: 7, y1: 0, y2: 0}], done);
+      });
+      it('surrogate - match over two lines', function(done: () => void): void {
+        assertLinkifiesInTerminal('𝄞𝄞𝄞     foo', /foo/, [{x1: 8, x2: 1, y1: 0, y2: 1}], done);
+      });
+      it('combining surrogate - match within one line', function(done: () => void): void {
+        assertLinkifiesInTerminal('𓂀\u0301𓂀\u0301𓂀\u0301 foo', /foo/, [{x1: 4, x2: 7, y1: 0, y2: 0}], done);
+      });
+      it('combining surrogate - match over two lines', function(done: () => void): void {
+        assertLinkifiesInTerminal('𓂀\u0301𓂀\u0301𓂀\u0301     foo', /foo/, [{x1: 8, x2: 1, y1: 0, y2: 1}], done);
+      });
+      it('fullwidth - match within one line', function(done: () => void): void {
+        assertLinkifiesInTerminal('１２ foo', /foo/, [{x1: 5, x2: 8, y1: 0, y2: 0}], done);
+      });
+      it('fullwidth - match over two lines', function(done: () => void): void {
+        assertLinkifiesInTerminal('１２    foo', /foo/, [{x1: 8, x2: 1, y1: 0, y2: 1}], done);
+      });
+      it('combining fullwidth - match within one line', function(done: () => void): void {
+        assertLinkifiesInTerminal('￥\u0301￥\u0301 foo', /foo/, [{x1: 5, x2: 8, y1: 0, y2: 0}], done);
+      });
+      it('combining fullwidth - match over two lines', function(done: () => void): void {
+        assertLinkifiesInTerminal('￥\u0301￥\u0301    foo', /foo/, [{x1: 8, x2: 1, y1: 0, y2: 1}], done);
+      });
+    });
+    describe('unicode within the match', () => {
+      it('combining - match within one line', function(done: () => void): void {
+        assertLinkifiesInTerminal('test cafe\u0301', /cafe\u0301/, [{x1: 5, x2: 9, y1: 0, y2: 0}], done);
+      });
+      it('combining - match over two lines', function(done: () => void): void {
+        assertLinkifiesInTerminal('testtest cafe\u0301', /cafe\u0301/, [{x1: 9, x2: 3, y1: 0, y2: 1}], done);
+      });
+      it('surrogate - match within one line', function(done: () => void): void {
+        assertLinkifiesInTerminal('test a𝄞b', /a𝄞b/, [{x1: 5, x2: 8, y1: 0, y2: 0}], done);
+      });
+      it('surrogate - match over two lines', function(done: () => void): void {
+        assertLinkifiesInTerminal('testtest a𝄞b', /a𝄞b/, [{x1: 9, x2: 2, y1: 0, y2: 1}], done);
+      });
+      it('combining surrogate - match within one line', function(done: () => void): void {
+        assertLinkifiesInTerminal('test a𓂀\u0301b', /a𓂀\u0301b/, [{x1: 5, x2: 8, y1: 0, y2: 0}], done);
+      });
+      it('combining surrogate - match over two lines', function(done: () => void): void {
+        assertLinkifiesInTerminal('testtest a𓂀\u0301b', /a𓂀\u0301b/, [{x1: 9, x2: 2, y1: 0, y2: 1}], done);
+      });
+      it('fullwidth - match within one line', function(done: () => void): void {
+        assertLinkifiesInTerminal('test a１b', /a１b/, [{x1: 5, x2: 9, y1: 0, y2: 0}], done);
+      });
+      it('fullwidth - match over two lines', function(done: () => void): void {
+        assertLinkifiesInTerminal('testtest a１b', /a１b/, [{x1: 9, x2: 3, y1: 0, y2: 1}], done);
+      });
+      it('combining fullwidth - match within one line', function(done: () => void): void {
+        assertLinkifiesInTerminal('test a￥\u0301b', /a￥\u0301b/, [{x1: 5, x2: 9, y1: 0, y2: 0}], done);
+      });
+      it('combining fullwidth - match over two lines', function(done: () => void): void {
+        assertLinkifiesInTerminal('testtest a￥\u0301b', /a￥\u0301b/, [{x1: 9, x2: 3, y1: 0, y2: 1}], done);
       });
     });
   });

src/Linkifier.ts

@@ -3,63 +3,50 @@
  * @license MIT
  */
 
-import { ILinkMatcherOptions, ITerminal, IBufferAccessor, ILinkifier, IElementAccessor } from './Interfaces';
-import { LinkMatcher, LinkMatcherHandler, LinkMatcherValidationCallback, LineData, LinkHoverEvent, LinkHoverEventTypes } from './Types';
-import { IMouseZoneManager } from './input/Interfaces';
-import { MouseZone } from './input/MouseZoneManager';
-import { EventEmitter } from './EventEmitter';
-
-const protocolClause = '(https?:\\/\\/)';
-const domainCharacterSet = '[\\da-z\\.-]+';
-const negatedDomainCharacterSet = '[^\\da-z\\.-]+';
-const domainBodyClause = '(' + domainCharacterSet + ')';
-const tldClause = '([a-z\\.]{2,6})';
-const ipClause = '((\\d{1,3}\\.){3}\\d{1,3})';
-const localHostClause = '(localhost)';
-const portClause = '(:\\d{1,5})';
-const hostClause = '((' + domainBodyClause + '\\.' + tldClause + ')|' + ipClause + '|' + localHostClause + ')' + portClause + '?';
-const pathClause = '(\\/[\\/\\w\\.\\-%~]*)*';
-const queryStringHashFragmentCharacterSet = '[0-9\\w\\[\\]\\(\\)\\/\\?\\!#@$%&\'*+,:;~\\=\\.\\-]*';
-const queryStringClause = '(\\?' + queryStringHashFragmentCharacterSet + ')?';
-const hashFragmentClause = '(#' + queryStringHashFragmentCharacterSet + ')?';
-const negatedPathCharacterSet = '[^\\/\\w\\.\\-%]+';
-const bodyClause = hostClause + pathClause + queryStringClause + hashFragmentClause;
-const start = '(?:^|' + negatedDomainCharacterSet + ')(';
-const end = ')($|' + negatedPathCharacterSet + ')';
-const strictUrlRegex = new RegExp(start + protocolClause + bodyClause + end);
-
-/**
- * The ID of the built in http(s) link matcher.
- */
-const HYPERTEXT_LINK_MATCHER_ID = 0;
+import { ILinkifierEvent, ILinkMatcher, LinkMatcherHandler, ILinkMatcherOptions, ILinkifier, ITerminal, IBufferStringIteratorResult, IMouseZoneManager } from './Types';
+import { MouseZone } from './MouseZoneManager';
+import { getStringCellWidth } from './CharWidth';
+import { EventEmitter2, IEvent } from './common/EventEmitter2';
 
 /**
  * The Linkifier applies links to rows shortly after they have been refreshed.
  */
-export class Linkifier extends EventEmitter implements ILinkifier {
+export class Linkifier implements ILinkifier {
   /**
    * The time to wait after a row is changed before it is linkified. This prevents
    * the costly operation of searching every row multiple times, potentially a
    * huge amount of times.
    */
-  protected static TIME_BEFORE_LINKIFY = 200;
+  protected static readonly TIME_BEFORE_LINKIFY = 200;
 
-  protected _linkMatchers: LinkMatcher[] = [];
+  /**
+   * Limit of the unwrapping line expansion (overscan) at the top and bottom
+   * of the actual viewport in ASCII characters.
+   * A limit of 2000 should match most sane urls.
+   */
+  protected static readonly OVERSCAN_CHAR_LIMIT = 2000;
+
+  protected _linkMatchers: ILinkMatcher[] = [];
 
   private _mouseZoneManager: IMouseZoneManager;
   private _rowsTimeoutId: number;
-  private _nextLinkMatcherId = HYPERTEXT_LINK_MATCHER_ID;
-  private _rowsToLinkify: {start: number, end: number};
+  private _nextLinkMatcherId = 0;
+  private _rowsToLinkify: { start: number, end: number };
+
+  private _onLinkHover = new EventEmitter2<ILinkifierEvent>();
+  public get onLinkHover(): IEvent<ILinkifierEvent> { return this._onLinkHover.event; }
+  private _onLinkLeave = new EventEmitter2<ILinkifierEvent>();
+  public get onLinkLeave(): IEvent<ILinkifierEvent> { return this._onLinkLeave.event; }
+  private _onLinkTooltip = new EventEmitter2<ILinkifierEvent>();
+  public get onLinkTooltip(): IEvent<ILinkifierEvent> { return this._onLinkTooltip.event; }
 
   constructor(
-    protected _terminal: IBufferAccessor & IElementAccessor
+    protected _terminal: ITerminal
   ) {
-    super();
     this._rowsToLinkify = {
       start: null,
       end: null
     };
-    this.registerLinkMatcher(strictUrlRegex, null, { matchIndex: 1 });
   }
 
   /**
@@ -82,12 +69,12 @@ export class Linkifier extends EventEmitter implements ILinkifier {
     }
 
     // Increase range to linkify
-    if (!this._rowsToLinkify.start) {
+    if (this._rowsToLinkify.start === null) {
       this._rowsToLinkify.start = start;
       this._rowsToLinkify.end = end;
     } else {
-      this._rowsToLinkify.start = this._rowsToLinkify.start < start ? this._rowsToLinkify.start : start;
-      this._rowsToLinkify.end = this._rowsToLinkify.end > end ? this._rowsToLinkify.end : end;
+      this._rowsToLinkify.start = Math.min(this._rowsToLinkify.start, start);
+      this._rowsToLinkify.end = Math.max(this._rowsToLinkify.end, end);
     }
 
     // Clear out any existing links on this row range
@@ -105,30 +92,41 @@ export class Linkifier extends EventEmitter implements ILinkifier {
    */
   private _linkifyRows(): void {
     this._rowsTimeoutId = null;
-    for (let i = this._rowsToLinkify.start; i <= this._rowsToLinkify.end; i++) {
-      this._linkifyRow(i);
+    const buffer = this._terminal.buffer;
+
+    // Ensure the start row exists
+    const absoluteRowIndexStart = buffer.ydisp + this._rowsToLinkify.start;
+    if (absoluteRowIndexStart >= buffer.lines.length) {
+      return;
     }
+
+    // Invalidate bad end row values (if a resize happened)
+    const absoluteRowIndexEnd = buffer.ydisp + Math.min(this._rowsToLinkify.end, this._terminal.rows) + 1;
+
+    // Iterate over the range of unwrapped content strings within start..end
+    // (excluding).
+    // _doLinkifyRow gets full unwrapped lines with the start row as buffer offset
+    // for every matcher.
+    // The unwrapping is needed to also match content that got wrapped across
+    // several buffer lines. To avoid a worst case scenario where the whole buffer
+    // contains just a single unwrapped string we limit this line expansion beyond
+    // the viewport to +OVERSCAN_CHAR_LIMIT chars (overscan) at top and bottom.
+    // This comes with the tradeoff that matches longer than OVERSCAN_CHAR_LIMIT
+    // chars will not match anymore at the viewport borders.
+    const overscanLineLimit = Math.ceil(Linkifier.OVERSCAN_CHAR_LIMIT / this._terminal.cols);
+    const iterator = this._terminal.buffer.iterator(
+      false, absoluteRowIndexStart, absoluteRowIndexEnd, overscanLineLimit, overscanLineLimit);
+    while (iterator.hasNext()) {
+      const lineData: IBufferStringIteratorResult = iterator.next();
+      for (let i = 0; i < this._linkMatchers.length; i++) {
+        this._doLinkifyRow(lineData.range.first, lineData.content, this._linkMatchers[i]);
+      }
+    }
+
     this._rowsToLinkify.start = null;
     this._rowsToLinkify.end = null;
   }
 
-  /**
-   * Attaches a handler for hypertext links, overriding default <a> behavior for
-   * tandard http(s) links.
-   * @param handler The handler to use, this can be cleared with null.
-   */
-  public setHypertextLinkHandler(handler: LinkMatcherHandler): void {
-    this._linkMatchers[HYPERTEXT_LINK_MATCHER_ID].handler = handler;
-  }
-
-  /**
-   * Attaches a validation callback for hypertext links.
-   * @param callback The callback to use, this can be cleared with null.
-   */
-  public setHypertextValidationCallback(callback: LinkMatcherValidationCallback): void {
-    this._linkMatchers[HYPERTEXT_LINK_MATCHER_ID].validationCallback = callback;
-  }
-
   /**
    * Registers a link matcher, allowing custom link patterns to be matched and
    * handled.
@@ -140,10 +138,10 @@ export class Linkifier extends EventEmitter implements ILinkifier {
    * @return The ID of the new matcher, this can be used to deregister.
    */
   public registerLinkMatcher(regex: RegExp, handler: LinkMatcherHandler, options: ILinkMatcherOptions = {}): number {
-    if (this._nextLinkMatcherId !== HYPERTEXT_LINK_MATCHER_ID && !handler) {
+    if (!handler) {
       throw new Error('handler must be defined');
     }
-    const matcher: LinkMatcher = {
+    const matcher: ILinkMatcher = {
       id: this._nextLinkMatcherId++,
       regex,
       handler,
@@ -151,6 +149,7 @@ export class Linkifier extends EventEmitter implements ILinkifier {
       validationCallback: options.validationCallback,
       hoverTooltipCallback: options.tooltipCallback,
       hoverLeaveCallback: options.leaveCallback,
+      willLinkActivate: options.willLinkActivate,
       priority: options.priority || 0
     };
     this._addLinkMatcherToList(matcher);
@@ -163,7 +162,7 @@ export class Linkifier extends EventEmitter implements ILinkifier {
    * considered after older link matchers.
    * @param matcher The link matcher to be added.
    */
-  private _addLinkMatcherToList(matcher: LinkMatcher): void {
+  private _addLinkMatcherToList(matcher: ILinkMatcher): void {
     if (this._linkMatchers.length === 0) {
       this._linkMatchers.push(matcher);
       return;
@@ -185,8 +184,7 @@ export class Linkifier extends EventEmitter implements ILinkifier {
    * @return Whether a link matcher was found and deregistered.
    */
   public deregisterLinkMatcher(matcherId: number): boolean {
-    // ID 0 is the hypertext link matcher which cannot be deregistered
-    for (let i = 1; i < this._linkMatchers.length; i++) {
+    for (let i = 0; i < this._linkMatchers.length; i++) {
       if (this._linkMatchers[i].id === matcherId) {
         this._linkMatchers.splice(i, 1);
         return true;
@@ -195,65 +193,68 @@ export class Linkifier extends EventEmitter implements ILinkifier {
     return false;
   }
 
-  /**
-   * Linkifies a row.
-   * @param rowIndex The index of the row to linkify.
-   */
-  private _linkifyRow(rowIndex: number): void {
-    const absoluteRowIndex = this._terminal.buffer.ydisp + rowIndex;
-    if (absoluteRowIndex >= this._terminal.buffer.lines.length) {
-      return;
-    }
-    const text = this._terminal.buffer.translateBufferLineToString(absoluteRowIndex, false);
-    for (let i = 0; i < this._linkMatchers.length; i++) {
-      this._doLinkifyRow(rowIndex, text, this._linkMatchers[i]);
-    }
-  }
-
   /**
    * Linkifies a row given a specific handler.
-   * @param rowIndex The row index to linkify.
-   * @param text The text of the row (excludes text in the row that's already
-   * linkified).
+   * @param rowIndex The row index to linkify (absolute index).
+   * @param text string content of the unwrapped row.
    * @param matcher The link matcher for this line.
-   * @param offset The how much of the row has already been linkified.
-   * @return The link element(s) that were added.
    */
-  private _doLinkifyRow(rowIndex: number, text: string, matcher: LinkMatcher, offset: number = 0): void {
-    // Iterate over nodes as we want to consider text nodes
-    let result = [];
-    const isHttpLinkMatcher = matcher.id === HYPERTEXT_LINK_MATCHER_ID;
-
-    // Find the first match
-    let match = text.match(matcher.regex);
-    if (!match || match.length === 0) {
-      return;
-    }
-    let uri = match[typeof matcher.matchIndex !== 'number' ? 0 : matcher.matchIndex];
-
-    // Get index, match.index is for the outer match which includes negated chars
-    const index = text.indexOf(uri);
-
-    // Ensure the link is valid before registering
-    if (matcher.validationCallback) {
-      matcher.validationCallback(uri, isValid => {
-        // Discard link if the line has already changed
-        if (this._rowsTimeoutId) {
-          return;
+  private _doLinkifyRow(rowIndex: number, text: string, matcher: ILinkMatcher): void {
+    // clone regex to do a global search on text
+    const rex = new RegExp(matcher.regex.source, matcher.regex.flags + 'g');
+    let match;
+    let stringIndex = -1;
+    while ((match = rex.exec(text)) !== null) {
+      const uri = match[typeof matcher.matchIndex !== 'number' ? 0 : matcher.matchIndex];
+      if (!uri) {
+        // something matched but does not comply with the given matchIndex
+        // since this is most likely a bug the regex itself we simply do nothing here
+        // DEBUG: print match and throw
+        if ((<any>this._terminal).debug) {
+          console.log({match, matcher});
+          throw new Error('match found without corresponding matchIndex');
         }
-        if (isValid) {
-          this._addLink(offset + index, rowIndex, uri, matcher);
-        }
-      });
-    } else {
-      this._addLink(offset + index, rowIndex, uri, matcher);
-    }
+        break;
+      }
 
-    // Recursively check for links in the rest of the text
-    const remainingStartIndex = index + uri.length;
-    const remainingText = text.substr(remainingStartIndex);
-    if (remainingText.length > 0) {
-      this._doLinkifyRow(rowIndex, remainingText, matcher, offset + remainingStartIndex);
+      // Get index, match.index is for the outer match which includes negated chars
+      // therefore we cannot use match.index directly, instead we search the position
+      // of the match group in text again
+      // also correct regex and string search offsets for the next loop run
+      stringIndex = text.indexOf(uri, stringIndex + 1);
+      rex.lastIndex = stringIndex + uri.length;
+      if (stringIndex < 0) {
+        // invalid stringIndex (should not have happened)
+        break;
+      }
+
+      // get the buffer index as [absolute row, col] for the match
+      const bufferIndex = this._terminal.buffer.stringIndexToBufferIndex(rowIndex, stringIndex);
+      if (bufferIndex[0] < 0) {
+        // invalid bufferIndex (should not have happened)
+        break;
+      }
+
+      const line = this._terminal.buffer.lines.get(bufferIndex[0]);
+      const attr = line.getFg(bufferIndex[1]);
+      let fg: number | undefined;
+      if (attr) {
+        fg = (attr >> 9) & 0x1ff;
+      }
+
+      if (matcher.validationCallback) {
+        matcher.validationCallback(uri, isValid => {
+          // Discard link if the line has already changed
+          if (this._rowsTimeoutId) {
+            return;
+          }
+          if (isValid) {
+            this._addLink(bufferIndex[1], bufferIndex[0] - this._terminal.buffer.ydisp, uri, matcher, fg);
+          }
+        });
+      } else {
+        this._addLink(bufferIndex[1], bufferIndex[0] - this._terminal.buffer.ydisp, uri, matcher, fg);
+      }
     }
   }
 
@@ -263,35 +264,57 @@ export class Linkifier extends EventEmitter implements ILinkifier {
    * @param y The row the link is on.
    * @param uri The URI of the link.
    * @param matcher The link matcher for the link.
+   * @param fg The link color for hover event.
    */
-  private _addLink(x: number, y: number, uri: string, matcher: LinkMatcher): void {
+  private _addLink(x: number, y: number, uri: string, matcher: ILinkMatcher, fg: number): void {
+    const width = getStringCellWidth(uri);
+    const x1 = x % this._terminal.cols;
+    const y1 = y + Math.floor(x / this._terminal.cols);
+    let x2 = (x1 + width) % this._terminal.cols;
+    let y2 = y1 + Math.floor((x1 + width) / this._terminal.cols);
+    if (x2 === 0) {
+      x2 = this._terminal.cols;
+      y2--;
+    }
+
     this._mouseZoneManager.add(new MouseZone(
-      x + 1,
-      x + 1 + uri.length,
-      y + 1,
+      x1 + 1,
+      y1 + 1,
+      x2 + 1,
+      y2 + 1,
       e => {
         if (matcher.handler) {
           return matcher.handler(e, uri);
         }
         window.open(uri, '_blank');
       },
-      e => {
-        this.emit(LinkHoverEventTypes.HOVER, <LinkHoverEvent>{ x, y, length: uri.length});
-        this._terminal.element.style.cursor = 'pointer';
+      () => {
+        this._onLinkHover.fire(this._createLinkHoverEvent(x1, y1, x2, y2, fg));
+        this._terminal.element.classList.add('xterm-cursor-pointer');
       },
       e => {
-        this.emit(LinkHoverEventTypes.TOOLTIP, <LinkHoverEvent>{ x, y, length: uri.length});
+        this._onLinkTooltip.fire(this._createLinkHoverEvent(x1, y1, x2, y2, fg));
         if (matcher.hoverTooltipCallback) {
           matcher.hoverTooltipCallback(e, uri);
         }
       },
       () => {
-        this.emit(LinkHoverEventTypes.LEAVE, <LinkHoverEvent>{ x, y, length: uri.length});
-        this._terminal.element.style.cursor = '';
+        this._onLinkLeave.fire(this._createLinkHoverEvent(x1, y1, x2, y2, fg));
+        this._terminal.element.classList.remove('xterm-cursor-pointer');
         if (matcher.hoverLeaveCallback) {
           matcher.hoverLeaveCallback();
         }
+      },
+      e => {
+        if (matcher.willLinkActivate) {
+          return matcher.willLinkActivate(e, uri);
+        }
+        return true;
       }
     ));
   }
+
+  private _createLinkHoverEvent(x1: number, y1: number, x2: number, y2: number, fg: number): ILinkifierEvent {
+    return { x1, y1, x2, y2, cols: this._terminal.cols, fg };
+  }
 }

src/MouseHelper.test.ts

@@ -31,40 +31,34 @@ describe('MouseHelper.getCoords', () => {
       actualCellWidth: CHAR_WIDTH,
       actualCellHeight: CHAR_HEIGHT
     };
-    mouseHelper = new MouseHelper(renderer);
+    mouseHelper = new MouseHelper(renderer as any);
   });
 
   describe('when charMeasure is not initialized', () => {
     it('should return null', () => {
       charMeasure = new MockCharMeasure();
-      assert.equal(mouseHelper.getCoords({ pageX: 0, pageY: 0 }, document.createElement('div'), charMeasure, 1, 10, 10), null);
-    });
-  });
-
-  describe('when pageX/pageY are not supported', () => {
-    it('should return null', () => {
-      assert.equal(mouseHelper.getCoords({ pageX: undefined, pageY: undefined }, document.createElement('div'), charMeasure, 1, 10, 10), null);
+      assert.equal(mouseHelper.getCoords({ clientX: 0, clientY: 0 }, document.createElement('div'), charMeasure, 10, 10), null);
     });
   });
 
   it('should return the cell that was clicked', () => {
     let coords: [number, number];
-    coords = mouseHelper.getCoords({ pageX: CHAR_WIDTH / 2, pageY: CHAR_HEIGHT / 2 }, document.createElement('div'), charMeasure, 1, 10, 10);
+    coords = mouseHelper.getCoords({ clientX: CHAR_WIDTH / 2, clientY: CHAR_HEIGHT / 2 }, document.createElement('div'), charMeasure, 10, 10);
     assert.deepEqual(coords, [1, 1]);
-    coords = mouseHelper.getCoords({ pageX: CHAR_WIDTH, pageY: CHAR_HEIGHT }, document.createElement('div'), charMeasure, 1, 10, 10);
+    coords = mouseHelper.getCoords({ clientX: CHAR_WIDTH, clientY: CHAR_HEIGHT }, document.createElement('div'), charMeasure, 10, 10);
     assert.deepEqual(coords, [1, 1]);
-    coords = mouseHelper.getCoords({ pageX: CHAR_WIDTH, pageY: CHAR_HEIGHT + 1 }, document.createElement('div'), charMeasure, 1, 10, 10);
+    coords = mouseHelper.getCoords({ clientX: CHAR_WIDTH, clientY: CHAR_HEIGHT + 1 }, document.createElement('div'), charMeasure, 10, 10);
     assert.deepEqual(coords, [1, 2]);
-    coords = mouseHelper.getCoords({ pageX: CHAR_WIDTH + 1, pageY: CHAR_HEIGHT }, document.createElement('div'), charMeasure, 1, 10, 10);
+    coords = mouseHelper.getCoords({ clientX: CHAR_WIDTH + 1, clientY: CHAR_HEIGHT }, document.createElement('div'), charMeasure, 10, 10);
     assert.deepEqual(coords, [2, 1]);
   });
 
   it('should ensure the coordinates are returned within the terminal bounds', () => {
     let coords: [number, number];
-    coords = mouseHelper.getCoords({ pageX: -1, pageY: -1 }, document.createElement('div'), charMeasure, 1, 10, 10);
+    coords = mouseHelper.getCoords({ clientX: -1, clientY: -1 }, document.createElement('div'), charMeasure, 10, 10);
     assert.deepEqual(coords, [1, 1]);
     // Event are double the cols/rows
-    coords = mouseHelper.getCoords({ pageX: CHAR_WIDTH * 20, pageY: CHAR_HEIGHT * 20 }, document.createElement('div'), charMeasure, 1, 10, 10);
+    coords = mouseHelper.getCoords({ clientX: CHAR_WIDTH * 20, clientY: CHAR_HEIGHT * 20 }, document.createElement('div'), charMeasure, 10, 10);
     assert.deepEqual(coords, [10, 10], 'coordinates should never come back as larger than the terminal');
   });
 });

src/MouseHelper.ts

@@ -3,36 +3,18 @@
  * @license MIT
  */
 
-import { ICharMeasure } from '../Interfaces';
-import { IRenderer } from '../renderer/Interfaces';
+import { ICharMeasure, IMouseHelper } from './Types';
+import { RenderCoordinator } from './renderer/RenderCoordinator';
 
-export class MouseHelper {
-  constructor(private _renderer: IRenderer) {}
+export class MouseHelper implements IMouseHelper {
+  constructor(
+    private _renderCoordinator: RenderCoordinator
+  ) {
+  }
 
-  public static getCoordsRelativeToElement(event: {pageX: number, pageY: number}, element: HTMLElement): [number, number] {
-    // Ignore browsers that don't support MouseEvent.pageX
-    if (event.pageX == null) {
-      return null;
-    }
-
-    const originalElement = element;
-    let x = event.pageX;
-    let y = event.pageY;
-
-    // Converts the coordinates from being relative to the document to being
-    // relative to the terminal.
-    while (element) {
-      x -= element.offsetLeft;
-      y -= element.offsetTop;
-      element = 'offsetParent' in element ? <HTMLElement>element.offsetParent : <HTMLElement>element.parentElement;
-    }
-    element = originalElement;
-    while (element && element !== element.ownerDocument.body) {
-      x += element.scrollLeft;
-      y += element.scrollTop;
-      element = <HTMLElement>element.parentElement;
-    }
-    return [x, y];
+  public static getCoordsRelativeToElement(event: {clientX: number, clientY: number}, element: HTMLElement): [number, number] {
+    const rect = element.getBoundingClientRect();
+    return [event.clientX - rect.left, event.clientY - rect.top];
   }
 
   /**
@@ -48,7 +30,7 @@ export class MouseHelper {
    * apply an offset to the x value such that the left half of the cell will
    * select that cell and the right half will select the next cell.
    */
-  public getCoords(event: {pageX: number, pageY: number}, element: HTMLElement, charMeasure: ICharMeasure, lineHeight: number, colCount: number, rowCount: number, isSelection?: boolean): [number, number] {
+  public getCoords(event: {clientX: number, clientY: number}, element: HTMLElement, charMeasure: ICharMeasure, colCount: number, rowCount: number, isSelection?: boolean): [number, number] {
     // Coordinates cannot be measured if charMeasure has not been initialized
     if (!charMeasure.width || !charMeasure.height) {
       return null;
@@ -59,8 +41,8 @@ export class MouseHelper {
       return null;
     }
 
-    coords[0] = Math.ceil((coords[0] + (isSelection ? this._renderer.dimensions.actualCellWidth / 2 : 0)) / this._renderer.dimensions.actualCellWidth);
-    coords[1] = Math.ceil(coords[1] / this._renderer.dimensions.actualCellHeight);
+    coords[0] = Math.ceil((coords[0] + (isSelection ? this._renderCoordinator.dimensions.actualCellWidth / 2 : 0)) / this._renderCoordinator.dimensions.actualCellWidth);
+    coords[1] = Math.ceil(coords[1] / this._renderCoordinator.dimensions.actualCellHeight);
 
     // Ensure coordinates are within the terminal viewport. Note that selections
     // need an addition point of precision to cover the end point (as characters
@@ -81,8 +63,8 @@ export class MouseHelper {
    * @param colCount The number of columns in the terminal.
    * @param rowCount The number of rows in the terminal.
    */
-  public getRawByteCoords(event: MouseEvent, element: HTMLElement, charMeasure: ICharMeasure, lineHeight: number, colCount: number, rowCount: number): { x: number, y: number } {
-    const coords = this.getCoords(event, element, charMeasure, lineHeight, colCount, rowCount);
+  public getRawByteCoords(event: MouseEvent, element: HTMLElement, charMeasure: ICharMeasure, colCount: number, rowCount: number): { x: number, y: number } {
+    const coords = this.getCoords(event, element, charMeasure, colCount, rowCount);
     let x = coords[0];
     let y = coords[1];
 

src/MouseZoneManager.ts

@@ -3,8 +3,9 @@
  * @license MIT
  */
 
-import { IMouseZoneManager, IMouseZone } from './Interfaces';
-import { ITerminal } from '../Interfaces';
+import { ITerminal, IMouseZoneManager, IMouseZone } from './Types';
+import { Disposable } from './common/Lifecycle';
+import { addDisposableDomListener } from './ui/Lifecycle';
 
 const HOVER_DURATION = 500;
 
@@ -16,27 +17,37 @@ const HOVER_DURATION = 500;
  * needed to support was single-line links which never overlap. Improvements can
  * be made in the future.
  */
-export class MouseZoneManager implements IMouseZoneManager {
+export class MouseZoneManager extends Disposable implements IMouseZoneManager {
   private _zones: IMouseZone[] = [];
 
   private _areZonesActive: boolean = false;
   private _mouseMoveListener: (e: MouseEvent) => any;
+  private _mouseLeaveListener: (e: MouseEvent) => any;
   private _clickListener: (e: MouseEvent) => any;
 
   private _tooltipTimeout: number = null;
   private _currentZone: IMouseZone = null;
   private _lastHoverCoords: [number, number] = [null, null];
+  private _initialSelectionLength: number;
 
   constructor(
     private _terminal: ITerminal
   ) {
-    this._terminal.element.addEventListener('mousedown', e => this._onMouseDown(e));
+    super();
+
+    this.register(addDisposableDomListener(this._terminal.element, 'mousedown', e => this._onMouseDown(e)));
 
     // These events are expensive, only listen to it when mouse zones are active
     this._mouseMoveListener = e => this._onMouseMove(e);
+    this._mouseLeaveListener = e => this._onMouseLeave(e);
     this._clickListener = e => this._onClick(e);
   }
 
+  public dispose(): void {
+    super.dispose();
+    this._deactivate();
+  }
+
   public add(zone: IMouseZone): void {
     this._zones.push(zone);
     if (this._zones.length === 1) {
@@ -59,7 +70,9 @@ export class MouseZoneManager implements IMouseZoneManager {
     // Iterate through zones and clear them out if they're within the range
     for (let i = 0; i < this._zones.length; i++) {
       const zone = this._zones[i];
-      if (zone.y > start && zone.y <= end + 1) {
+      if ((zone.y1 > start && zone.y1 <= end + 1) ||
+          (zone.y2 > start && zone.y2 <= end + 1) ||
+          (zone.y1 < start && zone.y2 > end + 1)) {
         if (this._currentZone && this._currentZone === zone) {
           this._currentZone.leaveCallback();
           this._currentZone = null;
@@ -78,6 +91,7 @@ export class MouseZoneManager implements IMouseZoneManager {
     if (!this._areZonesActive) {
       this._areZonesActive = true;
       this._terminal.element.addEventListener('mousemove', this._mouseMoveListener);
+      this._terminal.element.addEventListener('mouseleave', this._mouseLeaveListener);
       this._terminal.element.addEventListener('click', this._clickListener);
     }
   }
@@ -86,6 +100,7 @@ export class MouseZoneManager implements IMouseZoneManager {
     if (this._areZonesActive) {
       this._areZonesActive = false;
       this._terminal.element.removeEventListener('mousemove', this._mouseMoveListener);
+      this._terminal.element.removeEventListener('mouseleave', this._mouseLeaveListener);
       this._terminal.element.removeEventListener('click', this._clickListener);
     }
   }
@@ -142,6 +157,10 @@ export class MouseZoneManager implements IMouseZoneManager {
   }
 
   private _onMouseDown(e: MouseEvent): void {
+    // Store current terminal selection length, to check if we're performing
+    // a selection operation
+    this._initialSelectionLength = this._terminal.getSelection().length;
+
     // Ignore the event if there are no zones active
     if (!this._areZonesActive) {
       return;
@@ -151,17 +170,32 @@ export class MouseZoneManager implements IMouseZoneManager {
     // components from handling the mouse event.
     const zone = this._findZoneEventAt(e);
     if (zone) {
-      // TODO: When link modifier support is added, the event should only be
-      // cancelled when the modifier is held (see #1021)
-      e.preventDefault();
-      e.stopImmediatePropagation();
+      if (zone.willLinkActivate(e)) {
+        e.preventDefault();
+        e.stopImmediatePropagation();
+      }
+    }
+  }
+
+  private _onMouseLeave(e: MouseEvent): void {
+    // Fire the hover end callback and cancel any existing timer if the mouse
+    // leaves the terminal element
+    if (this._currentZone) {
+      this._currentZone.leaveCallback();
+      this._currentZone = null;
+      if (this._tooltipTimeout) {
+        clearTimeout(this._tooltipTimeout);
+      }
     }
   }
 
   private _onClick(e: MouseEvent): void {
-    // Find the active zone and click it if found
+    // Find the active zone and click it if found and no selection was
+    // being performed
     const zone = this._findZoneEventAt(e);
-    if (zone) {
+    const currentSelectionLength = this._terminal.getSelection().length;
+
+    if (zone && currentSelectionLength === this._initialSelectionLength) {
       zone.clickCallback(e);
       e.preventDefault();
       e.stopImmediatePropagation();
@@ -169,16 +203,28 @@ export class MouseZoneManager implements IMouseZoneManager {
   }
 
   private _findZoneEventAt(e: MouseEvent): IMouseZone {
-    const coords = this._terminal.mouseHelper.getCoords(e, this._terminal.element, this._terminal.charMeasure, this._terminal.options.lineHeight, this._terminal.cols, this._terminal.rows);
+    const coords = this._terminal.mouseHelper.getCoords(e, this._terminal.screenElement, this._terminal.charMeasure, this._terminal.cols, this._terminal.rows);
     if (!coords) {
       return null;
     }
+    const x = coords[0];
+    const y = coords[1];
     for (let i = 0; i < this._zones.length; i++) {
       const zone = this._zones[i];
-      if (zone.y === coords[1] && zone.x1 <= coords[0] && zone.x2 > coords[0]) {
-        return zone;
+      if (zone.y1 === zone.y2) {
+        // Single line link
+        if (y === zone.y1 && x >= zone.x1 && x < zone.x2) {
+          return zone;
+        }
+      } else {
+        // Multi-line link
+        if ((y === zone.y1 && x >= zone.x1) ||
+            (y === zone.y2 && x < zone.x2) ||
+            (y > zone.y1 && y < zone.y2)) {
+          return zone;
+        }
       }
-    };
+    }
     return null;
   }
 }
@@ -186,12 +232,14 @@ export class MouseZoneManager implements IMouseZoneManager {
 export class MouseZone implements IMouseZone {
   constructor(
     public x1: number,
+    public y1: number,
     public x2: number,
-    public y: number,
+    public y2: number,
     public clickCallback: (e: MouseEvent) => any,
-    public hoverCallback?: (e: MouseEvent) => any,
-    public tooltipCallback?: (e: MouseEvent) => any,
-    public leaveCallback?: () => void
+    public hoverCallback: (e: MouseEvent) => any,
+    public tooltipCallback: (e: MouseEvent) => any,
+    public leaveCallback: () => void,
+    public willLinkActivate: (e: MouseEvent) => boolean
   ) {
   }
 }

src/Parser.ts

@@ -1,666 +0,0 @@
-/**
- * Copyright (c) 2014 The xterm.js authors. All rights reserved.
- * Copyright (c) 2012-2013, Christopher Jeffrey (MIT License)
- * @license MIT
- */
-
-import { C0 } from './EscapeSequences';
-import { IInputHandler } from './Interfaces';
-import { CHARSETS, DEFAULT_CHARSET } from './Charsets';
-
-const normalStateHandler: {[key: string]: (parser: Parser, handler: IInputHandler) => void} = {};
-normalStateHandler[C0.BEL] = (parser, handler) => handler.bell();
-normalStateHandler[C0.LF] = (parser, handler) => handler.lineFeed();
-normalStateHandler[C0.VT] = normalStateHandler[C0.LF];
-normalStateHandler[C0.FF] = normalStateHandler[C0.LF];
-normalStateHandler[C0.CR] = (parser, handler) => handler.carriageReturn();
-normalStateHandler[C0.BS] = (parser, handler) => handler.backspace();
-normalStateHandler[C0.HT] = (parser, handler) => handler.tab();
-normalStateHandler[C0.SO] = (parser, handler) => handler.shiftOut();
-normalStateHandler[C0.SI] = (parser, handler) => handler.shiftIn();
-normalStateHandler[C0.ESC] = (parser, handler) => parser.setState(ParserState.ESCAPED);
-
-// TODO: Remove terminal when parser owns params and currentParam
-const escapedStateHandler: {[key: string]: (parser: Parser, terminal: any) => void} = {};
-escapedStateHandler['['] = (parser, terminal) => {
-  // ESC [ Control Sequence Introducer (CSI  is 0x9b)
-  terminal.params = [];
-  terminal.currentParam = 0;
-  parser.setState(ParserState.CSI_PARAM);
-};
-escapedStateHandler[']'] = (parser, terminal) => {
-  // ESC ] Operating System Command (OSC is 0x9d)
-  terminal.params = [];
-  terminal.currentParam = 0;
-  parser.setState(ParserState.OSC);
-};
-escapedStateHandler['P'] = (parser, terminal) => {
-  // ESC P Device Control String (DCS is 0x90)
-  terminal.params = [];
-  terminal.currentParam = 0;
-  parser.setState(ParserState.DCS);
-};
-escapedStateHandler['_'] = (parser, terminal) => {
-  // ESC _ Application Program Command ( APC is 0x9f).
-  parser.setState(ParserState.IGNORE);
-};
-escapedStateHandler['^'] = (parser, terminal) => {
-  // ESC ^ Privacy Message ( PM is 0x9e).
-  parser.setState(ParserState.IGNORE);
-};
-escapedStateHandler['c'] = (parser, terminal) => {
-  // ESC c Full Reset (RIS).
-  terminal.reset();
-};
-escapedStateHandler['E'] = (parser, terminal) => {
-  // ESC E Next Line ( NEL is 0x85).
-  terminal.buffer.x = 0;
-  terminal.index();
-  parser.setState(ParserState.NORMAL);
-};
-escapedStateHandler['D'] = (parser, terminal) => {
-  // ESC D Index ( IND is 0x84).
-  terminal.index();
-  parser.setState(ParserState.NORMAL);
-};
-escapedStateHandler['M'] = (parser, terminal) => {
-  // ESC M Reverse Index ( RI is 0x8d).
-  terminal.reverseIndex();
-  parser.setState(ParserState.NORMAL);
-};
-escapedStateHandler['%'] = (parser, terminal) => {
-  // ESC % Select default/utf-8 character set.
-  // @ = default, G = utf-8
-  terminal.setgLevel(0);
-  terminal.setgCharset(0, DEFAULT_CHARSET); // US (default)
-  parser.setState(ParserState.NORMAL);
-  parser.skipNextChar();
-};
-escapedStateHandler[C0.CAN] = (parser) => parser.setState(ParserState.NORMAL);
-
-const csiParamStateHandler: {[key: string]: (parser: Parser) => void} = {};
-csiParamStateHandler['?'] = (parser) => parser.setPrefix('?');
-csiParamStateHandler['>'] = (parser) => parser.setPrefix('>');
-csiParamStateHandler['!'] = (parser) => parser.setPrefix('!');
-csiParamStateHandler['0'] = (parser) => parser.setParam(parser.getParam() * 10);
-csiParamStateHandler['1'] = (parser) => parser.setParam(parser.getParam() * 10 + 1);
-csiParamStateHandler['2'] = (parser) => parser.setParam(parser.getParam() * 10 + 2);
-csiParamStateHandler['3'] = (parser) => parser.setParam(parser.getParam() * 10 + 3);
-csiParamStateHandler['4'] = (parser) => parser.setParam(parser.getParam() * 10 + 4);
-csiParamStateHandler['5'] = (parser) => parser.setParam(parser.getParam() * 10 + 5);
-csiParamStateHandler['6'] = (parser) => parser.setParam(parser.getParam() * 10 + 6);
-csiParamStateHandler['7'] = (parser) => parser.setParam(parser.getParam() * 10 + 7);
-csiParamStateHandler['8'] = (parser) => parser.setParam(parser.getParam() * 10 + 8);
-csiParamStateHandler['9'] = (parser) => parser.setParam(parser.getParam() * 10 + 9);
-csiParamStateHandler['$'] = (parser) => parser.setPostfix('$');
-csiParamStateHandler['"'] = (parser) => parser.setPostfix('"');
-csiParamStateHandler[' '] = (parser) => parser.setPostfix(' ');
-csiParamStateHandler['\''] = (parser) => parser.setPostfix('\'');
-csiParamStateHandler[';'] = (parser) => parser.finalizeParam();
-csiParamStateHandler[C0.CAN] = (parser) => parser.setState(ParserState.NORMAL);
-
-const csiStateHandler: {[key: string]: (handler: IInputHandler, params: number[], prefix: string, postfix: string, parser: Parser) => void} = {};
-csiStateHandler['@'] = (handler, params, prefix) => handler.insertChars(params);
-csiStateHandler['A'] = (handler, params, prefix) => handler.cursorUp(params);
-csiStateHandler['B'] = (handler, params, prefix) => handler.cursorDown(params);
-csiStateHandler['C'] = (handler, params, prefix) => handler.cursorForward(params);
-csiStateHandler['D'] = (handler, params, prefix) => handler.cursorBackward(params);
-csiStateHandler['E'] = (handler, params, prefix) => handler.cursorNextLine(params);
-csiStateHandler['F'] = (handler, params, prefix) => handler.cursorPrecedingLine(params);
-csiStateHandler['G'] = (handler, params, prefix) => handler.cursorCharAbsolute(params);
-csiStateHandler['H'] = (handler, params, prefix) => handler.cursorPosition(params);
-csiStateHandler['I'] = (handler, params, prefix) => handler.cursorForwardTab(params);
-csiStateHandler['J'] = (handler, params, prefix) => handler.eraseInDisplay(params);
-csiStateHandler['K'] = (handler, params, prefix) => handler.eraseInLine(params);
-csiStateHandler['L'] = (handler, params, prefix) => handler.insertLines(params);
-csiStateHandler['M'] = (handler, params, prefix) => handler.deleteLines(params);
-csiStateHandler['P'] = (handler, params, prefix) => handler.deleteChars(params);
-csiStateHandler['S'] = (handler, params, prefix) => handler.scrollUp(params);
-csiStateHandler['T'] = (handler, params, prefix) => {
-  if (params.length < 2 && !prefix) {
-    handler.scrollDown(params);
-  }
-};
-csiStateHandler['X'] = (handler, params, prefix) => handler.eraseChars(params);
-csiStateHandler['Z'] = (handler, params, prefix) => handler.cursorBackwardTab(params);
-csiStateHandler['`'] = (handler, params, prefix) => handler.charPosAbsolute(params);
-csiStateHandler['a'] = (handler, params, prefix) => handler.HPositionRelative(params);
-csiStateHandler['b'] = (handler, params, prefix) => handler.repeatPrecedingCharacter(params);
-csiStateHandler['c'] = (handler, params, prefix) => handler.sendDeviceAttributes(params);
-csiStateHandler['d'] = (handler, params, prefix) => handler.linePosAbsolute(params);
-csiStateHandler['e'] = (handler, params, prefix) => handler.VPositionRelative(params);
-csiStateHandler['f'] = (handler, params, prefix) => handler.HVPosition(params);
-csiStateHandler['g'] = (handler, params, prefix) => handler.tabClear(params);
-csiStateHandler['h'] = (handler, params, prefix) => handler.setMode(params);
-csiStateHandler['l'] = (handler, params, prefix) => handler.resetMode(params);
-csiStateHandler['m'] = (handler, params, prefix) => handler.charAttributes(params);
-csiStateHandler['n'] = (handler, params, prefix) => handler.deviceStatus(params);
-csiStateHandler['p'] = (handler, params, prefix) => {
-  switch (prefix) {
-    case '!': handler.softReset(params); break;
-  }
-};
-csiStateHandler['q'] = (handler, params, prefix, postfix) => {
-  if (postfix === ' ') {
-    handler.setCursorStyle(params);
-  }
-};
-csiStateHandler['r'] = (handler, params) => handler.setScrollRegion(params);
-csiStateHandler['s'] = (handler, params) => handler.saveCursor(params);
-csiStateHandler['u'] = (handler, params) => handler.restoreCursor(params);
-csiStateHandler[C0.CAN] = (handler, params, prefix, postfix, parser) => parser.setState(ParserState.NORMAL);
-
-export enum ParserState {
-  NORMAL = 0,
-  ESCAPED = 1,
-  CSI_PARAM = 2,
-  CSI = 3,
-  OSC = 4,
-  CHARSET = 5,
-  DCS = 6,
-  IGNORE = 7
-}
-
-/**
- * The terminal's parser, all input into the terminal goes through the parser
- * which parses and defers the actual input handling the the IInputHandler
- * specified in the constructor.
- */
-export class Parser {
-  private _state: ParserState;
-  private _position: number;
-
-  // TODO: Remove terminal when handler can do everything
-  constructor(
-    private _inputHandler: IInputHandler,
-    private _terminal: any
-  ) {
-    this._state = ParserState.NORMAL;
-  }
-
-  /**
-   * Parse and handle data.
-   *
-   * @param data The data to parse.
-   */
-  public parse(data: string): ParserState {
-    const l = data.length;
-    let j;
-    let cs;
-    let ch;
-    let code;
-    let low;
-
-    const cursorStartX = this._terminal.buffer.x;
-    const cursorStartY = this._terminal.buffer.y;
-
-    if (this._terminal.debug) {
-      this._terminal.log('data: ' + data);
-    }
-
-    this._position = 0;
-    // apply leftover surrogate high from last write
-    if (this._terminal.surrogate_high) {
-      data = this._terminal.surrogate_high + data;
-      this._terminal.surrogate_high = '';
-    }
-
-    for (; this._position < l; this._position++) {
-      ch = data[this._position];
-
-      // FIXME: higher chars than 0xa0 are not allowed in escape sequences
-      //        --> maybe move to default
-      code = data.charCodeAt(this._position);
-      if (0xD800 <= code && code <= 0xDBFF) {
-        // we got a surrogate high
-        // get surrogate low (next 2 bytes)
-        low = data.charCodeAt(this._position + 1);
-        if (isNaN(low)) {
-          // end of data stream, save surrogate high
-          this._terminal.surrogate_high = ch;
-          continue;
-        }
-        code = ((code - 0xD800) * 0x400) + (low - 0xDC00) + 0x10000;
-        ch += data.charAt(this._position + 1);
-      }
-      // surrogate low - already handled above
-      if (0xDC00 <= code && code <= 0xDFFF)
-        continue;
-
-      switch (this._state) {
-        case ParserState.NORMAL:
-          if (ch in normalStateHandler) {
-            normalStateHandler[ch](this, this._inputHandler);
-          } else {
-            this._inputHandler.addChar(ch, code);
-          }
-          break;
-        case ParserState.ESCAPED:
-          if (ch in escapedStateHandler) {
-            escapedStateHandler[ch](this, this._terminal);
-            // Skip switch as it was just handled
-            break;
-          }
-          switch (ch) {
-
-            // ESC (,),*,+,-,. Designate G0-G2 Character Set.
-            case '(': // <-- this seems to get all the attention
-            case ')':
-            case '*':
-            case '+':
-            case '-':
-            case '.':
-              switch (ch) {
-                case '(':
-                  this._terminal.gcharset = 0;
-                  break;
-                case ')':
-                  this._terminal.gcharset = 1;
-                  break;
-                case '*':
-                  this._terminal.gcharset = 2;
-                  break;
-                case '+':
-                  this._terminal.gcharset = 3;
-                  break;
-                case '-':
-                  this._terminal.gcharset = 1;
-                  break;
-                case '.':
-                  this._terminal.gcharset = 2;
-                  break;
-              }
-              this._state = ParserState.CHARSET;
-              break;
-
-            // Designate G3 Character Set (VT300).
-            // A = ISO Latin-1 Supplemental.
-            // Not implemented.
-            case '/':
-              this._terminal.gcharset = 3;
-              this._state = ParserState.CHARSET;
-              this._position--;
-              break;
-
-            // ESC N
-            // Single Shift Select of G2 Character Set
-            // ( SS2 is 0x8e). This affects next character only.
-            case 'N':
-              break;
-            // ESC O
-            // Single Shift Select of G3 Character Set
-            // ( SS3 is 0x8f). This affects next character only.
-            case 'O':
-              break;
-            // ESC n
-            // Invoke the G2 Character Set as GL (LS2).
-            case 'n':
-              this._terminal.setgLevel(2);
-              break;
-            // ESC o
-            // Invoke the G3 Character Set as GL (LS3).
-            case 'o':
-              this._terminal.setgLevel(3);
-              break;
-            // ESC |
-            // Invoke the G3 Character Set as GR (LS3R).
-            case '|':
-              this._terminal.setgLevel(3);
-              break;
-            // ESC }
-            // Invoke the G2 Character Set as GR (LS2R).
-            case '}':
-              this._terminal.setgLevel(2);
-              break;
-            // ESC ~
-            // Invoke the G1 Character Set as GR (LS1R).
-            case '~':
-              this._terminal.setgLevel(1);
-              break;
-
-            // ESC 7 Save Cursor (DECSC).
-            case '7':
-              this._inputHandler.saveCursor();
-              this._state = ParserState.NORMAL;
-              break;
-
-            // ESC 8 Restore Cursor (DECRC).
-            case '8':
-              this._inputHandler.restoreCursor();
-              this._state = ParserState.NORMAL;
-              break;
-
-            // ESC # 3 DEC line height/width
-            case '#':
-              this._state = ParserState.NORMAL;
-              this._position++;
-              break;
-
-            // ESC H Tab Set (HTS is 0x88).
-            case 'H':
-              this._terminal.tabSet();
-              this._state = ParserState.NORMAL;
-              break;
-
-            // ESC = Application Keypad (DECKPAM).
-            case '=':
-              this._terminal.log('Serial port requested application keypad.');
-              this._terminal.applicationKeypad = true;
-              if (this._terminal.viewport) {
-                this._terminal.viewport.syncScrollArea();
-              }
-              this._state = ParserState.NORMAL;
-              break;
-
-            // ESC > Normal Keypad (DECKPNM).
-            case '>':
-              this._terminal.log('Switching back to normal keypad.');
-              this._terminal.applicationKeypad = false;
-              if (this._terminal.viewport) {
-                this._terminal.viewport.syncScrollArea();
-              }
-              this._state = ParserState.NORMAL;
-              break;
-
-            default:
-              this._state = ParserState.NORMAL;
-              this._terminal.error('Unknown ESC control: %s.', ch);
-              break;
-          }
-          break;
-
-        case ParserState.CHARSET:
-          if (ch in CHARSETS) {
-            cs = CHARSETS[ch];
-            if (ch === '/') { // ISOLatin is actually /A
-              this.skipNextChar();
-            }
-          } else {
-            cs = DEFAULT_CHARSET;
-          }
-          this._terminal.setgCharset(this._terminal.gcharset, cs);
-          this._terminal.gcharset = null;
-          this._state = ParserState.NORMAL;
-          break;
-
-        case ParserState.OSC:
-          // OSC Ps ; Pt ST
-          // OSC Ps ; Pt BEL
-          //   Set Text Parameters.
-          if (ch === C0.ESC || ch === C0.BEL) {
-            if (ch === C0.ESC) this._position++;
-
-            this._terminal.params.push(this._terminal.currentParam);
-
-            switch (this._terminal.params[0]) {
-              case 0:
-              case 1:
-              case 2:
-                if (this._terminal.params[1]) {
-                  this._terminal.title = this._terminal.params[1];
-                  this._terminal.handleTitle(this._terminal.title);
-                }
-                break;
-              case 3:
-                // set X property
-                break;
-              case 4:
-              case 5:
-                // change dynamic colors
-                break;
-              case 10:
-              case 11:
-              case 12:
-              case 13:
-              case 14:
-              case 15:
-              case 16:
-              case 17:
-              case 18:
-              case 19:
-                // change dynamic ui colors
-                break;
-              case 46:
-                // change log file
-                break;
-              case 50:
-                // dynamic font
-                break;
-              case 51:
-                // emacs shell
-                break;
-              case 52:
-                // manipulate selection data
-                break;
-              case 104:
-              case 105:
-              case 110:
-              case 111:
-              case 112:
-              case 113:
-              case 114:
-              case 115:
-              case 116:
-              case 117:
-              case 118:
-                // reset colors
-                break;
-            }
-
-            this._terminal.params = [];
-            this._terminal.currentParam = 0;
-            this._state = ParserState.NORMAL;
-          } else {
-            if (!this._terminal.params.length) {
-              if (ch >= '0' && ch <= '9') {
-                this._terminal.currentParam =
-                  this._terminal.currentParam * 10 + ch.charCodeAt(0) - 48;
-              } else if (ch === ';') {
-                this._terminal.params.push(this._terminal.currentParam);
-                this._terminal.currentParam = '';
-              }
-            } else {
-              this._terminal.currentParam += ch;
-            }
-          }
-          break;
-
-        case ParserState.CSI_PARAM:
-          if (ch in csiParamStateHandler) {
-            csiParamStateHandler[ch](this);
-            break;
-          }
-          this.finalizeParam();
-          // Fall through the CSI as this character should be the CSI code.
-          this._state = ParserState.CSI;
-
-        case ParserState.CSI:
-          if (ch in csiStateHandler) {
-            if (this._terminal.debug) {
-              this._terminal.log(`CSI ${this._terminal.prefix ? this._terminal.prefix : ''} ${this._terminal.params ? this._terminal.params.join(';') : ''} ${this._terminal.postfix ? this._terminal.postfix : ''} ${ch}`);
-            }
-            csiStateHandler[ch](this._inputHandler, this._terminal.params, this._terminal.prefix, this._terminal.postfix, this);
-          } else {
-            this._terminal.error('Unknown CSI code: %s.', ch);
-          }
-
-          this._state = ParserState.NORMAL;
-          this._terminal.prefix = '';
-          this._terminal.postfix = '';
-          break;
-
-        case ParserState.DCS:
-          if (ch === C0.ESC || ch === C0.BEL) {
-            if (ch === C0.ESC) this._position++;
-            let pt;
-            let valid: boolean;
-
-            switch (this._terminal.prefix) {
-              // User-Defined Keys (DECUDK).
-              case '':
-                break;
-
-              // Request Status String (DECRQSS).
-              // test: echo -e '\eP$q"p\e\\'
-              case '$q':
-                pt = this._terminal.currentParam;
-                valid = false;
-
-                switch (pt) {
-                  // DECSCA
-                  case '"q':
-                    pt = '0"q';
-                    break;
-
-                  // DECSCL
-                  case '"p':
-                    pt = '61"p';
-                    break;
-
-                  // DECSTBM
-                  case 'r':
-                    pt = ''
-                      + (this._terminal.buffer.scrollTop + 1)
-                      + ';'
-                      + (this._terminal.buffer.scrollBottom + 1)
-                      + 'r';
-                    break;
-
-                  // SGR
-                  case 'm':
-                    pt = '0m';
-                    break;
-
-                  default:
-                    this._terminal.error('Unknown DCS Pt: %s.', pt);
-                    pt = '';
-                    break;
-                }
-
-                this._terminal.send(C0.ESC + 'P' + +valid + '$r' + pt + C0.ESC + '\\');
-                break;
-
-              // Set Termcap/Terminfo Data (xterm, experimental).
-              case '+p':
-                break;
-
-              // Request Termcap/Terminfo String (xterm, experimental)
-              // Regular xterm does not even respond to this sequence.
-              // This can cause a small glitch in vim.
-              // test: echo -ne '\eP+q6b64\e\\'
-              case '+q':
-                pt = this._terminal.currentParam;
-                valid = false;
-
-                this._terminal.send(C0.ESC + 'P' + +valid + '+r' + pt + C0.ESC + '\\');
-                break;
-
-              default:
-                this._terminal.error('Unknown DCS prefix: %s.', this._terminal.prefix);
-                break;
-            }
-
-            this._terminal.currentParam = 0;
-            this._terminal.prefix = '';
-            this._state = ParserState.NORMAL;
-          } else if (!this._terminal.currentParam) {
-            if (!this._terminal.prefix && ch !== '$' && ch !== '+') {
-              this._terminal.currentParam = ch;
-            } else if (this._terminal.prefix.length === 2) {
-              this._terminal.currentParam = ch;
-            } else {
-              this._terminal.prefix += ch;
-            }
-          } else {
-            this._terminal.currentParam += ch;
-          }
-          break;
-
-        case ParserState.IGNORE:
-          // For PM and APC.
-          if (ch === C0.ESC || ch === C0.BEL) {
-            if (ch === C0.ESC) this._position++;
-            this._state = ParserState.NORMAL;
-          }
-          break;
-      }
-    }
-
-    // Fire the cursormove event if it's moved. This is done inside the parser
-    // as a render cannot happen in the middle of a parsing round.
-    if (this._terminal.buffer.x !== cursorStartX || this._terminal.buffer.y !== cursorStartY) {
-      this._terminal.emit('cursormove');
-    }
-
-    return this._state;
-  }
-
-  /**
-   * Set the parser's current parsing state.
-   *
-   * @param state The new state.
-   */
-  public setState(state: ParserState): void {
-    this._state = state;
-  }
-
-  /**
-   * Sets the parsier's current prefix. CSI codes can have prefixes of '?', '>'
-   * or '!'.
-   *
-   * @param prefix The prefix.
-   */
-  public setPrefix(prefix: string): void {
-    this._terminal.prefix = prefix;
-  }
-
-  /**
-   * Sets the parsier's current prefix. CSI codes can have postfixes of '$',
-   * '"', ' ', '\''.
-   *
-   * @param postfix The postfix.
-   */
-  public setPostfix(postfix: string): void {
-    this._terminal.postfix = postfix;
-  }
-
-  /**
-   * Sets the parser's current parameter.
-   *
-   * @param param the parameter.
-   */
-  public setParam(param: number): void {
-    this._terminal.currentParam = param;
-  }
-
-  /**
-   * Gets the parser's current parameter.
-   */
-  public getParam(): number {
-    return this._terminal.currentParam;
-  }
-
-  /**
-   * Finalizes the parser's current parameter, adding it to the list of
-   * parameters and setting the new current parameter to 0.
-   */
-  public finalizeParam(): void {
-    this._terminal.params.push(this._terminal.currentParam);
-    this._terminal.currentParam = 0;
-  }
-
-  /**
-   * Tell the parser to skip the next character.
-   */
-  public skipNextChar(): void {
-    this._position++;
-  }
-
-  /**
-   * Tell the parser to repeat parsing the current character (for example if it
-   * needs parsing using a different state.
-   */
-  // public repeatChar(): void {
-  //   this._position--;
-  // }
-}

src/SelectionManager.test.ts

@@ -3,16 +3,15 @@
  * @license MIT
  */
 
-import jsdom = require('jsdom');
 import { assert } from 'chai';
-import { ITerminal, ICircularList, IBuffer } from './Interfaces';
-import { CharMeasure } from './utils/CharMeasure';
-import { CircularList } from './utils/CircularList';
-import { SelectionManager } from './SelectionManager';
+import { CharMeasure } from './CharMeasure';
+import { SelectionManager, SelectionMode } from './SelectionManager';
 import { SelectionModel } from './SelectionModel';
 import { BufferSet } from './BufferSet';
-import { MockTerminal } from './utils/TestUtils.test';
-import { LineData, CharData } from './Types';
+import { ITerminal, IBuffer } from './Types';
+import { IBufferLine } from './core/Types';
+import { MockTerminal } from './TestUtils.test';
+import { BufferLine, CellData } from './core/buffer/BufferLine';
 
 class TestMockTerminal extends MockTerminal {
   emit(event: string, data: any): void {}
@@ -21,16 +20,18 @@ class TestMockTerminal extends MockTerminal {
 class TestSelectionManager extends SelectionManager {
   constructor(
     terminal: ITerminal,
-    buffer: IBuffer,
     charMeasure: CharMeasure
   ) {
-    super(terminal, buffer, charMeasure);
+    super(terminal, charMeasure);
   }
 
   public get model(): SelectionModel { return this._model; }
 
+  public set selectionMode(mode: SelectionMode) { this._activeSelectionMode = mode; }
+
   public selectLineAt(line: number): void { this._selectLineAt(line); }
-  public selectWordAt(coords: [number, number]): void { this._selectWordAt(coords); }
+  public selectWordAt(coords: [number, number]): void { this._selectWordAt(coords, true); }
+  public areCoordsInSelection(coords: [number, number], start: [number, number], end: [number, number]): boolean { return this._areCoordsInSelection(coords, start, end); }
 
   // Disable DOM interaction
   public enable(): void {}
@@ -39,39 +40,33 @@ class TestSelectionManager extends SelectionManager {
 }
 
 describe('SelectionManager', () => {
-  let dom: jsdom.JSDOM;
-  let window: Window;
-  let document: Document;
-
   let terminal: ITerminal;
   let buffer: IBuffer;
-  let rowContainer: HTMLElement;
   let selectionManager: TestSelectionManager;
 
   beforeEach(() => {
-    dom = new jsdom.JSDOM('');
-    window = dom.window;
-    document = window.document;
     terminal = new TestMockTerminal();
-    terminal.cols = 80;
-    terminal.rows = 2;
+    (terminal as any).cols = 80;
+    (terminal as any).rows = 2;
     terminal.options.scrollback = 100;
     terminal.buffers = new BufferSet(terminal);
     terminal.buffer = terminal.buffers.active;
     buffer = terminal.buffer;
-    selectionManager = new TestSelectionManager(terminal, buffer, null);
+    selectionManager = new TestSelectionManager(terminal, null);
   });
 
-  function stringToRow(text: string): LineData {
-    let result: LineData = [];
+  function stringToRow(text: string): IBufferLine {
+    const result = new BufferLine(text.length);
     for (let i = 0; i < text.length; i++) {
-      result.push([0, text.charAt(i), 1, text.charCodeAt(i)]);
+      result.setCell(i, CellData.fromCharData([0, text.charAt(i), 1, text.charCodeAt(i)]));
     }
     return result;
   }
 
-  function stringArrayToRow(chars: string[]): LineData {
-    return chars.map(c => <CharData>[0, c, 1, c.charCodeAt(0)]);
+  function stringArrayToRow(chars: string[]): IBufferLine {
+    const line = new BufferLine(chars.length);
+    chars.map((c, idx) => line.setCell(idx, CellData.fromCharData([0, c, 1, c.charCodeAt(0)])));
+    return line;
   }
 
   describe('_selectWordAt', () => {
@@ -107,7 +102,7 @@ describe('SelectionManager', () => {
     });
     it('should expand selection for wide characters', () => {
       // Wide characters use a special format
-      buffer.lines.set(0, [
+      const data: [number, string, number, number][] = [
         [null, '中', 2, '中'.charCodeAt(0)],
         [null, '', 0, null],
         [null, '文', 2, '文'.charCodeAt(0)],
@@ -123,7 +118,10 @@ describe('SelectionManager', () => {
         [null, 'f', 1, 'f'.charCodeAt(0)],
         [null, 'o', 1, 'o'.charCodeAt(0)],
         [null, 'o', 1, 'o'.charCodeAt(0)]
-      ]);
+      ];
+      const line = new BufferLine(data.length);
+      for (let i = 0; i < data.length; ++i) line.setCell(i, CellData.fromCharData(data[i]));
+      buffer.lines.set(0, line);
       // Ensure wide characters take up 2 columns
       selectionManager.selectWordAt([0, 0]);
       assert.equal(selectionManager.selectionText, '中文');
@@ -193,6 +191,42 @@ describe('SelectionManager', () => {
       selectionManager.selectWordAt([15, 0]);
       assert.equal(selectionManager.selectionText, 'ij"');
     });
+    it('should expand upwards or downards for wrapped lines', () => {
+      buffer.lines.set(0, stringToRow('                                                                             foo'));
+      buffer.lines.set(1, stringToRow('bar                                                                             '));
+      buffer.lines.get(1).isWrapped = true;
+      selectionManager.selectWordAt([1, 1]);
+      assert.equal(selectionManager.selectionText, 'foobar');
+      selectionManager.model.clearSelection();
+      selectionManager.selectWordAt([78, 0]);
+      assert.equal(selectionManager.selectionText, 'foobar');
+    });
+    it('should expand both upwards and downwards for word wrapped over many lines', () => {
+      const expectedText = 'fooaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaabbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccbar';
+      buffer.lines.set(0, stringToRow('                                                                             foo'));
+      buffer.lines.set(1, stringToRow('aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa'));
+      buffer.lines.set(2, stringToRow('bbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb'));
+      buffer.lines.set(3, stringToRow('cccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccc'));
+      buffer.lines.set(4, stringToRow('bar                                                                             '));
+      buffer.lines.get(1).isWrapped = true;
+      buffer.lines.get(2).isWrapped = true;
+      buffer.lines.get(3).isWrapped = true;
+      buffer.lines.get(4).isWrapped = true;
+      selectionManager.selectWordAt([78, 0]);
+      assert.equal(selectionManager.selectionText, expectedText);
+      selectionManager.model.clearSelection();
+      selectionManager.selectWordAt([40, 1]);
+      assert.equal(selectionManager.selectionText, expectedText);
+      selectionManager.model.clearSelection();
+      selectionManager.selectWordAt([40, 2]);
+      assert.equal(selectionManager.selectionText, expectedText);
+      selectionManager.model.clearSelection();
+      selectionManager.selectWordAt([40, 3]);
+      assert.equal(selectionManager.selectionText, expectedText);
+      selectionManager.model.clearSelection();
+      selectionManager.selectWordAt([1, 4]);
+      assert.equal(selectionManager.selectionText, expectedText);
+    });
     describe('emoji', () => {
       it('should treat a single emoji as a word when wrapped in spaces', () => {
         buffer.lines.set(0, stringToRow(' ⚽ a')); // The a is here to prevent the space being trimmed in selectionText
@@ -310,6 +344,16 @@ describe('SelectionManager', () => {
       assert.deepEqual(selectionManager.model.finalSelectionStart, [0, 0]);
       assert.deepEqual(selectionManager.model.finalSelectionEnd, [terminal.cols, 0], 'The actual selection spans the entire column');
     });
+    it('should select the entire wrapped line', () => {
+      buffer.lines.set(0, stringToRow('foo'));
+      const line2 = stringToRow('bar');
+      line2.isWrapped = true;
+      buffer.lines.set(1, line2);
+      selectionManager.selectLineAt(0);
+      assert.equal(selectionManager.selectionText, 'foobar', 'The selected text is correct');
+      assert.deepEqual(selectionManager.model.finalSelectionStart, [0, 0]);
+      assert.deepEqual(selectionManager.model.finalSelectionEnd, [terminal.cols, 1], 'The actual selection spans the entire column');
+    });
   });
 
   describe('selectAll', () => {
@@ -326,6 +370,45 @@ describe('SelectionManager', () => {
     });
   });
 
+  describe('selectLines', () => {
+    it('should select a single line', () => {
+      buffer.lines.length = 3;
+      buffer.lines.set(0, stringToRow('1'));
+      buffer.lines.set(1, stringToRow('2'));
+      buffer.lines.set(2, stringToRow('3'));
+      selectionManager.selectLines(1, 1);
+      assert.deepEqual(selectionManager.model.finalSelectionStart, [0, 1]);
+      assert.deepEqual(selectionManager.model.finalSelectionEnd, [terminal.cols, 1]);
+    });
+    it('should select multiple lines', () => {
+      buffer.lines.length = 5;
+      buffer.lines.set(0, stringToRow('1'));
+      buffer.lines.set(1, stringToRow('2'));
+      buffer.lines.set(2, stringToRow('3'));
+      buffer.lines.set(3, stringToRow('4'));
+      buffer.lines.set(4, stringToRow('5'));
+      selectionManager.selectLines(1, 3);
+      assert.deepEqual(selectionManager.model.finalSelectionStart, [0, 1]);
+      assert.deepEqual(selectionManager.model.finalSelectionEnd, [terminal.cols, 3]);
+    });
+    it('should select the to the start when requesting a negative row', () => {
+      buffer.lines.length = 2;
+      buffer.lines.set(0, stringToRow('1'));
+      buffer.lines.set(1, stringToRow('2'));
+      selectionManager.selectLines(-1, 0);
+      assert.deepEqual(selectionManager.model.finalSelectionStart, [0, 0]);
+      assert.deepEqual(selectionManager.model.finalSelectionEnd, [terminal.cols, 0]);
+    });
+    it('should select the to the end when requesting beyond the final row', () => {
+      buffer.lines.length = 2;
+      buffer.lines.set(0, stringToRow('1'));
+      buffer.lines.set(1, stringToRow('2'));
+      selectionManager.selectLines(1, 2);
+      assert.deepEqual(selectionManager.model.finalSelectionStart, [0, 1]);
+      assert.deepEqual(selectionManager.model.finalSelectionEnd, [terminal.cols, 1]);
+    });
+  });
+
   describe('hasSelection', () => {
     it('should return whether there is a selection', () => {
       selectionManager.model.selectionStart = [0, 0];
@@ -341,4 +424,73 @@ describe('SelectionManager', () => {
       assert.equal(selectionManager.hasSelection, true);
     });
   });
+
+  describe('column selection', () => {
+    it('should select a column of text', () => {
+      buffer.lines.length = 3;
+      buffer.lines.set(0, stringToRow('abcdefghij'));
+      buffer.lines.set(1, stringToRow('klmnopqrst'));
+      buffer.lines.set(2, stringToRow('uvwxyz'));
+
+      selectionManager.selectionMode = SelectionMode.COLUMN;
+      selectionManager.model.selectionStart = [2, 0];
+      selectionManager.model.selectionEnd = [4, 2];
+
+      assert.equal(selectionManager.selectionText, 'cd\nmn\nwx');
+    });
+
+    it('should select a column of text without chopping up double width characters', () => {
+      buffer.lines.length = 3;
+      buffer.lines.set(0, stringToRow('a'));
+      buffer.lines.set(1, stringToRow('語'));
+      buffer.lines.set(2, stringToRow('b'));
+
+      selectionManager.selectionMode = SelectionMode.COLUMN;
+      selectionManager.model.selectionStart = [0, 0];
+      selectionManager.model.selectionEnd = [1, 2];
+
+      assert.equal(selectionManager.selectionText, 'a\n語\nb');
+    });
+
+    it('should select a column of text with single character emojis', () => {
+      buffer.lines.length = 3;
+      buffer.lines.set(0, stringToRow('a'));
+      buffer.lines.set(1, stringToRow('☃'));
+      buffer.lines.set(2, stringToRow('c'));
+
+      selectionManager.selectionMode = SelectionMode.COLUMN;
+      selectionManager.model.selectionStart = [0, 0];
+      selectionManager.model.selectionEnd = [1, 2];
+
+      assert.equal(selectionManager.selectionText, 'a\n☃\nc');
+    });
+
+    it('should select a column of text with double character emojis', () => {
+      // TODO the case this is testing works for me in the demo webapp,
+      // but doing it programmatically fails.
+      buffer.lines.length = 3;
+      buffer.lines.set(0, stringToRow('a '));
+      buffer.lines.set(1, stringArrayToRow(['😁', ' ']));
+      buffer.lines.set(2, stringToRow('c '));
+
+      selectionManager.selectionMode = SelectionMode.COLUMN;
+      selectionManager.model.selectionStart = [0, 0];
+      selectionManager.model.selectionEnd = [1, 2];
+
+      assert.equal(selectionManager.selectionText, 'a\n😁\nc');
+    });
+  });
+
+  describe('_areCoordsInSelection', () => {
+    it('should return whether coords are in the selection', () => {
+      assert.isFalse(selectionManager.areCoordsInSelection([0, 0], [2, 0], [2, 1]));
+      assert.isFalse(selectionManager.areCoordsInSelection([1, 0], [2, 0], [2, 1]));
+      assert.isTrue(selectionManager.areCoordsInSelection([2, 0], [2, 0], [2, 1]));
+      assert.isTrue(selectionManager.areCoordsInSelection([10, 0], [2, 0], [2, 1]));
+      assert.isTrue(selectionManager.areCoordsInSelection([0, 1], [2, 0], [2, 1]));
+      assert.isTrue(selectionManager.areCoordsInSelection([1, 1], [2, 0], [2, 1]));
+      assert.isFalse(selectionManager.areCoordsInSelection([2, 1], [2, 0], [2, 1]));
+    });
+  });
 });
+

src/SelectionManager.ts

@@ -3,15 +3,16 @@
  * @license MIT
  */
 
-import { MouseHelper } from './utils/MouseHelper';
-import * as Browser from './utils/Browser';
-import { CharMeasure } from './utils/CharMeasure';
-import { CircularList } from './utils/CircularList';
-import { EventEmitter } from './EventEmitter';
-import { ITerminal, ICircularList, ISelectionManager, IBuffer } from './Interfaces';
+import { ITerminal, ISelectionManager, IBuffer, ISelectionRedrawRequestEvent } from './Types';
+import { IBufferLine } from './core/Types';
+import { MouseHelper } from './MouseHelper';
+import * as Browser from './common/Platform';
+import { CharMeasure } from './CharMeasure';
 import { SelectionModel } from './SelectionModel';
-import { LineData, CharData } from './Types';
-import { CHAR_DATA_WIDTH_INDEX, CHAR_DATA_CHAR_INDEX } from './Buffer';
+import { AltClickHandler } from './handlers/AltClickHandler';
+import { CellData } from './core/buffer/BufferLine';
+import { IDisposable } from 'xterm';
+import { EventEmitter2, IEvent } from './common/EventEmitter2';
 
 /**
  * The number of pixels the mouse needs to be above or below the viewport in
@@ -29,6 +30,12 @@ const DRAG_SCROLL_MAX_SPEED = 15;
  */
 const DRAG_SCROLL_INTERVAL = 50;
 
+/**
+ * The maximum amount of time that can have elapsed for an alt click to move the
+ * cursor.
+ */
+const ALT_CLICK_MOVE_CURSOR_TIME = 500;
+
 /**
  * A string containing all characters that are considered word separated by the
  * double click to select work logic.
@@ -49,10 +56,11 @@ interface IWordPosition {
 /**
  * A selection mode, this drives how the selection behaves on mouse move.
  */
-enum SelectionMode {
+export const enum SelectionMode {
   NORMAL,
   WORD,
-  LINE
+  LINE,
+  COLUMN
 }
 
 /**
@@ -60,10 +68,10 @@ enum SelectionMode {
  * SelectionModel, SelectionManager handles with all logic associated with
  * dealing with the selection, including handling mouse interaction, wide
  * characters and fetching the actual text within the selection. Rendering is
- * not handled by the SelectionManager but a 'refresh' event is fired when the
- * selection is ready to be redrawn.
+ * not handled by the SelectionManager but the onRedrawRequest event is fired
+ * when the selection is ready to be redrawn (on an animation frame).
  */
-export class SelectionManager extends EventEmitter implements ISelectionManager {
+export class SelectionManager implements ISelectionManager {
   protected _model: SelectionModel;
 
   /**
@@ -75,7 +83,7 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
   /**
    * The current selection mode.
    */
-  private _activeSelectionMode: SelectionMode;
+  protected _activeSelectionMode: SelectionMode;
 
   /**
    * A setInterval timer that is active while the mouse is down whose callback
@@ -95,13 +103,22 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
 
   private _mouseMoveListener: EventListener;
   private _mouseUpListener: EventListener;
+  private _trimListener: IDisposable;
+  private _workCell: CellData = new CellData();
+
+  private _mouseDownTimeStamp: number;
+
+  private _onLinuxMouseSelection = new EventEmitter2<string>();
+  public get onLinuxMouseSelection(): IEvent<string> { return this._onLinuxMouseSelection.event; }
+  private _onRedrawRequest = new EventEmitter2<ISelectionRedrawRequestEvent>();
+  public get onRedrawRequest(): IEvent<ISelectionRedrawRequestEvent> { return this._onRedrawRequest.event; }
+  private _onSelectionChange = new EventEmitter2<void>();
+  public get onSelectionChange(): IEvent<void> { return this._onSelectionChange.event; }
 
   constructor(
     private _terminal: ITerminal,
-    private _buffer: IBuffer,
     private _charMeasure: CharMeasure
   ) {
-    super();
     this._initListeners();
     this.enable();
 
@@ -109,6 +126,14 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
     this._activeSelectionMode = SelectionMode.NORMAL;
   }
 
+  public dispose(): void {
+    this._removeMouseDownListeners();
+  }
+
+  private get _buffer(): IBuffer {
+    return this._terminal.buffers.active;
+  }
+
   /**
    * Initializes listener variables.
    */
@@ -116,11 +141,12 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
     this._mouseMoveListener = event => this._onMouseMove(<MouseEvent>event);
     this._mouseUpListener = event => this._onMouseUp(<MouseEvent>event);
 
-    // Only adjust the selection on trim, shiftElements is rarely used (only in
-    // reverseIndex) and delete in a splice is only ever used when the same
-    // number of elements was just added. Given this is could actually be
-    // beneficial to leave the selection as is for these cases.
-    this._buffer.lines.on('trim', (amount: number) => this._onTrim(amount));
+    this.initBuffersListeners();
+  }
+
+  public initBuffersListeners(): void {
+    this._trimListener = this._terminal.buffer.lines.onTrim(amount => this._onTrim(amount));
+    this._terminal.buffers.onBufferActivate(e => this._onBufferActivate(e));
   }
 
   /**
@@ -139,16 +165,6 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
     this._enabled = true;
   }
 
-  /**
-   * Sets the active buffer, this should be called when the alt buffer is
-   * switched in or out.
-   * @param buffer The active buffer.
-   */
-  public setBuffer(buffer: IBuffer): void {
-    this._buffer = buffer;
-    this.clearSelection();
-  }
-
   public get selectionStart(): [number, number] { return this._model.finalSelectionStart; }
   public get selectionEnd(): [number, number] { return this._model.finalSelectionEnd; }
 
@@ -174,30 +190,43 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
       return '';
     }
 
-    // Get first row
-    const startRowEndCol = start[1] === end[1] ? end[0] : null;
-    let result: string[] = [];
-    result.push(this._buffer.translateBufferLineToString(start[1], true, start[0], startRowEndCol));
+    const result: string[] = [];
 
-    // Get middle rows
-    for (let i = start[1] + 1; i <= end[1] - 1; i++) {
-      const bufferLine = this._buffer.lines.get(i);
-      const lineText = this._buffer.translateBufferLineToString(i, true);
-      if ((<any>bufferLine).isWrapped) {
-        result[result.length - 1] += lineText;
-      } else {
+    if (this._activeSelectionMode === SelectionMode.COLUMN) {
+      // Ignore zero width selections
+      if (start[0] === end[0]) {
+        return '';
+      }
+
+      for (let i = start[1]; i <= end[1]; i++) {
+        const lineText = this._buffer.translateBufferLineToString(i, true, start[0], end[0]);
         result.push(lineText);
       }
-    }
+    } else {
+      // Get first row
+      const startRowEndCol = start[1] === end[1] ? end[0] : undefined;
+      result.push(this._buffer.translateBufferLineToString(start[1], true, start[0], startRowEndCol));
 
-    // Get final row
-    if (start[1] !== end[1]) {
-      const bufferLine = this._buffer.lines.get(end[1]);
-      const lineText = this._buffer.translateBufferLineToString(end[1], true, 0, end[0]);
-      if ((<any>bufferLine).isWrapped) {
-        result[result.length - 1] += lineText;
-      } else {
-        result.push(lineText);
+      // Get middle rows
+      for (let i = start[1] + 1; i <= end[1] - 1; i++) {
+        const bufferLine = this._buffer.lines.get(i);
+        const lineText = this._buffer.translateBufferLineToString(i, true);
+        if (bufferLine.isWrapped) {
+          result[result.length - 1] += lineText;
+        } else {
+          result.push(lineText);
+        }
+      }
+
+      // Get final row
+      if (start[1] !== end[1]) {
+        const bufferLine = this._buffer.lines.get(end[1]);
+        const lineText = this._buffer.translateBufferLineToString(end[1], true, 0, end[0]);
+        if (bufferLine.isWrapped) {
+          result[result.length - 1] += lineText;
+        } else {
+          result.push(lineText);
+        }
       }
     }
 
@@ -217,14 +246,15 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
     this._model.clearSelection();
     this._removeMouseDownListeners();
     this.refresh();
+    this._onSelectionChange.fire();
   }
 
   /**
    * Queues a refresh, redrawing the selection on the next opportunity.
-   * @param isNewSelection Whether the selection should be registered as a new
+   * @param isLinuxMouseSelection Whether the selection should be registered as a new
    * selection on Linux.
    */
-  public refresh(isNewSelection?: boolean): void {
+  public refresh(isLinuxMouseSelection?: boolean): void {
     // Queue the refresh for the renderer
     if (!this._refreshAnimationFrame) {
       this._refreshAnimationFrame = window.requestAnimationFrame(() => this._refresh());
@@ -232,10 +262,10 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
 
     // If the platform is Linux and the refresh call comes from a mouse event,
     // we need to update the selection for middle click to paste selection.
-    if (Browser.isLinux && isNewSelection) {
+    if (Browser.isLinux && isLinuxMouseSelection) {
       const selectionText = this.selectionText;
       if (selectionText.length) {
-        this.emit('newselection', this.selectionText);
+        this._onLinuxMouseSelection.fire(this.selectionText);
       }
     }
   }
@@ -246,7 +276,47 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
    */
   private _refresh(): void {
     this._refreshAnimationFrame = null;
-    this.emit('refresh', { start: this._model.finalSelectionStart, end: this._model.finalSelectionEnd });
+    this._onRedrawRequest.fire({
+      start: this._model.finalSelectionStart,
+      end: this._model.finalSelectionEnd,
+      columnSelectMode: this._activeSelectionMode === SelectionMode.COLUMN
+    });
+  }
+
+  /**
+   * Checks if the current click was inside the current selection
+   * @param event The mouse event
+   */
+  public isClickInSelection(event: MouseEvent): boolean {
+    const coords = this._getMouseBufferCoords(event);
+    const start = this._model.finalSelectionStart;
+    const end = this._model.finalSelectionEnd;
+
+    if (!start || !end) {
+      return false;
+    }
+
+    return this._areCoordsInSelection(coords, start, end);
+  }
+
+  protected _areCoordsInSelection(coords: [number, number], start: [number, number], end: [number, number]): boolean {
+    return (coords[1] > start[1] && coords[1] < end[1]) ||
+        (start[1] === end[1] && coords[1] === start[1] && coords[0] >= start[0] && coords[0] < end[0]) ||
+        (start[1] < end[1] && coords[1] === end[1] && coords[0] < end[0]) ||
+        (start[1] < end[1] && coords[1] === start[1] && coords[0] >= start[0]);
+  }
+
+  /**
+   * Selects word at the current mouse event coordinates.
+   * @param event The mouse event.
+   */
+  public selectWordAtCursor(event: MouseEvent): void {
+    const coords = this._getMouseBufferCoords(event);
+    if (coords) {
+      this._selectWordAt(coords, false);
+      this._model.selectionEnd = null;
+      this.refresh(true);
+    }
   }
 
   /**
@@ -255,7 +325,17 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
   public selectAll(): void {
     this._model.isSelectAllActive = true;
     this.refresh();
-    this._terminal.emit('selection');
+    this._onSelectionChange.fire();
+  }
+
+  public selectLines(start: number, end: number): void {
+    this._model.clearSelection();
+    start = Math.max(start, 0);
+    end = Math.min(end, this._terminal.buffer.lines.length - 1);
+    this._model.selectionStart = [0, start];
+    this._model.selectionEnd = [this._terminal.cols, end];
+    this.refresh();
+    this._onSelectionChange.fire();
   }
 
   /**
@@ -274,7 +354,7 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
    * @param event The mouse event.
    */
   private _getMouseBufferCoords(event: MouseEvent): [number, number] {
-    const coords = this._terminal.mouseHelper.getCoords(event, this._terminal.element, this._charMeasure, this._terminal.options.lineHeight, this._terminal.cols, this._terminal.rows, true);
+    const coords = this._terminal.mouseHelper.getCoords(event, this._terminal.screenElement, this._charMeasure, this._terminal.cols, this._terminal.rows, true);
     if (!coords) {
       return null;
     }
@@ -294,7 +374,7 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
    * @param event The mouse event.
    */
   private _getMouseEventScrollAmount(event: MouseEvent): number {
-    let offset = MouseHelper.getCoordsRelativeToElement(event, this._terminal.element)[1];
+    let offset = MouseHelper.getCoordsRelativeToElement(event, this._terminal.screenElement)[1];
     const terminalHeight = this._terminal.rows * Math.ceil(this._charMeasure.height * this._terminal.options.lineHeight);
     if (offset >= 0 && offset <= terminalHeight) {
       return 0;
@@ -314,7 +394,11 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
    * @param event The mouse event.
    */
   public shouldForceSelection(event: MouseEvent): boolean {
-    return Browser.isMac ? event.altKey : event.shiftKey;
+    if (Browser.isMac) {
+      return event.altKey && this._terminal.options.macOptionClickForcesSelection;
+    }
+
+    return event.shiftKey;
   }
 
   /**
@@ -322,6 +406,7 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
    * @param event The mousedown event.
    */
   public onMouseDown(event: MouseEvent): void {
+    this._mouseDownTimeStamp = event.timeStamp;
     // If we have selection, we want the context menu on right click even if the
     // terminal is in mouse mode.
     if (event.button === 2 && this.hasSelection) {
@@ -379,8 +464,10 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
    * Removes the listeners that are registered when mousedown is triggered.
    */
   private _removeMouseDownListeners(): void {
-    this._terminal.element.ownerDocument.removeEventListener('mousemove', this._mouseMoveListener);
-    this._terminal.element.ownerDocument.removeEventListener('mouseup', this._mouseUpListener);
+    if (this._terminal.element.ownerDocument) {
+      this._terminal.element.ownerDocument.removeEventListener('mousemove', this._mouseMoveListener);
+      this._terminal.element.ownerDocument.removeEventListener('mouseup', this._mouseUpListener);
+    }
     clearInterval(this._dragScrollIntervalTimer);
     this._dragScrollIntervalTimer = null;
   }
@@ -404,7 +491,7 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
   private _onSingleClick(event: MouseEvent): void {
     this._model.selectionStartLength = 0;
     this._model.isSelectAllActive = false;
-    this._activeSelectionMode = SelectionMode.NORMAL;
+    this._activeSelectionMode = this.shouldColumnSelect(event) ? SelectionMode.COLUMN : SelectionMode.NORMAL;
 
     // Initialize the new selection
     this._model.selectionStart = this._getMouseBufferCoords(event);
@@ -426,8 +513,7 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
 
     // If the mouse is over the second half of a wide character, adjust the
     // selection to cover the whole character
-    const char = line[this._model.selectionStart[0]];
-    if (char[CHAR_DATA_WIDTH_INDEX] === 0) {
+    if (line.hasWidth(this._model.selectionStart[0]) === 0) {
       this._model.selectionStart[0]++;
     }
   }
@@ -440,7 +526,7 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
     const coords = this._getMouseBufferCoords(event);
     if (coords) {
       this._activeSelectionMode = SelectionMode.WORD;
-      this._selectWordAt(coords);
+      this._selectWordAt(coords, true);
     }
   }
 
@@ -457,6 +543,14 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
     }
   }
 
+  /**
+   * Returns whether the selection manager should operate in column select mode
+   * @param event the mouse or keyboard event
+   */
+  public shouldColumnSelect(event: KeyboardEvent | MouseEvent): boolean {
+    return event.altKey && !(Browser.isMac && this._terminal.options.macOptionClickForcesSelection);
+  }
+
   /**
    * Handles the mousemove event when the mouse button is down, recording the
    * end of the selection and refreshing the selection.
@@ -464,7 +558,7 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
    */
   private _onMouseMove(event: MouseEvent): void {
     // If the mousemove listener is active it means that a selection is
-    // currently being made, we should stop propogation to prevent mouse events
+    // currently being made, we should stop propagation to prevent mouse events
     // to be sent to the pty.
     event.stopImmediatePropagation();
 
@@ -494,19 +588,21 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
     this._dragScrollAmount = this._getMouseEventScrollAmount(event);
 
     // If the cursor was above or below the viewport, make sure it's at the
-    // start or end of the viewport respectively.
-    if (this._dragScrollAmount > 0) {
-      this._model.selectionEnd[0] = this._terminal.cols;
-    } else if (this._dragScrollAmount < 0) {
-      this._model.selectionEnd[0] = 0;
+    // start or end of the viewport respectively. This should only happen when
+    // NOT in column select mode.
+    if (this._activeSelectionMode !== SelectionMode.COLUMN) {
+      if (this._dragScrollAmount > 0) {
+        this._model.selectionEnd[0] = this._terminal.cols;
+      } else if (this._dragScrollAmount < 0) {
+        this._model.selectionEnd[0] = 0;
+      }
     }
 
     // If the character is a wide character include the cell to the right in the
     // selection. Note that selections at the very end of the line will never
     // have a character.
     if (this._model.selectionEnd[1] < this._buffer.lines.length) {
-      const char = this._buffer.lines.get(this._model.selectionEnd[1])[this._model.selectionEnd[0]];
-      if (char && char[CHAR_DATA_WIDTH_INDEX] === 0) {
+      if (this._buffer.lines.get(this._model.selectionEnd[1]).hasWidth(this._model.selectionEnd[0]) === 0) {
         this._model.selectionEnd[0]++;
       }
     }
@@ -527,10 +623,19 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
     if (this._dragScrollAmount) {
       this._terminal.scrollLines(this._dragScrollAmount, false);
       // Re-evaluate selection
+      // If the cursor was above or below the viewport, make sure it's at the
+      // start or end of the viewport respectively. This should only happen when
+      // NOT in column select mode.
       if (this._dragScrollAmount > 0) {
-        this._model.selectionEnd = [this._terminal.cols - 1, this._terminal.buffer.ydisp + this._terminal.rows];
+        if (this._activeSelectionMode !== SelectionMode.COLUMN) {
+          this._model.selectionEnd[0] = this._terminal.cols;
+        }
+        this._model.selectionEnd[1] = Math.min(this._terminal.buffer.ydisp + this._terminal.rows, this._terminal.buffer.lines.length - 1);
       } else {
-        this._model.selectionEnd = [0, this._terminal.buffer.ydisp];
+        if (this._activeSelectionMode !== SelectionMode.COLUMN) {
+          this._model.selectionEnd[0] = 0;
+        }
+        this._model.selectionEnd[1] = this._terminal.buffer.ydisp;
       }
       this.refresh();
     }
@@ -541,10 +646,27 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
    * @param event The mouseup event.
    */
   private _onMouseUp(event: MouseEvent): void {
+    const timeElapsed = event.timeStamp - this._mouseDownTimeStamp;
+
     this._removeMouseDownListeners();
 
-    if (this.hasSelection)
-      this._terminal.emit('selection');
+    if (this.selectionText.length <= 1 && timeElapsed < ALT_CLICK_MOVE_CURSOR_TIME) {
+      (new AltClickHandler(event, this._terminal)).move();
+    } else if (this.hasSelection) {
+      this._onSelectionChange.fire();
+    }
+  }
+
+  private _onBufferActivate(e: {activeBuffer: IBuffer, inactiveBuffer: IBuffer}): void {
+    this.clearSelection();
+    // Only adjust the selection on trim, shiftElements is rarely used (only in
+    // reverseIndex) and delete in a splice is only ever used when the same
+    // number of elements was just added. Given this is could actually be
+    // beneficial to leave the selection as is for these cases.
+    if (this._trimListener) {
+      this._trimListener.dispose();
+    }
+    this._trimListener = e.activeBuffer.lines.onTrim(amount => this._onTrim(amount));
   }
 
   /**
@@ -552,19 +674,19 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
    * latter takes into account wide characters.
    * @param coords The coordinates to find the 2 index for.
    */
-  private _convertViewportColToCharacterIndex(bufferLine: any, coords: [number, number]): number {
+  private _convertViewportColToCharacterIndex(bufferLine: IBufferLine, coords: [number, number]): number {
     let charIndex = coords[0];
     for (let i = 0; coords[0] >= i; i++) {
-      const char = bufferLine[i];
-      if (char[CHAR_DATA_WIDTH_INDEX] === 0) {
+      const length = bufferLine.loadCell(i, this._workCell).getChars().length;
+      if (this._workCell.getWidth() === 0) {
         // Wide characters aren't included in the line string so decrement the
         // index so the index is back on the wide character.
         charIndex--;
-      } else if (char[CHAR_DATA_CHAR_INDEX].length > 1 && coords[0] !== i) {
+      } else if (length > 1 && coords[0] !== i) {
         // Emojis take up multiple characters, so adjust accordingly. For these
         // we don't want ot include the character at the column as we're
         // returning the start index in the string, not the end index.
-        charIndex += char[CHAR_DATA_CHAR_INDEX].length - 1;
+        charIndex += length - 1;
       }
     }
     return charIndex;
@@ -582,7 +704,12 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
    * Gets positional information for the word at the coordinated specified.
    * @param coords The coordinates to get the word at.
    */
-  private _getWordAt(coords: [number, number]): IWordPosition {
+  private _getWordAt(coords: [number, number], allowWhitespaceOnlySelection: boolean, followWrappedLinesAbove: boolean = true, followWrappedLinesBelow: boolean = true): IWordPosition {
+    // Ensure coords are within viewport (eg. not within scroll bar)
+    if (coords[0] >= this._terminal.cols) {
+      return null;
+    }
+
     const bufferLine = this._buffer.lines.get(coords[1]);
     if (!bufferLine) {
       return null;
@@ -619,48 +746,51 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
 
       // Consider the initial position, skip it and increment the wide char
       // variable
-      if (bufferLine[startCol][CHAR_DATA_WIDTH_INDEX] === 0) {
+      if (bufferLine.getWidth(startCol) === 0) {
         leftWideCharCount++;
         startCol--;
       }
-      if (bufferLine[endCol][CHAR_DATA_WIDTH_INDEX] === 2) {
+      if (bufferLine.getWidth(endCol) === 2) {
         rightWideCharCount++;
         endCol++;
       }
 
       // Adjust the end index for characters whose length are > 1 (emojis)
-      if (bufferLine[endCol][CHAR_DATA_CHAR_INDEX].length > 1) {
-        rightLongCharOffset += bufferLine[endCol][CHAR_DATA_CHAR_INDEX].length - 1;
-        endIndex += bufferLine[endCol][CHAR_DATA_CHAR_INDEX].length - 1;
+      const length = bufferLine.getString(endCol).length;
+      if (length > 1) {
+        rightLongCharOffset += length - 1;
+        endIndex += length - 1;
       }
 
       // Expand the string in both directions until a space is hit
-      while (startCol > 0 && startIndex > 0 && !this._isCharWordSeparator(bufferLine[startCol - 1])) {
-        const char = bufferLine[startCol - 1];
-        if (char[CHAR_DATA_WIDTH_INDEX] === 0) {
+      while (startCol > 0 && startIndex > 0 && !this._isCharWordSeparator(bufferLine.loadCell(startCol - 1, this._workCell))) {
+        bufferLine.loadCell(startCol - 1, this._workCell);
+        const length = this._workCell.getChars().length;
+        if (this._workCell.getWidth() === 0) {
           // If the next character is a wide char, record it and skip the column
           leftWideCharCount++;
           startCol--;
-        } else if (char[CHAR_DATA_CHAR_INDEX].length > 1) {
+        } else if (length > 1) {
           // If the next character's string is longer than 1 char (eg. emoji),
           // adjust the index
-          leftLongCharOffset += char[CHAR_DATA_CHAR_INDEX].length - 1;
-          startIndex -= char[CHAR_DATA_CHAR_INDEX].length - 1;
+          leftLongCharOffset += length - 1;
+          startIndex -= length - 1;
         }
         startIndex--;
         startCol--;
       }
-      while (endCol < bufferLine.length && endIndex + 1 < line.length && !this._isCharWordSeparator(bufferLine[endCol + 1])) {
-        const char = bufferLine[endCol + 1];
-        if (char[CHAR_DATA_WIDTH_INDEX] === 2) {
+      while (endCol < bufferLine.length && endIndex + 1 < line.length && !this._isCharWordSeparator(bufferLine.loadCell(endCol + 1, this._workCell))) {
+        bufferLine.loadCell(endCol + 1, this._workCell);
+        const length = this._workCell.getChars().length;
+        if (this._workCell.getWidth() === 2) {
           // If the next character is a wide char, record it and skip the column
           rightWideCharCount++;
           endCol++;
-        } else if (char[CHAR_DATA_CHAR_INDEX].length > 1) {
+        } else if (length > 1) {
           // If the next character's string is longer than 1 char (eg. emoji),
           // adjust the index
-          rightLongCharOffset += char[CHAR_DATA_CHAR_INDEX].length - 1;
-          endIndex += char[CHAR_DATA_CHAR_INDEX].length - 1;
+          rightLongCharOffset += length - 1;
+          endIndex += length - 1;
         }
         endIndex++;
         endCol++;
@@ -672,7 +802,7 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
 
     // Calculate the start _column_, converting the the string indexes back to
     // column coordinates.
-    const start =
+    let start =
         startIndex // The index of the selection's start char in the line string
         + charOffset // The difference between the initial char's column and index
         - leftWideCharCount // The number of wide chars left of the initial char
@@ -680,7 +810,7 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
 
     // Calculate the length in _columns_, converting the the string indexes back
     // to column coordinates.
-    const length = Math.min(this._terminal.cols, // Disallow lengths larger than the terminal cols
+    let length = Math.min(this._terminal.cols, // Disallow lengths larger than the terminal cols
         endIndex // The index of the selection's end char in the line string
         - startIndex // The index of the selection's start char in the line string
         + leftWideCharCount // The number of wide chars left of the initial char
@@ -688,16 +818,54 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
         - leftLongCharOffset // The number of additional chars left of the initial char added by columns with strings longer than 1 (emojis)
         - rightLongCharOffset); // The number of additional chars right of the initial char (inclusive) added by columns with strings longer than 1 (emojis)
 
+    if (!allowWhitespaceOnlySelection && line.slice(startIndex, endIndex).trim() === '') {
+      return null;
+    }
+
+    // Recurse upwards if the line is wrapped and the word wraps to the above line
+    if (followWrappedLinesAbove) {
+      if (start === 0 && bufferLine.getCodePoint(0) !== 32 /*' '*/) {
+        const previousBufferLine = this._buffer.lines.get(coords[1] - 1);
+        if (previousBufferLine && bufferLine.isWrapped && previousBufferLine.getCodePoint(this._terminal.cols - 1) !== 32 /*' '*/) {
+          const previousLineWordPosition = this._getWordAt([this._terminal.cols - 1, coords[1] - 1], false, true, false);
+          if (previousLineWordPosition) {
+            const offset = this._terminal.cols - previousLineWordPosition.start;
+            start -= offset;
+            length += offset;
+          }
+        }
+      }
+    }
+
+    // Recurse downwards if the line is wrapped and the word wraps to the next line
+    if (followWrappedLinesBelow) {
+      if (start + length === this._terminal.cols && bufferLine.getCodePoint(this._terminal.cols - 1) !== 32 /*' '*/) {
+        const nextBufferLine = this._buffer.lines.get(coords[1] + 1);
+        if (nextBufferLine && nextBufferLine.isWrapped && nextBufferLine.getCodePoint(0) !== 32 /*' '*/) {
+          const nextLineWordPosition = this._getWordAt([0, coords[1] + 1], false, false, true);
+          if (nextLineWordPosition) {
+            length += nextLineWordPosition.length;
+          }
+        }
+      }
+    }
+
     return { start, length };
   }
 
   /**
    * Selects the word at the coordinates specified.
    * @param coords The coordinates to get the word at.
+   * @param allowWhitespaceOnlySelection If whitespace should be selected
    */
-  protected _selectWordAt(coords: [number, number]): void {
-    const wordPosition = this._getWordAt(coords);
+  protected _selectWordAt(coords: [number, number], allowWhitespaceOnlySelection: boolean): void {
+    const wordPosition = this._getWordAt(coords, allowWhitespaceOnlySelection);
     if (wordPosition) {
+      // Adjust negative start value
+      while (wordPosition.start < 0) {
+        wordPosition.start += this._terminal.cols;
+        coords[1]--;
+      }
       this._model.selectionStart = [wordPosition.start, coords[1]];
       this._model.selectionStartLength = wordPosition.length;
     }
@@ -708,9 +876,26 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
    * @param coords The coordinates to get the word at.
    */
   private _selectToWordAt(coords: [number, number]): void {
-    const wordPosition = this._getWordAt(coords);
+    const wordPosition = this._getWordAt(coords, true);
     if (wordPosition) {
-      this._model.selectionEnd = [this._model.areSelectionValuesReversed() ? wordPosition.start : (wordPosition.start + wordPosition.length), coords[1]];
+      let endRow = coords[1];
+
+      // Adjust negative start value
+      while (wordPosition.start < 0) {
+        wordPosition.start += this._terminal.cols;
+        endRow--;
+      }
+
+      // Adjust wrapped length value, this only needs to happen when values are reversed as in that
+      // case we're interested in the start of the word, not the end
+      if (!this._model.areSelectionValuesReversed()) {
+        while (wordPosition.start + wordPosition.length > this._terminal.cols) {
+          wordPosition.length -= this._terminal.cols;
+          endRow++;
+        }
+      }
+
+      this._model.selectionEnd = [this._model.areSelectionValuesReversed() ? wordPosition.start : wordPosition.start + wordPosition.length, endRow];
     }
   }
 
@@ -719,13 +904,13 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
    * word logic.
    * @param char The character to check.
    */
-  private _isCharWordSeparator(charData: CharData): boolean {
+  private _isCharWordSeparator(cell: CellData): boolean {
     // Zero width characters are never separators as they are always to the
     // right of wide characters
-    if (charData[CHAR_DATA_WIDTH_INDEX] === 0) {
+    if (cell.getWidth() === 0) {
       return false;
     }
-    return WORD_SEPARATORS.indexOf(charData[CHAR_DATA_CHAR_INDEX]) >= 0;
+    return WORD_SEPARATORS.indexOf(cell.getChars()) >= 0;
   }
 
   /**
@@ -733,7 +918,9 @@ export class SelectionManager extends EventEmitter implements ISelectionManager
    * @param line The line index.
    */
   protected _selectLineAt(line: number): void {
-    this._model.selectionStart = [0, line];
-    this._model.selectionStartLength = this._terminal.cols;
+    const wrappedRange = this._buffer.getWrappedRangeForLine(line);
+    this._model.selectionStart = [0, wrappedRange.first];
+    this._model.selectionEnd = [this._terminal.cols, wrappedRange.last];
+    this._model.selectionStartLength = 0;
   }
 }

src/SelectionModel.test.ts

@@ -4,10 +4,10 @@
  */
 
 import { assert } from 'chai';
-import { ITerminal } from './Interfaces';
+import { ITerminal } from './Types';
 import { SelectionModel } from './SelectionModel';
-import {BufferSet} from './BufferSet';
-import { MockTerminal } from './utils/TestUtils.test';
+import { BufferSet } from './BufferSet';
+import { MockTerminal } from './TestUtils.test';
 
 class TestSelectionModel extends SelectionModel {
   constructor(
@@ -18,16 +18,13 @@ class TestSelectionModel extends SelectionModel {
 }
 
 describe('SelectionManager', () => {
-  let window: Window;
-  let document: Document;
-
   let terminal: ITerminal;
   let model: TestSelectionModel;
 
   beforeEach(() => {
     terminal = new MockTerminal();
-    terminal.cols = 80;
-    terminal.rows = 2;
+    (terminal as any).cols = 80;
+    (terminal as any).rows = 2;
     terminal.options.scrollback = 10;
     terminal.buffers = new BufferSet(terminal);
     terminal.buffer = terminal.buffers.active;
@@ -131,6 +128,11 @@ describe('SelectionManager', () => {
       model.selectionEnd = [3, 2];
       assert.deepEqual(model.finalSelectionEnd, [4, 2]);
     });
+    it('should return the end on a different row when start + length overflows onto a following row', () => {
+      model.selectionStart = [78, 2];
+      model.selectionStartLength = 4;
+      assert.deepEqual(model.finalSelectionEnd, [2, 3]);
+    });
     it('should return selection end if selection end is after selection start + length', () => {
       model.selectionStart = [2, 2];
       model.selectionStartLength = 2;

src/SelectionModel.ts

@@ -3,7 +3,7 @@
  * @license MIT
  */
 
-import { ITerminal } from './Interfaces';
+import { ITerminal } from './Types';
 
 /**
  * Represents a selection within the buffer. This model only cares about column
@@ -76,9 +76,13 @@ export class SelectionModel {
       return null;
     }
 
-    // Use the selection start if the end doesn't exist or they're reversed
+    // Use the selection start + length if the end doesn't exist or they're reversed
     if (!this.selectionEnd || this.areSelectionValuesReversed()) {
-      return [this.selectionStart[0] + this.selectionStartLength, this.selectionStart[1]];
+      const startPlusLength = this.selectionStart[0] + this.selectionStartLength;
+      if (startPlusLength > this._terminal.cols) {
+        return [startPlusLength % this._terminal.cols, this.selectionStart[1] + Math.floor(startPlusLength / this._terminal.cols)];
+      }
+      return [startPlusLength, this.selectionStart[1]];
     }
 
     // Ensure the the word/line is selected after a double/triple click

src/SoundManager.ts

@@ -0,0 +1,66 @@
+/**
+ * Copyright (c) 2018 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+import { ITerminal, ISoundManager } from './Types';
+
+// Source: https://freesound.org/people/altemark/sounds/45759/
+// This sound is released under the Creative Commons Attribution 3.0 Unported
+// (CC BY 3.0) license. It was created by 'altemark'. No modifications have been
+// made, apart from the conversion to base64.
+export const DEFAULT_BELL_SOUND = 'data:audio/wav;base64,UklGRigBAABXQVZFZm10IBAAAAABAAEARKwAAIhYAQACABAAZGF0YQQBAADpAFgCwAMlBZoG/wdmCcoKRAypDQ8PbRDBEQQTOxRtFYcWlBePGIUZXhoiG88bcBz7HHIdzh0WHlMeZx51HmkeUx4WHs8dah0AHXwc3hs9G4saxRnyGBIYGBcQFv8U4RPAEoYRQBACD70NWwwHC6gJOwjWBloF7gOBAhABkf8b/qv8R/ve+Xf4Ife79W/0JfPZ8Z/wde9N7ijtE+wU6xvqM+lb6H7nw+YX5mrlxuQz5Mzje+Ma49fioeKD4nXiYeJy4pHitOL04j/jn+MN5IPkFOWs5U3mDefM55/ogOl36m7rdOyE7abuyu8D8Unyj/Pg9D/2qfcb+Yn6/vuK/Qj/lAAlAg==';
+
+export class SoundManager implements ISoundManager {
+  private static _audioContext: AudioContext;
+
+  static get audioContext(): AudioContext | null {
+    if (!SoundManager._audioContext) {
+      const audioContextCtor: typeof AudioContext = (<any>window).AudioContext || (<any>window).webkitAudioContext;
+      if (!audioContextCtor) {
+        console.warn('Web Audio API is not supported by this browser. Consider upgrading to the latest version');
+        return null;
+      }
+      SoundManager._audioContext = new audioContextCtor();
+    }
+    return SoundManager._audioContext;
+  }
+
+  constructor(
+    private _terminal: ITerminal
+  ) {
+  }
+
+  public playBellSound(): void {
+    const ctx = SoundManager.audioContext;
+    if (!ctx) {
+      return;
+    }
+    const bellAudioSource = ctx.createBufferSource();
+    ctx.decodeAudioData(this._base64ToArrayBuffer(this._removeMimeType(this._terminal.options.bellSound)), (buffer) => {
+      bellAudioSource.buffer = buffer;
+      bellAudioSource.connect(ctx.destination);
+      bellAudioSource.start(0);
+    });
+  }
+
+  private _base64ToArrayBuffer(base64: string): ArrayBuffer {
+    const binaryString = window.atob(base64);
+    const len = binaryString.length;
+    const bytes = new Uint8Array(len);
+
+    for (let i = 0; i < len; i++) {
+      bytes[i] = binaryString.charCodeAt(i);
+    }
+
+    return bytes.buffer;
+  }
+
+  private _removeMimeType(dataURI: string): string {
+    // Split the input to get the mime-type and the data itself
+    const splitUri = dataURI.split(',');
+
+    // Return only the data
+    return splitUri[1];
+  }
+}

src/Strings.ts

@@ -0,0 +1,8 @@
+/**
+ * Copyright (c) 2018 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+export let blankLine = 'Blank line';
+export let promptLabel = 'Terminal input';
+export let tooMuchOutput = 'Too much output to announce, navigate to rows manually to read';

src/Terminal.integration.ts

@@ -13,19 +13,24 @@ import * as path from 'path';
 import * as pty from 'node-pty';
 import { assert } from 'chai';
 import { Terminal } from './Terminal';
-import { CHAR_DATA_CHAR_INDEX } from './Buffer';
+import { IViewport } from './Types';
+import { CellData, WHITESPACE_CELL_CHAR } from './core/buffer/BufferLine';
 
-let primitive_pty: any;
+class TestTerminal extends Terminal {
+  innerWrite(): void { this._innerWrite(); }
+}
+
+let primitivePty: any;
 
 // fake sychronous pty write - read
 // we just pipe the data from slave to master as a child program would do
 // pty.js opens pipe fds with O_NONBLOCK
 // just wait 10ms instead of setting fds to blocking mode
 function ptyWriteRead(data: string, cb: (result: string) => void): void {
-  fs.writeSync(primitive_pty.slave, data);
+  fs.writeSync(primitivePty.slave, data);
   setTimeout(() => {
-    let b = new Buffer(64000);
-    let bytes = fs.readSync(primitive_pty.master, b, 0, 64000, null);
+    const b = new Buffer(64000);
+    const bytes = fs.readSync(primitivePty.master, b, 0, 64000, null);
     cb(b.toString('utf8', 0, bytes));
   });
 }
@@ -37,7 +42,7 @@ function ptyReset(cb: (result: string) => void): void {
 
 /* debug helpers */
 // generate colorful noisy output to compare xterm and emulator cell states
-function formatError(in_: string, out_: string, expected: string): string {
+function formatError(input: string, output: string, expected: string): string {
   function addLineNumber(start: number, color: string): (s: string) => string {
     let counter = start || 0;
     return function(s: string): string {
@@ -45,11 +50,11 @@ function formatError(in_: string, out_: string, expected: string): string {
       return '\x1b[33m' + (' ' + counter).slice(-2) + color + s;
     };
   }
-  let line80 = '12345678901234567890123456789012345678901234567890123456789012345678901234567890';
+  const line80 = '12345678901234567890123456789012345678901234567890123456789012345678901234567890';
   let s = '';
-  s += '\n\x1b[34m' + JSON.stringify(in_);
+  s += '\n\x1b[34m' + JSON.stringify(input);
   s += '\n\x1b[33m  ' + line80 + '\n';
-  s += out_.split('\n').map(addLineNumber(0, '\x1b[31m')).join('\n');
+  s += output.split('\n').map(addLineNumber(0, '\x1b[31m')).join('\n');
   s += '\n\x1b[33m  ' + line80 + '\n';
   s += expected.split('\n').map(addLineNumber(0, '\x1b[32m')).join('\n');
   return s;
@@ -58,15 +63,15 @@ function formatError(in_: string, out_: string, expected: string): string {
 // simple debug output of terminal cells
 function terminalToString(term: Terminal): string {
   let result = '';
-  let line_s = '';
+  let lineText = '';
   for (let line = term.buffer.ybase; line < term.buffer.ybase + term.rows; line++) {
-    line_s = '';
+    lineText = '';
     for (let cell = 0; cell < term.cols; ++cell) {
-      line_s += term.buffer.lines.get(line)[cell][CHAR_DATA_CHAR_INDEX];
+      lineText += term.buffer.lines.get(line).loadCell(cell, new CellData()).getChars() || WHITESPACE_CELL_CHAR;
     }
     // rtrim empty cells as xterm does
-    line_s = line_s.replace(/\s+$/, '');
-    result += line_s;
+    lineText = lineText.replace(/\s+$/, '');
+    result += lineText;
     result += '\n';
   }
   return result;
@@ -74,41 +79,43 @@ function terminalToString(term: Terminal): string {
 
 // Skip tests on Windows since pty.open isn't supported
 if (os.platform() !== 'win32') {
-  let CONSOLE_LOG = console.log;
+  const consoleLog = console.log;
 
   // expect files need terminal at 80x25!
-  let COLS = 80;
-  let ROWS = 25;
+  const cols = 80;
+  const rows = 25;
 
   /** some helpers for pty interaction */
   // we need a pty in between to get the termios decorations
   // for the basic test cases a raw pty device is enough
-  primitive_pty = pty.native.open(COLS, ROWS);
+  primitivePty = (<any>pty).native.open(cols, rows);
 
   /** tests */
-  describe('xterm output comparison', () => {
-    let xterm;
+  describe('xterm output comparison', function(): void {
+    this.timeout(10000);
+    let xterm: TestTerminal;
 
     beforeEach(() => {
-      xterm = new Terminal({ cols: COLS, rows: ROWS });
+      xterm = new TestTerminal({ cols: cols, rows: rows });
       xterm.refresh = () => {};
-      xterm.viewport = {
+      xterm.viewport = <IViewport>{
         syncScrollArea: () => {}
       };
     });
 
     // omit stack trace for escape sequence files
     Error.stackTraceLimit = 0;
-    let files = glob.sync('**/escape_sequence_files/*.in', { cwd: path.join(__dirname, '..')});
+    const files = glob.sync('**/escape_sequence_files/*.in', { cwd: path.join(__dirname, '..')});
+    // for (let i = 0; i < files.length; ++i) console.debug(i, files[i]);
     // only successful tests for now
-    let skip = [
+    const skip = [
       10, 16, 17, 19, 32, 33, 34, 35, 36, 39,
       40, 42, 43, 44, 45, 46, 47, 48, 49, 50,
       51, 52, 54, 55, 56, 57, 58, 59, 60, 61,
       63, 68
     ];
+    // These are failing on macOS only
     if (os.platform() === 'darwin') {
-      // These are failing on macOS only
       skip.push(3, 7, 11, 67);
     }
     for (let i = 0; i < files.length; i++) {
@@ -116,26 +123,27 @@ if (os.platform() !== 'win32') {
         continue;
       }
       ((filename: string) => {
+        const inFile = fs.readFileSync(filename, 'utf8');
         it(filename.split('/').slice(-1)[0], done => {
           ptyReset(() => {
-            let in_file = fs.readFileSync(filename, 'utf8');
-            ptyWriteRead(in_file, from_pty => {
+            ptyWriteRead(inFile, fromPty => {
               // uncomment this to get log from terminal
               // console.log = function(){};
 
               // Perform a synchronous .write(data)
-              xterm.writeBuffer.push(from_pty);
+              xterm.writeBuffer.push(fromPty);
               xterm.innerWrite();
 
-              let from_emulator = terminalToString(xterm);
-              console.log = CONSOLE_LOG;
-              let expected = fs.readFileSync(filename.split('.')[0] + '.text', 'utf8');
+              const fromEmulator = terminalToString(xterm);
+              console.log = consoleLog;
+              const expected = fs.readFileSync(filename.split('.')[0] + '.text', 'utf8');
+
               // Some of the tests have whitespace on the right of lines, we trim all the linex
               // from xterm.js so ignore this for now at least.
-              let expectedRightTrimmed = expected.split('\n').map(l => l.replace(/\s+$/, '')).join('\n');
-              if (from_emulator !== expectedRightTrimmed) {
+              const expectedRightTrimmed = expected.split('\n').map(l => l.replace(/\s+$/, '')).join('\n');
+              if (fromEmulator !== expectedRightTrimmed) {
                 // uncomment to get noisy output
-                throw new Error(formatError(in_file, from_emulator, expected));
+                throw new Error(formatError(inFile, fromEmulator, expected));
               //   throw new Error('mismatch');
               }
               done();
@@ -155,9 +163,7 @@ describe('typings', () => {
       tsc += '.cmd';
     }
     const fixtureDir = path.join(__dirname, '..', 'fixtures', 'typings-test');
-    let result = cp.spawnSync(tsc, { cwd: fixtureDir });
+    const result = cp.spawnSync(tsc, { cwd: fixtureDir });
     assert.equal(result.status, 0, `build did not succeed:\nstdout: ${result.stdout.toString()}\nstderr: ${result.stderr.toString()}\n`);
-    // Clean up
-    fs.unlinkSync(path.join(fixtureDir, 'typings-test.js'));
   });
 });

src/TestUtils.test.ts

@@ -0,0 +1,443 @@
+/**
+ * Copyright (c) 2017 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+import { IRenderer, IRenderDimensions } from './renderer/Types';
+import { IInputHandlingTerminal, IViewport, ICompositionHelper, ITerminal, IBuffer, IBufferSet, IBrowser, ICharMeasure, ISelectionManager, ITerminalOptions, ILinkifier, IMouseHelper, ILinkMatcherOptions, CharacterJoinerHandler, IBufferStringIterator } from './Types';
+import { IBufferLine, ICellData, IAttributeData } from './core/Types';
+import { ICircularList, XtermListener } from './common/Types';
+import { Buffer } from './Buffer';
+import * as Browser from './common/Platform';
+import { IDisposable, IMarker, IEvent, ISelectionPosition } from 'xterm';
+import { Terminal } from './Terminal';
+import { AttributeData } from './core/buffer/BufferLine';
+import { IColorManager, IColorSet } from './ui/Types';
+
+export class TestTerminal extends Terminal {
+  writeSync(data: string): void {
+    this.writeBuffer.push(data);
+    this._innerWrite();
+  }
+}
+
+export class MockTerminal implements ITerminal {
+  onCursorMove: IEvent<void>;
+  onLineFeed: IEvent<void>;
+  onSelectionChange: IEvent<void>;
+  onData: IEvent<string>;
+  onTitleChange: IEvent<string>;
+  onScroll: IEvent<number>;
+  onKey: IEvent<{ key: string; domEvent: KeyboardEvent; }>;
+  onRender: IEvent<{ start: number; end: number; }>;
+  onResize: IEvent<{ cols: number; rows: number; }>;
+  markers: IMarker[];
+  addMarker(cursorYOffset: number): IMarker {
+    throw new Error('Method not implemented.');
+  }
+  selectLines(start: number, end: number): void {
+    throw new Error('Method not implemented.');
+  }
+  scrollToLine(line: number): void {
+    throw new Error('Method not implemented.');
+  }
+  static string: any;
+  getOption(key: any): any {
+    throw new Error('Method not implemented.');
+  }
+  setOption(key: any, value: any): void {
+    throw new Error('Method not implemented.');
+  }
+  blur(): void {
+    throw new Error('Method not implemented.');
+  }
+  focus(): void {
+    throw new Error('Method not implemented.');
+  }
+  resize(columns: number, rows: number): void {
+    throw new Error('Method not implemented.');
+  }
+  writeln(data: string): void {
+    throw new Error('Method not implemented.');
+  }
+  open(parent: HTMLElement): void {
+    throw new Error('Method not implemented.');
+  }
+  attachCustomKeyEventHandler(customKeyEventHandler: (event: KeyboardEvent) => boolean): void {
+    throw new Error('Method not implemented.');
+  }
+  addCsiHandler(flag: string, callback: (params: number[], collect: string) => boolean): IDisposable {
+      throw new Error('Method not implemented.');
+  }
+  addOscHandler(ident: number, callback: (data: string) => boolean): IDisposable {
+      throw new Error('Method not implemented.');
+  }
+  registerLinkMatcher(regex: RegExp, handler: (event: MouseEvent, uri: string) => boolean | void, options?: ILinkMatcherOptions): number {
+    throw new Error('Method not implemented.');
+  }
+  deregisterLinkMatcher(matcherId: number): void {
+    throw new Error('Method not implemented.');
+  }
+  hasSelection(): boolean {
+    throw new Error('Method not implemented.');
+  }
+  getSelection(): string {
+    throw new Error('Method not implemented.');
+  }
+  getSelectionPosition(): ISelectionPosition | undefined {
+    throw new Error('Method not implemented.');
+  }
+  clearSelection(): void {
+    throw new Error('Method not implemented.');
+  }
+  select(column: number, row: number, length: number): void {
+    throw new Error('Method not implemented.');
+  }
+  selectAll(): void {
+    throw new Error('Method not implemented.');
+  }
+  dispose(): void {
+    throw new Error('Method not implemented.');
+  }
+  destroy(): void {
+    throw new Error('Method not implemented.');
+  }
+  scrollPages(pageCount: number): void {
+    throw new Error('Method not implemented.');
+  }
+  scrollToTop(): void {
+    throw new Error('Method not implemented.');
+  }
+  scrollToBottom(): void {
+    throw new Error('Method not implemented.');
+  }
+  clear(): void {
+    throw new Error('Method not implemented.');
+  }
+  write(data: string): void {
+    throw new Error('Method not implemented.');
+  }
+  writeUtf8(data: Uint8Array): void {
+    throw new Error('Method not implemented.');
+  }
+  bracketedPasteMode: boolean;
+  mouseHelper: IMouseHelper;
+  renderer: IRenderer;
+  linkifier: ILinkifier;
+  isFocused: boolean;
+  options: ITerminalOptions = {};
+  element: HTMLElement;
+  screenElement: HTMLElement;
+  rowContainer: HTMLElement;
+  selectionContainer: HTMLElement;
+  selectionManager: ISelectionManager;
+  charMeasure: ICharMeasure;
+  textarea: HTMLTextAreaElement;
+  rows: number;
+  cols: number;
+  browser: IBrowser = <any>Browser;
+  writeBuffer: string[];
+  children: HTMLElement[];
+  cursorHidden: boolean;
+  cursorState: number;
+  scrollback: number;
+  buffers: IBufferSet;
+  buffer: IBuffer;
+  viewport: IViewport;
+  applicationCursor: boolean;
+  handler(data: string): void {
+    throw new Error('Method not implemented.');
+  }
+  on(event: string, callback: (...args: any[]) => void): void {
+    throw new Error('Method not implemented.');
+  }
+  off(type: string, listener: XtermListener): void {
+    throw new Error('Method not implemented.');
+  }
+  addDisposableListener(type: string, handler: XtermListener): IDisposable {
+    throw new Error('Method not implemented.');
+  }
+  scrollLines(disp: number, suppressScrollEvent: boolean): void {
+    throw new Error('Method not implemented.');
+  }
+  scrollToRow(absoluteRow: number): number {
+    throw new Error('Method not implemented.');
+  }
+  cancel(ev: Event, force?: boolean): void {
+    throw new Error('Method not implemented.');
+  }
+  log(text: string): void {
+    throw new Error('Method not implemented.');
+  }
+  emit(event: string, data: any): void {
+    throw new Error('Method not implemented.');
+  }
+  reset(): void {
+    throw new Error('Method not implemented.');
+  }
+  showCursor(): void {
+    throw new Error('Method not implemented.');
+  }
+  refresh(start: number, end: number): void {
+    throw new Error('Method not implemented.');
+  }
+  registerCharacterJoiner(handler: CharacterJoinerHandler): number { return 0; }
+  deregisterCharacterJoiner(joinerId: number): void { }
+}
+
+export class MockCharMeasure implements ICharMeasure {
+  onCharSizeChanged: IEvent<void>;
+  width: number;
+  height: number;
+  measure(options: ITerminalOptions): void {
+    throw new Error('Method not implemented.');
+  }
+}
+
+export class MockInputHandlingTerminal implements IInputHandlingTerminal {
+  element: HTMLElement;
+  options: ITerminalOptions = {};
+  cols: number;
+  rows: number;
+  charset: { [key: string]: string; };
+  gcharset: number;
+  glevel: number;
+  charsets: { [key: string]: string; }[];
+  applicationKeypad: boolean;
+  applicationCursor: boolean;
+  originMode: boolean;
+  insertMode: boolean;
+  wraparoundMode: boolean;
+  bracketedPasteMode: boolean;
+  curAttrData = new AttributeData();
+  savedCols: number;
+  x10Mouse: boolean;
+  vt200Mouse: boolean;
+  normalMouse: boolean;
+  mouseEvents: boolean;
+  sendFocus: boolean;
+  utfMouse: boolean;
+  sgrMouse: boolean;
+  urxvtMouse: boolean;
+  cursorHidden: boolean;
+  buffers: IBufferSet;
+  buffer: IBuffer = new MockBuffer();
+  viewport: IViewport;
+  selectionManager: ISelectionManager;
+  focus(): void {
+    throw new Error('Method not implemented.');
+  }
+  convertEol: boolean;
+  bell(): void {
+    throw new Error('Method not implemented.');
+  }
+
+  updateRange(y: number): void {
+    throw new Error('Method not implemented.');
+  }
+  scroll(isWrapped?: boolean): void {
+    throw new Error('Method not implemented.');
+  }
+  nextStop(x?: number): number {
+    throw new Error('Method not implemented.');
+  }
+  setgLevel(g: number): void {
+    throw new Error('Method not implemented.');
+  }
+  eraseAttrData(): IAttributeData {
+    throw new Error('Method not implemented.');
+  }
+  eraseRight(x: number, y: number): void {
+    throw new Error('Method not implemented.');
+  }
+  eraseLine(y: number): void {
+    throw new Error('Method not implemented.');
+  }
+  eraseLeft(x: number, y: number): void {
+    throw new Error('Method not implemented.');
+  }
+  prevStop(x?: number): number {
+    throw new Error('Method not implemented.');
+  }
+  is(term: string): boolean {
+    throw new Error('Method not implemented.');
+  }
+  setgCharset(g: number, charset: { [key: string]: string; }): void {
+    throw new Error('Method not implemented.');
+  }
+  resize(x: number, y: number): void {
+    throw new Error('Method not implemented.');
+  }
+  log(text: string, data?: any): void {
+    throw new Error('Method not implemented.');
+  }
+  reset(): void {
+    throw new Error('Method not implemented.');
+  }
+  showCursor(): void {
+    throw new Error('Method not implemented.');
+  }
+  refresh(start: number, end: number): void {
+    throw new Error('Method not implemented.');
+  }
+  matchColor(r1: number, g1: number, b1: number): number {
+    throw new Error('Method not implemented.');
+  }
+  error(text: string, data?: any): void {
+    throw new Error('Method not implemented.');
+  }
+  setOption(key: string, value: any): void {
+    (<any>this.options)[key] = value;
+  }
+  on(type: string, listener: XtermListener): void {
+    throw new Error('Method not implemented.');
+  }
+  off(type: string, listener: XtermListener): void {
+    throw new Error('Method not implemented.');
+  }
+  emit(type: string, data?: any): void {
+    throw new Error('Method not implemented.');
+  }
+  addDisposableListener(type: string, handler: XtermListener): IDisposable {
+    throw new Error('Method not implemented.');
+  }
+  tabSet(): void {
+    throw new Error('Method not implemented.');
+  }
+  handler(data: string): void {
+    throw new Error('Method not implemented.');
+  }
+  handleTitle(title: string): void {
+    throw new Error('Method not implemented.');
+  }
+  index(): void {
+    throw new Error('Method not implemented.');
+  }
+  reverseIndex(): void {
+    throw new Error('Method not implemented.');
+  }
+}
+
+export class MockBuffer implements IBuffer {
+  isCursorInViewport: boolean;
+  lines: ICircularList<IBufferLine>;
+  ydisp: number;
+  ybase: number;
+  hasScrollback: boolean;
+  y: number;
+  x: number;
+  tabs: any;
+  scrollBottom: number;
+  scrollTop: number;
+  savedY: number;
+  savedX: number;
+  savedCurAttrData = new AttributeData();
+  translateBufferLineToString(lineIndex: number, trimRight: boolean, startCol?: number, endCol?: number): string {
+    return Buffer.prototype.translateBufferLineToString.apply(this, arguments);
+  }
+  getWrappedRangeForLine(y: number): { first: number; last: number; } {
+    return Buffer.prototype.getWrappedRangeForLine.apply(this, arguments);
+  }
+  nextStop(x?: number): number {
+    throw new Error('Method not implemented.');
+  }
+  prevStop(x?: number): number {
+    throw new Error('Method not implemented.');
+  }
+  setLines(lines: ICircularList<IBufferLine>): void {
+    this.lines = lines;
+  }
+  getBlankLine(attr: IAttributeData, isWrapped?: boolean): IBufferLine {
+    return Buffer.prototype.getBlankLine.apply(this, arguments);
+  }
+  stringIndexToBufferIndex(lineIndex: number, stringIndex: number): number[] {
+    return Buffer.prototype.stringIndexToBufferIndex.apply(this, arguments);
+  }
+  iterator(trimRight: boolean, startIndex?: number, endIndex?: number): IBufferStringIterator {
+    return Buffer.prototype.iterator.apply(this, arguments);
+  }
+  getNullCell(attr?: IAttributeData): ICellData {
+    throw new Error('Method not implemented.');
+  }
+  getWhitespaceCell(attr?: IAttributeData): ICellData {
+    throw new Error('Method not implemented.');
+  }
+}
+
+export class MockRenderer implements IRenderer {
+  onCanvasResize: IEvent<{ width: number; height: number; }>;
+  onRender: IEvent<{ start: number; end: number; }>;
+  dispose(): void {
+    throw new Error('Method not implemented.');
+  }
+  colorManager: IColorManager;
+  on(type: string, listener: XtermListener): void {
+    throw new Error('Method not implemented.');
+  }
+  off(type: string, listener: XtermListener): void {
+    throw new Error('Method not implemented.');
+  }
+  emit(type: string, data?: any): void {
+    throw new Error('Method not implemented.');
+  }
+  addDisposableListener(type: string, handler: XtermListener): IDisposable {
+    throw new Error('Method not implemented.');
+  }
+  dimensions: IRenderDimensions;
+  setColors(colors: IColorSet): void {
+    throw new Error('Method not implemented.');
+  }
+  onResize(cols: number, rows: number): void {}
+  onCharSizeChanged(): void {}
+  onBlur(): void {}
+  onFocus(): void {}
+  onSelectionChanged(start: [number, number], end: [number, number]): void {}
+  onCursorMove(): void {}
+  onOptionsChanged(): void {}
+  onDevicePixelRatioChange(): void {}
+  clear(): void {}
+  renderRows(start: number, end: number): void {}
+  registerCharacterJoiner(handler: CharacterJoinerHandler): number { return 0; }
+  deregisterCharacterJoiner(): boolean { return true; }
+}
+
+export class MockViewport implements IViewport {
+  dispose(): void {
+    throw new Error('Method not implemented.');
+  }
+  scrollBarWidth: number = 0;
+  onThemeChange(colors: IColorSet): void {
+    throw new Error('Method not implemented.');
+  }
+  onWheel(ev: WheelEvent): void {
+    throw new Error('Method not implemented.');
+  }
+  onTouchStart(ev: TouchEvent): void {
+    throw new Error('Method not implemented.');
+  }
+  onTouchMove(ev: TouchEvent): void {
+    throw new Error('Method not implemented.');
+  }
+  syncScrollArea(): void { }
+  getLinesScrolled(ev: WheelEvent): number {
+    throw new Error('Method not implemented.');
+  }
+}
+
+export class MockCompositionHelper implements ICompositionHelper {
+  compositionstart(): void {
+    throw new Error('Method not implemented.');
+  }
+  compositionupdate(ev: CompositionEvent): void {
+    throw new Error('Method not implemented.');
+  }
+  compositionend(): void {
+    throw new Error('Method not implemented.');
+  }
+  updateCompositionElements(dontRecurse?: boolean): void {
+    throw new Error('Method not implemented.');
+  }
+  keydown(ev: KeyboardEvent): boolean {
+    return true;
+  }
+}

src/Types.ts

@@ -3,33 +3,592 @@
  * @license MIT
  */
 
-export type LinkMatcher = {
-  id: number,
-  regex: RegExp,
-  handler: LinkMatcherHandler,
-  hoverTooltipCallback?: LinkMatcherHandler,
-  hoverLeaveCallback?: () => void,
-  matchIndex?: number,
-  validationCallback?: LinkMatcherValidationCallback,
-  priority?: number
-};
-export type LinkMatcherHandler = (event: MouseEvent, uri: string) => boolean | void;
-export type LinkMatcherValidationCallback = (uri: string, callback: (isValid: boolean) => void) => void;
+import { ITerminalOptions as IPublicTerminalOptions, IEventEmitter, IDisposable, IMarker, ISelectionPosition } from 'xterm';
+import { ICharset, IAttributeData, ICellData, IBufferLine, CharData } from './core/Types';
+import { ICircularList } from './common/Types';
+import { IEvent } from './common/EventEmitter2';
+import { IColorSet } from './ui/Types';
 
 export type CustomKeyEventHandler = (event: KeyboardEvent) => boolean;
-export type Charset = {[key: string]: string};
 
-export type CharData = [number, string, number, number];
 export type LineData = CharData[];
 
-export type LinkHoverEvent = {
-  x: number,
-  y: number,
-  length: number
-};
+export type LinkMatcherHandler = (event: MouseEvent, uri: string) => void;
+export type LinkMatcherValidationCallback = (uri: string, callback: (isValid: boolean) => void) => void;
 
-export enum LinkHoverEventTypes {
-  HOVER = 'linkhover',
-  TOOLTIP = 'linktooltip',
-  LEAVE = 'linkleave'
-};
+export type CharacterJoinerHandler = (text: string) => [number, number][];
+
+// BufferIndex denotes a position in the buffer: [rowIndex, colIndex]
+export type BufferIndex = [number, number];
+
+/**
+ * This interface encapsulates everything needed from the Terminal by the
+ * InputHandler. This cleanly separates the large amount of methods needed by
+ * InputHandler cleanly from the ITerminal interface.
+ */
+export interface IInputHandlingTerminal extends IEventEmitter {
+  element: HTMLElement;
+  options: ITerminalOptions;
+  cols: number;
+  rows: number;
+  charset: ICharset;
+  gcharset: number;
+  glevel: number;
+  charsets: ICharset[];
+  applicationKeypad: boolean;
+  applicationCursor: boolean;
+  originMode: boolean;
+  insertMode: boolean;
+  wraparoundMode: boolean;
+  bracketedPasteMode: boolean;
+  curAttrData: IAttributeData;
+  savedCols: number;
+  x10Mouse: boolean;
+  vt200Mouse: boolean;
+  normalMouse: boolean;
+  mouseEvents: boolean;
+  sendFocus: boolean;
+  utfMouse: boolean;
+  sgrMouse: boolean;
+  urxvtMouse: boolean;
+  cursorHidden: boolean;
+
+  buffers: IBufferSet;
+  buffer: IBuffer;
+  viewport: IViewport;
+  selectionManager: ISelectionManager;
+
+  bell(): void;
+  focus(): void;
+  updateRange(y: number): void;
+  scroll(isWrapped?: boolean): void;
+  setgLevel(g: number): void;
+  eraseAttrData(): IAttributeData;
+  is(term: string): boolean;
+  setgCharset(g: number, charset: ICharset): void;
+  resize(x: number, y: number): void;
+  log(text: string, data?: any): void;
+  reset(): void;
+  showCursor(): void;
+  refresh(start: number, end: number): void;
+  error(text: string, data?: any): void;
+  setOption(key: string, value: any): void;
+  tabSet(): void;
+  handler(data: string): void;
+  handleTitle(title: string): void;
+  index(): void;
+  reverseIndex(): void;
+}
+
+export interface IViewport extends IDisposable {
+  scrollBarWidth: number;
+  syncScrollArea(): void;
+  getLinesScrolled(ev: WheelEvent): number;
+  onWheel(ev: WheelEvent): void;
+  onTouchStart(ev: TouchEvent): void;
+  onTouchMove(ev: TouchEvent): void;
+  onThemeChange(colors: IColorSet): void;
+}
+
+export interface ICompositionHelper {
+  compositionstart(): void;
+  compositionupdate(ev: CompositionEvent): void;
+  compositionend(): void;
+  updateCompositionElements(dontRecurse?: boolean): void;
+  keydown(ev: KeyboardEvent): boolean;
+}
+
+/**
+ * Calls the parser and handles actions generated by the parser.
+ */
+export interface IInputHandler {
+  parse(data: string): void;
+  parseUtf8(data: Uint8Array): void;
+  print(data: Uint32Array, start: number, end: number): void;
+
+  /** C0 BEL */ bell(): void;
+  /** C0 LF */ lineFeed(): void;
+  /** C0 CR */ carriageReturn(): void;
+  /** C0 BS */ backspace(): void;
+  /** C0 HT */ tab(): void;
+  /** C0 SO */ shiftOut(): void;
+  /** C0 SI */ shiftIn(): void;
+
+  /** CSI @ */ insertChars(params?: number[]): void;
+  /** CSI A */ cursorUp(params?: number[]): void;
+  /** CSI B */ cursorDown(params?: number[]): void;
+  /** CSI C */ cursorForward(params?: number[]): void;
+  /** CSI D */ cursorBackward(params?: number[]): void;
+  /** CSI E */ cursorNextLine(params?: number[]): void;
+  /** CSI F */ cursorPrecedingLine(params?: number[]): void;
+  /** CSI G */ cursorCharAbsolute(params?: number[]): void;
+  /** CSI H */ cursorPosition(params?: number[]): void;
+  /** CSI I */ cursorForwardTab(params?: number[]): void;
+  /** CSI J */ eraseInDisplay(params?: number[]): void;
+  /** CSI K */ eraseInLine(params?: number[]): void;
+  /** CSI L */ insertLines(params?: number[]): void;
+  /** CSI M */ deleteLines(params?: number[]): void;
+  /** CSI P */ deleteChars(params?: number[]): void;
+  /** CSI S */ scrollUp(params?: number[]): void;
+  /** CSI T */ scrollDown(params?: number[], collect?: string): void;
+  /** CSI X */ eraseChars(params?: number[]): void;
+  /** CSI Z */ cursorBackwardTab(params?: number[]): void;
+  /** CSI ` */ charPosAbsolute(params?: number[]): void;
+  /** CSI a */ hPositionRelative(params?: number[]): void;
+  /** CSI b */ repeatPrecedingCharacter(params?: number[]): void;
+  /** CSI c */ sendDeviceAttributes(params?: number[], collect?: string): void;
+  /** CSI d */ linePosAbsolute(params?: number[]): void;
+  /** CSI e */ vPositionRelative(params?: number[]): void;
+  /** CSI f */ hVPosition(params?: number[]): void;
+  /** CSI g */ tabClear(params?: number[]): void;
+  /** CSI h */ setMode(params?: number[], collect?: string): void;
+  /** CSI l */ resetMode(params?: number[], collect?: string): void;
+  /** CSI m */ charAttributes(params?: number[]): void;
+  /** CSI n */ deviceStatus(params?: number[], collect?: string): void;
+  /** CSI p */ softReset(params?: number[], collect?: string): void;
+  /** CSI q */ setCursorStyle(params?: number[], collect?: string): void;
+  /** CSI r */ setScrollRegion(params?: number[], collect?: string): void;
+  /** CSI s */ saveCursor(params?: number[]): void;
+  /** CSI u */ restoreCursor(params?: number[]): void;
+  /** OSC 0
+      OSC 2 */ setTitle(data: string): void;
+  /** ESC E */ nextLine(): void;
+  /** ESC = */ keypadApplicationMode(): void;
+  /** ESC > */ keypadNumericMode(): void;
+  /** ESC % G
+      ESC % @ */ selectDefaultCharset(): void;
+  /** ESC ( C
+      ESC ) C
+      ESC * C
+      ESC + C
+      ESC - C
+      ESC . C
+      ESC / C */ selectCharset(collectAndFlag: string): void;
+  /** ESC D */ index(): void;
+  /** ESC H */ tabSet(): void;
+  /** ESC M */ reverseIndex(): void;
+  /** ESC c */ reset(): void;
+  /** ESC n
+      ESC o
+      ESC |
+      ESC }
+      ESC ~ */ setgLevel(level: number): void;
+}
+
+export interface ILinkMatcher {
+  id: number;
+  regex: RegExp;
+  handler: LinkMatcherHandler;
+  hoverTooltipCallback?: LinkMatcherHandler;
+  hoverLeaveCallback?: () => void;
+  matchIndex?: number;
+  validationCallback?: LinkMatcherValidationCallback;
+  priority?: number;
+  willLinkActivate?: (event: MouseEvent, uri: string) => boolean;
+}
+
+export interface ILinkifierEvent {
+  x1: number;
+  y1: number;
+  x2: number;
+  y2: number;
+  cols: number;
+  fg: number;
+}
+
+export interface ITerminal extends IPublicTerminal, IElementAccessor, IBufferAccessor, ILinkifierAccessor {
+  screenElement: HTMLElement;
+  selectionManager: ISelectionManager;
+  charMeasure: ICharMeasure;
+  browser: IBrowser;
+  writeBuffer: string[];
+  cursorHidden: boolean;
+  cursorState: number;
+  options: ITerminalOptions;
+  buffer: IBuffer;
+  buffers: IBufferSet;
+  isFocused: boolean;
+  mouseHelper: IMouseHelper;
+  viewport: IViewport;
+  bracketedPasteMode: boolean;
+  applicationCursor: boolean;
+
+  handler(data: string): void;
+  scrollLines(disp: number, suppressScrollEvent?: boolean): void;
+  cancel(ev: Event, force?: boolean): boolean | void;
+  log(text: string): void;
+  showCursor(): void;
+}
+
+// Portions of the public API that are required by the internal Terminal
+export interface IPublicTerminal extends IDisposable, IEventEmitter {
+  textarea: HTMLTextAreaElement;
+  rows: number;
+  cols: number;
+  buffer: IBuffer;
+  markers: IMarker[];
+  onCursorMove: IEvent<void>;
+  onData: IEvent<string>;
+  onKey: IEvent<{ key: string, domEvent: KeyboardEvent }>;
+  onLineFeed: IEvent<void>;
+  onScroll: IEvent<number>;
+  onSelectionChange: IEvent<void>;
+  onRender: IEvent<{ start: number, end: number }>;
+  onResize: IEvent<{ cols: number, rows: number }>;
+  onTitleChange: IEvent<string>;
+  blur(): void;
+  focus(): void;
+  resize(columns: number, rows: number): void;
+  writeln(data: string): void;
+  open(parent: HTMLElement): void;
+  attachCustomKeyEventHandler(customKeyEventHandler: (event: KeyboardEvent) => boolean): void;
+  addCsiHandler(flag: string, callback: (params: number[], collect: string) => boolean): IDisposable;
+  addOscHandler(ident: number, callback: (data: string) => boolean): IDisposable;
+  registerLinkMatcher(regex: RegExp, handler: (event: MouseEvent, uri: string) => void, options?: ILinkMatcherOptions): number;
+  deregisterLinkMatcher(matcherId: number): void;
+  registerCharacterJoiner(handler: (text: string) => [number, number][]): number;
+  deregisterCharacterJoiner(joinerId: number): void;
+  addMarker(cursorYOffset: number): IMarker;
+  hasSelection(): boolean;
+  getSelection(): string;
+  getSelectionPosition(): ISelectionPosition | undefined;
+  clearSelection(): void;
+  select(column: number, row: number, length: number): void;
+  selectAll(): void;
+  selectLines(start: number, end: number): void;
+  dispose(): void;
+  destroy(): void;
+  scrollLines(amount: number): void;
+  scrollPages(pageCount: number): void;
+  scrollToTop(): void;
+  scrollToBottom(): void;
+  scrollToLine(line: number): void;
+  clear(): void;
+  write(data: string): void;
+  writeUtf8(data: Uint8Array): void;
+  getOption(key: string): any;
+  setOption(key: string, value: any): void;
+  refresh(start: number, end: number): void;
+  reset(): void;
+}
+
+export interface IBufferAccessor {
+  buffer: IBuffer;
+}
+
+export interface IElementAccessor {
+  readonly element: HTMLElement;
+}
+
+export interface ILinkifierAccessor {
+  linkifier: ILinkifier;
+}
+
+export interface IMouseHelper {
+  getCoords(event: { clientX: number, clientY: number }, element: HTMLElement, charMeasure: ICharMeasure, colCount: number, rowCount: number, isSelection?: boolean): [number, number];
+  getRawByteCoords(event: MouseEvent, element: HTMLElement, charMeasure: ICharMeasure, colCount: number, rowCount: number): { x: number, y: number };
+}
+
+export interface ICharMeasure {
+  width: number;
+  height: number;
+
+  onCharSizeChanged: IEvent<void>;
+
+  measure(options: ITerminalOptions): void;
+}
+
+// TODO: The options that are not in the public API should be reviewed
+export interface ITerminalOptions extends IPublicTerminalOptions {
+  [key: string]: any;
+  cancelEvents?: boolean;
+  convertEol?: boolean;
+  debug?: boolean;
+  handler?: (data: string) => void;
+  screenKeys?: boolean;
+  termName?: string;
+  useFlowControl?: boolean;
+}
+
+export interface IBufferStringIteratorResult {
+  range: {first: number, last: number};
+  content: string;
+}
+
+export interface IBufferStringIterator {
+  hasNext(): boolean;
+  next(): IBufferStringIteratorResult;
+}
+
+export interface IBuffer {
+  readonly lines: ICircularList<IBufferLine>;
+  ydisp: number;
+  ybase: number;
+  y: number;
+  x: number;
+  tabs: any;
+  scrollBottom: number;
+  scrollTop: number;
+  hasScrollback: boolean;
+  savedY: number;
+  savedX: number;
+  savedCurAttrData: IAttributeData;
+  isCursorInViewport: boolean;
+  translateBufferLineToString(lineIndex: number, trimRight: boolean, startCol?: number, endCol?: number): string;
+  getWrappedRangeForLine(y: number): { first: number, last: number };
+  nextStop(x?: number): number;
+  prevStop(x?: number): number;
+  getBlankLine(attr: IAttributeData, isWrapped?: boolean): IBufferLine;
+  stringIndexToBufferIndex(lineIndex: number, stringIndex: number): number[];
+  iterator(trimRight: boolean, startIndex?: number, endIndex?: number, startOverscan?: number, endOverscan?: number): IBufferStringIterator;
+  getNullCell(attr?: IAttributeData): ICellData;
+  getWhitespaceCell(attr?: IAttributeData): ICellData;
+}
+
+export interface IBufferSet {
+  alt: IBuffer;
+  normal: IBuffer;
+  active: IBuffer;
+
+  onBufferActivate: IEvent<{ activeBuffer: IBuffer, inactiveBuffer: IBuffer }>;
+
+  activateNormalBuffer(): void;
+  activateAltBuffer(fillAttr?: IAttributeData): void;
+}
+
+export interface ISelectionManager {
+  selectionText: string;
+  selectionStart: [number, number];
+  selectionEnd: [number, number];
+
+  disable(): void;
+  enable(): void;
+  setSelection(row: number, col: number, length: number): void;
+  isClickInSelection(event: MouseEvent): boolean;
+  selectWordAtCursor(event: MouseEvent): void;
+}
+
+export interface ISelectionRedrawRequestEvent {
+  start: [number, number];
+  end: [number, number];
+  columnSelectMode: boolean;
+}
+
+export interface ILinkifier {
+  onLinkHover: IEvent<ILinkifierEvent>;
+  onLinkLeave: IEvent<ILinkifierEvent>;
+  onLinkTooltip: IEvent<ILinkifierEvent>;
+
+  attachToDom(mouseZoneManager: IMouseZoneManager): void;
+  linkifyRows(start: number, end: number): void;
+  registerLinkMatcher(regex: RegExp, handler: LinkMatcherHandler, options?: ILinkMatcherOptions): number;
+  deregisterLinkMatcher(matcherId: number): boolean;
+}
+
+export interface ILinkMatcherOptions {
+  /**
+   * The index of the link from the regex.match(text) call. This defaults to 0
+   * (for regular expressions without capture groups).
+   */
+  matchIndex?: number;
+  /**
+   * A callback that validates an individual link, returning true if valid and
+   * false if invalid.
+   */
+  validationCallback?: LinkMatcherValidationCallback;
+  /**
+   * A callback that fires when the mouse hovers over a link.
+   */
+  tooltipCallback?: LinkMatcherHandler;
+  /**
+   * A callback that fires when the mouse leaves a link that was hovered.
+   */
+  leaveCallback?: () => void;
+  /**
+   * The priority of the link matcher, this defines the order in which the link
+   * matcher is evaluated relative to others, from highest to lowest. The
+   * default value is 0.
+   */
+  priority?: number;
+  /**
+   * A callback that fires when the mousedown and click events occur that
+   * determines whether a link will be activated upon click. This enables
+   * only activating a link when a certain modifier is held down, if not the
+   * mouse event will continue propagation (eg. double click to select word).
+   */
+  willLinkActivate?: (event: MouseEvent, uri: string) => boolean;
+}
+
+export interface IBrowser {
+  isNode: boolean;
+  userAgent: string;
+  platform: string;
+  isFirefox: boolean;
+  isMSIE: boolean;
+  isMac: boolean;
+  isIpad: boolean;
+  isIphone: boolean;
+  isMSWindows: boolean;
+}
+
+export interface ISoundManager {
+  playBellSound(): void;
+}
+
+/**
+ * Internal states of EscapeSequenceParser.
+ */
+export const enum ParserState {
+  GROUND = 0,
+  ESCAPE = 1,
+  ESCAPE_INTERMEDIATE = 2,
+  CSI_ENTRY = 3,
+  CSI_PARAM = 4,
+  CSI_INTERMEDIATE = 5,
+  CSI_IGNORE = 6,
+  SOS_PM_APC_STRING = 7,
+  OSC_STRING = 8,
+  DCS_ENTRY = 9,
+  DCS_PARAM = 10,
+  DCS_IGNORE = 11,
+  DCS_INTERMEDIATE = 12,
+  DCS_PASSTHROUGH = 13
+}
+
+/**
+* Internal actions of EscapeSequenceParser.
+*/
+export const enum ParserAction {
+  IGNORE = 0,
+  ERROR = 1,
+  PRINT = 2,
+  EXECUTE = 3,
+  OSC_START = 4,
+  OSC_PUT = 5,
+  OSC_END = 6,
+  CSI_DISPATCH = 7,
+  PARAM = 8,
+  COLLECT = 9,
+  ESC_DISPATCH = 10,
+  CLEAR = 11,
+  DCS_HOOK = 12,
+  DCS_PUT = 13,
+  DCS_UNHOOK = 14
+}
+
+/**
+ * Internal state of EscapeSequenceParser.
+ * Used as argument of the error handler to allow
+ * introspection at runtime on parse errors.
+ * Return it with altered values to recover from
+ * faulty states (not yet supported).
+ * Set `abort` to `true` to abort the current parsing.
+ */
+export interface IParsingState {
+  // position in parse string
+  position: number;
+  // actual character code
+  code: number;
+  // current parser state
+  currentState: ParserState;
+  // print buffer start index (-1 for not set)
+  print: number;
+  // dcs buffer start index (-1 for not set)
+  dcs: number;
+  // osc string buffer
+  osc: string;
+  // collect buffer with intermediate characters
+  collect: string;
+  // params buffer
+  params: number[];
+  // should abort (default: false)
+  abort: boolean;
+}
+
+/**
+* DCS handler signature for EscapeSequenceParser.
+* EscapeSequenceParser handles DCS commands via separate
+* subparsers that get hook/unhooked and can handle
+* arbitrary amount of data.
+*
+* On entering a DSC sequence `hook` is called by
+* `EscapeSequenceParser`. Use it to initialize or reset
+* states needed to handle the current DCS sequence.
+* Note: A DCS parser is only instantiated once, therefore
+* you cannot rely on the ctor to reinitialize state.
+*
+* EscapeSequenceParser will call `put` several times if the
+* parsed data got split, therefore you might have to collect
+* `data` until `unhook` is called.
+* Note: `data` is borrowed, if you cannot process the data
+* in chunks you have to copy it, doing otherwise will lead to
+* data losses or corruption.
+*
+* `unhook` marks the end of the current DCS sequence.
+*/
+export interface IDcsHandler {
+  hook(collect: string, params: number[], flag: number): void;
+  put(data: Uint32Array, start: number, end: number): void;
+  unhook(): void;
+}
+
+/**
+* EscapeSequenceParser interface.
+*/
+export interface IEscapeSequenceParser extends IDisposable {
+  /**
+   * Reset the parser to its initial state (handlers are kept).
+   */
+  reset(): void;
+
+  /**
+   * Parse string `data`.
+   * @param data The data to parse.
+   */
+  parse(data: Uint32Array, length: number): void;
+
+  setPrintHandler(callback: (data: Uint32Array, start: number, end: number) => void): void;
+  clearPrintHandler(): void;
+
+  setExecuteHandler(flag: string, callback: () => void): void;
+  clearExecuteHandler(flag: string): void;
+  setExecuteHandlerFallback(callback: (code: number) => void): void;
+
+  setCsiHandler(flag: string, callback: (params: number[], collect: string) => void): void;
+  clearCsiHandler(flag: string): void;
+  setCsiHandlerFallback(callback: (collect: string, params: number[], flag: number) => void): void;
+  addCsiHandler(flag: string, callback: (params: number[], collect: string) => boolean): IDisposable;
+  addOscHandler(ident: number, callback: (data: string) => boolean): IDisposable;
+
+  setEscHandler(collectAndFlag: string, callback: () => void): void;
+  clearEscHandler(collectAndFlag: string): void;
+  setEscHandlerFallback(callback: (collect: string, flag: number) => void): void;
+
+  setOscHandler(ident: number, callback: (data: string) => void): void;
+  clearOscHandler(ident: number): void;
+  setOscHandlerFallback(callback: (identifier: number, data: string) => void): void;
+
+  setDcsHandler(collectAndFlag: string, handler: IDcsHandler): void;
+  clearDcsHandler(collectAndFlag: string): void;
+  setDcsHandlerFallback(handler: IDcsHandler): void;
+
+  setErrorHandler(callback: (state: IParsingState) => IParsingState): void;
+  clearErrorHandler(): void;
+}
+
+export interface IMouseZoneManager extends IDisposable {
+  add(zone: IMouseZone): void;
+  clearAll(start?: number, end?: number): void;
+}
+
+export interface IMouseZone {
+  x1: number;
+  x2: number;
+  y1: number;
+  y2: number;
+  clickCallback: (e: MouseEvent) => any;
+  hoverCallback: (e: MouseEvent) => any | undefined;
+  tooltipCallback: (e: MouseEvent) => any | undefined;
+  leaveCallback: () => any | undefined;
+  willLinkActivate: (e: MouseEvent) => boolean;
+}

src/Viewport.ts

@@ -3,87 +3,137 @@
  * @license MIT
  */
 
-import { ITerminal, IViewport } from './Interfaces';
-import { CharMeasure } from './utils/CharMeasure';
-import { IColorSet } from './renderer/Interfaces';
+import { ITerminal, IViewport } from './Types';
+import { CharMeasure } from './CharMeasure';
+import { Disposable } from './common/Lifecycle';
+import { addDisposableDomListener } from './ui/Lifecycle';
+import { IColorSet } from './ui/Types';
+import { IRenderDimensions } from './renderer/Types';
+
+const FALLBACK_SCROLL_BAR_WIDTH = 15;
 
 /**
  * Represents the viewport of a terminal, the visible area within the larger buffer of output.
  * Logic for the virtual scroll bar is included in this object.
  */
-export class Viewport implements IViewport {
-  private currentRowHeight: number = 0;
-  private lastRecordedBufferLength: number = 0;
-  private lastRecordedViewportHeight: number = 0;
-  private lastRecordedBufferHeight: number = 0;
-  private lastTouchY: number;
+export class Viewport extends Disposable implements IViewport {
+  public scrollBarWidth: number = 0;
+  private _currentRowHeight: number = 0;
+  private _lastRecordedBufferLength: number = 0;
+  private _lastRecordedViewportHeight: number = 0;
+  private _lastRecordedBufferHeight: number = 0;
+  private _lastTouchY: number;
+  private _lastScrollTop: number = 0;
+
+  // Stores a partial line amount when scrolling, this is used to keep track of how much of a line
+  // is scrolled so we can "scroll" over partial lines and feel natural on touchpads. This is a
+  // quick fix and could have a more robust solution in place that reset the value when needed.
+  private _wheelPartialScroll: number = 0;
+
+  private _refreshAnimationFrame: number | null = null;
+  private _ignoreNextScrollEvent: boolean = false;
 
   /**
    * Creates a new Viewport.
-   * @param terminal The terminal this viewport belongs to.
-   * @param viewportElement The DOM element acting as the viewport.
-   * @param scrollArea The DOM element acting as the scroll area.
-   * @param charMeasure A DOM element used to measure the character size of. the terminal.
+   * @param _terminal The terminal this viewport belongs to.
+   * @param _viewportElement The DOM element acting as the viewport.
+   * @param _scrollArea The DOM element acting as the scroll area.
+   * @param _charMeasure A DOM element used to measure the character size of. the terminal.
    */
   constructor(
-    private terminal: ITerminal,
-    private viewportElement: HTMLElement,
-    private scrollArea: HTMLElement,
-    private charMeasure: CharMeasure
+    private _terminal: ITerminal,
+    private _viewportElement: HTMLElement,
+    private _scrollArea: HTMLElement,
+    private _charMeasure: CharMeasure,
+    private _dimensions: IRenderDimensions
   ) {
-    this.viewportElement.addEventListener('scroll', this.onScroll.bind(this));
+    super();
+
+    // Measure the width of the scrollbar. If it is 0 we can assume it's an OSX overlay scrollbar.
+    // Unfortunately the overlay scrollbar would be hidden underneath the screen element in that case,
+    // therefore we account for a standard amount to make it visible
+    this.scrollBarWidth = (this._viewportElement.offsetWidth - this._scrollArea.offsetWidth) || FALLBACK_SCROLL_BAR_WIDTH;
+    this.register(addDisposableDomListener(this._viewportElement, 'scroll', this._onScroll.bind(this)));
 
     // Perform this async to ensure the CharMeasure is ready.
     setTimeout(() => this.syncScrollArea(), 0);
   }
 
-  public onThemeChanged(colors: IColorSet): void {
-    this.viewportElement.style.backgroundColor = colors.background;
+  public onDimensionsChance(dimensions: IRenderDimensions): void {
+    this._dimensions = dimensions;
+  }
+
+  public onThemeChange(colors: IColorSet): void {
+    this._viewportElement.style.backgroundColor = colors.background.css;
   }
 
   /**
    * Refreshes row height, setting line-height, viewport height and scroll area height if
    * necessary.
    */
-  private refresh(): void {
-    if (this.charMeasure.height > 0) {
-      this.currentRowHeight = this.terminal.renderer.dimensions.scaledCellHeight / window.devicePixelRatio;
+  private _refresh(): void {
+    if (this._refreshAnimationFrame === null) {
+      this._refreshAnimationFrame = requestAnimationFrame(() => this._innerRefresh());
+    }
+  }
 
-      if (this.lastRecordedViewportHeight !== this.terminal.renderer.dimensions.canvasHeight) {
-        this.lastRecordedViewportHeight = this.terminal.renderer.dimensions.canvasHeight;
-        this.viewportElement.style.height = this.lastRecordedViewportHeight + 'px';
-      }
-
-      const newBufferHeight = Math.round(this.currentRowHeight * this.lastRecordedBufferLength);
-      if (this.lastRecordedBufferHeight !== newBufferHeight) {
-        this.lastRecordedBufferHeight = newBufferHeight;
-        this.scrollArea.style.height = this.lastRecordedBufferHeight + 'px';
+  private _innerRefresh(): void {
+    if (this._charMeasure.height > 0) {
+      this._currentRowHeight = this._dimensions.scaledCellHeight / window.devicePixelRatio;
+      this._lastRecordedViewportHeight = this._viewportElement.offsetHeight;
+      const newBufferHeight = Math.round(this._currentRowHeight * this._lastRecordedBufferLength) + (this._lastRecordedViewportHeight - this._dimensions.canvasHeight);
+      if (this._lastRecordedBufferHeight !== newBufferHeight) {
+        this._lastRecordedBufferHeight = newBufferHeight;
+        this._scrollArea.style.height = this._lastRecordedBufferHeight + 'px';
       }
     }
+
+    // Sync scrollTop
+    const scrollTop = this._terminal.buffer.ydisp * this._currentRowHeight;
+    if (this._viewportElement.scrollTop !== scrollTop) {
+      // Ignore the next scroll event which will be triggered by setting the scrollTop as we do not
+      // want this event to scroll the terminal
+      this._ignoreNextScrollEvent = true;
+      this._viewportElement.scrollTop = scrollTop;
+    }
+
+    this._refreshAnimationFrame = null;
   }
 
   /**
    * Updates dimensions and synchronizes the scroll area if necessary.
    */
   public syncScrollArea(): void {
-    if (this.lastRecordedBufferLength !== this.terminal.buffer.lines.length) {
-      // If buffer height changed
-      this.lastRecordedBufferLength = this.terminal.buffer.lines.length;
-      this.refresh();
-    } else if (this.lastRecordedViewportHeight !== (<any>this.terminal).renderer.dimensions.canvasHeight) {
-      // If viewport height changed
-      this.refresh();
-    } else {
-      // If size has changed, refresh viewport
-      if (this.terminal.renderer.dimensions.scaledCellHeight / window.devicePixelRatio !== this.currentRowHeight) {
-        this.refresh();
-      }
+    // If buffer height changed
+    if (this._lastRecordedBufferLength !== this._terminal.buffer.lines.length) {
+      this._lastRecordedBufferLength = this._terminal.buffer.lines.length;
+      this._refresh();
+      return;
     }
 
-    // Sync scrollTop
-    const scrollTop = this.terminal.buffer.ydisp * this.currentRowHeight;
-    if (this.viewportElement.scrollTop !== scrollTop) {
-      this.viewportElement.scrollTop = scrollTop;
+    // If viewport height changed
+    if (this._lastRecordedViewportHeight !== this._dimensions.canvasHeight) {
+      this._refresh();
+      return;
+    }
+
+    // If the buffer position doesn't match last scroll top
+    const newScrollTop = this._terminal.buffer.ydisp * this._currentRowHeight;
+    if (this._lastScrollTop !== newScrollTop) {
+      this._refresh();
+      return;
+    }
+
+    // If element's scroll top changed, this can happen when hiding the element
+    if (this._lastScrollTop !== this._viewportElement.scrollTop) {
+      this._refresh();
+      return;
+    }
+
+    // If row height changed
+    if (this._dimensions.scaledCellHeight / window.devicePixelRatio !== this._currentRowHeight) {
+      this._refresh();
+      return;
     }
   }
 
@@ -92,10 +142,25 @@ export class Viewport implements IViewport {
    * terminal to scroll to it.
    * @param ev The scroll event.
    */
-  private onScroll(ev: Event): void {
-    const newRow = Math.round(this.viewportElement.scrollTop / this.currentRowHeight);
-    const diff = newRow - this.terminal.buffer.ydisp;
-    this.terminal.scrollLines(diff, true);
+  private _onScroll(ev: Event): void {
+    // Record current scroll top position
+    this._lastScrollTop = this._viewportElement.scrollTop;
+
+    // Don't attempt to scroll if the element is not visible, otherwise scrollTop will be corrupt
+    // which causes the terminal to scroll the buffer to the top
+    if (!this._viewportElement.offsetParent) {
+      return;
+    }
+
+    // Ignore the event if it was flagged to ignore (when the source of the event is from Viewport)
+    if (this._ignoreNextScrollEvent) {
+      this._ignoreNextScrollEvent = false;
+      return;
+    }
+
+    const newRow = Math.round(this._lastScrollTop / this._currentRowHeight);
+    const diff = newRow - this._terminal.buffer.ydisp;
+    this._terminal.scrollLines(diff, true);
   }
 
   /**
@@ -105,41 +170,74 @@ export class Viewport implements IViewport {
    * @param ev The mouse wheel event.
    */
   public onWheel(ev: WheelEvent): void {
-    if (ev.deltaY === 0) {
-      // Do nothing if it's not a vertical scroll event
+    const amount = this._getPixelsScrolled(ev);
+    if (amount === 0) {
       return;
     }
-    // Fallback to WheelEvent.DOM_DELTA_PIXEL
-    let multiplier = 1;
-    if (ev.deltaMode === WheelEvent.DOM_DELTA_LINE) {
-      multiplier = this.currentRowHeight;
-    } else if (ev.deltaMode === WheelEvent.DOM_DELTA_PAGE) {
-      multiplier = this.currentRowHeight * this.terminal.rows;
-    }
-    this.viewportElement.scrollTop += ev.deltaY * multiplier;
+    this._viewportElement.scrollTop += amount;
     // Prevent the page from scrolling when the terminal scrolls
     ev.preventDefault();
-  };
+  }
+
+  private _getPixelsScrolled(ev: WheelEvent): number {
+    // Do nothing if it's not a vertical scroll event
+    if (ev.deltaY === 0) {
+      return 0;
+    }
+
+    // Fallback to WheelEvent.DOM_DELTA_PIXEL
+    let amount = ev.deltaY;
+    if (ev.deltaMode === WheelEvent.DOM_DELTA_LINE) {
+      amount *= this._currentRowHeight;
+    } else if (ev.deltaMode === WheelEvent.DOM_DELTA_PAGE) {
+      amount *= this._currentRowHeight * this._terminal.rows;
+    }
+    return amount;
+  }
+
+  /**
+   * Gets the number of pixels scrolled by the mouse event taking into account what type of delta
+   * is being used.
+   * @param ev The mouse wheel event.
+   */
+  public getLinesScrolled(ev: WheelEvent): number {
+    // Do nothing if it's not a vertical scroll event
+    if (ev.deltaY === 0) {
+      return 0;
+    }
+
+    // Fallback to WheelEvent.DOM_DELTA_LINE
+    let amount = ev.deltaY;
+    if (ev.deltaMode === WheelEvent.DOM_DELTA_PIXEL) {
+      amount /= this._currentRowHeight + 0.0; // Prevent integer division
+      this._wheelPartialScroll += amount;
+      amount = Math.floor(Math.abs(this._wheelPartialScroll)) * (this._wheelPartialScroll > 0 ? 1 : -1);
+      this._wheelPartialScroll %= 1;
+    } else if (ev.deltaMode === WheelEvent.DOM_DELTA_PAGE) {
+      amount *= this._terminal.rows;
+    }
+    return amount;
+  }
 
   /**
    * Handles the touchstart event, recording the touch occurred.
    * @param ev The touch event.
    */
   public onTouchStart(ev: TouchEvent): void {
-    this.lastTouchY = ev.touches[0].pageY;
-  };
+    this._lastTouchY = ev.touches[0].pageY;
+  }
 
   /**
    * Handles the touchmove event, scrolling the viewport if the position shifted.
    * @param ev The touch event.
    */
   public onTouchMove(ev: TouchEvent): void {
-    let deltaY = this.lastTouchY - ev.touches[0].pageY;
-    this.lastTouchY = ev.touches[0].pageY;
+    const deltaY = this._lastTouchY - ev.touches[0].pageY;
+    this._lastTouchY = ev.touches[0].pageY;
     if (deltaY === 0) {
       return;
     }
-    this.viewportElement.scrollTop += deltaY;
+    this._viewportElement.scrollTop += deltaY;
     ev.preventDefault();
-  };
+  }
 }

src/WindowsMode.ts

@@ -0,0 +1,30 @@
+/**
+ * Copyright (c) 2019 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+import { IDisposable } from 'xterm';
+import { ITerminal } from './Types';
+import { CHAR_DATA_CODE_INDEX, NULL_CELL_CODE, WHITESPACE_CELL_CODE } from './core/buffer/BufferLine';
+
+export function applyWindowsMode(terminal: ITerminal): IDisposable {
+  // Winpty does not support wraparound mode which means that lines will never
+  // be marked as wrapped. This causes issues for things like copying a line
+  // retaining the wrapped new line characters or if consumers are listening
+  // in on the data stream.
+  //
+  // The workaround for this is to listen to every incoming line feed and mark
+  // the line as wrapped if the last character in the previous line is not a
+  // space. This is certainly not without its problems, but generally on
+  // Windows when text reaches the end of the terminal it's likely going to be
+  // wrapped.
+  return terminal.onLineFeed(() => {
+    const line = terminal.buffer.lines.get(terminal.buffer.ybase + terminal.buffer.y - 1);
+    const lastChar = line.get(terminal.cols - 1);
+
+    if (lastChar[CHAR_DATA_CODE_INDEX] !== NULL_CELL_CODE && lastChar[CHAR_DATA_CODE_INDEX] !== WHITESPACE_CELL_CODE) {
+      const nextLine = terminal.buffer.lines.get(terminal.buffer.ybase + terminal.buffer.y);
+      nextLine.isWrapped = true;
+    }
+  });
+}

src/addons/attach/Interfaces.ts

@@ -0,0 +1,23 @@
+/**
+ * Copyright (c) 2018 The xterm.js authors. All rights reserved.
+ * @license MIT
+ *
+ * Implements the attach method, that attaches the terminal to a WebSocket stream.
+ */
+
+import { Terminal, IDisposable } from 'xterm';
+
+export interface IAttachAddonTerminal extends Terminal {
+  _core: {
+    register<T extends IDisposable>(d: T): void;
+  };
+
+  __socket?: WebSocket;
+  __attachSocketBuffer?: string;
+  __dataListener?: IDisposable;
+
+  __getMessage?(ev: MessageEvent): void;
+  __flushBuffer?(): void;
+  __pushToBuffer?(data: string): void;
+  __sendData?(data: string): void;
+}

src/addons/attach/attach.test.ts

@@ -3,16 +3,16 @@
  * @license MIT
  */
 
-import { assert, expect } from 'chai';
+import { assert } from 'chai';
 
-import * as attach from './attach'
+import * as attach from './attach';
 
 class MockTerminal {}
 
 describe('attach addon', () => {
   describe('apply', () => {
     it('should do register the `attach` and `detach` methods', () => {
-      attach.apply(MockTerminal);
+      attach.apply(<any>MockTerminal);
       assert.equal(typeof (<any>MockTerminal).prototype.attach, 'function');
       assert.equal(typeof (<any>MockTerminal).prototype.detach, 'function');
     });

src/addons/attach/attach.ts

@@ -5,118 +5,153 @@
  * Implements the attach method, that attaches the terminal to a WebSocket stream.
  */
 
+import { Terminal, IDisposable } from 'xterm';
+import { IAttachAddonTerminal } from './Interfaces';
+
 /**
  * Attaches the given terminal to the given socket.
  *
- * @param {Terminal} term - The terminal to be attached to the given socket.
- * @param {WebSocket} socket - The socket to attach the current terminal.
- * @param {boolean} bidirectional - Whether the terminal should send data
- *                                  to the socket as well.
- * @param {boolean} buffered - Whether the rendering of incoming data
- *                             should happen instantly or at a maximum
- *                             frequency of 1 rendering per 10ms.
+ * @param term The terminal to be attached to the given socket.
+ * @param socket The socket to attach the current terminal.
+ * @param bidirectional Whether the terminal should send data to the socket as well.
+ * @param buffered Whether the rendering of incoming data should happen instantly or at a maximum
+ * frequency of 1 rendering per 10ms.
  */
-export function attach(term, socket, bidirectional, buffered) {
-  bidirectional = (typeof bidirectional == 'undefined') ? true : bidirectional;
-  term.socket = socket;
+export function attach(term: Terminal, socket: WebSocket, bidirectional: boolean, buffered: boolean): void {
+  const addonTerminal = <IAttachAddonTerminal>term;
+  bidirectional = (typeof bidirectional === 'undefined') ? true : bidirectional;
+  addonTerminal.__socket = socket;
 
-  term._flushBuffer = function() {
-    term.write(term._attachSocketBuffer);
-    term._attachSocketBuffer = null;
+  addonTerminal.__flushBuffer = () => {
+    addonTerminal.write(addonTerminal.__attachSocketBuffer);
+    addonTerminal.__attachSocketBuffer = null;
   };
 
-  term._pushToBuffer = function(data) {
-    if (term._attachSocketBuffer) {
-      term._attachSocketBuffer += data;
+  addonTerminal.__pushToBuffer = (data: string) => {
+    if (addonTerminal.__attachSocketBuffer) {
+      addonTerminal.__attachSocketBuffer += data;
     } else {
-      term._attachSocketBuffer = data;
-      setTimeout(term._flushBuffer, 10);
+      addonTerminal.__attachSocketBuffer = data;
+      setTimeout(addonTerminal.__flushBuffer, 10);
     }
   };
 
-  var myTextDecoder;
+  // TODO: This should be typed but there seem to be issues importing the type
+  let myTextDecoder: any;
 
-  term._getMessage = function(ev) {
-    var str;
-    if (typeof ev.data === "object") {
+  addonTerminal.__getMessage = function(ev: MessageEvent): void {
+    let str: string;
+
+    if (typeof ev.data === 'object') {
+      if (!myTextDecoder) {
+        myTextDecoder = new TextDecoder();
+      }
       if (ev.data instanceof ArrayBuffer) {
-          if (!myTextDecoder) {
-            myTextDecoder = new TextDecoder();
-          }
+        str = myTextDecoder.decode(ev.data);
+        displayData(str);
+      } else {
+        const fileReader = new FileReader();
 
-          str = myTextDecoder.decode( ev.data );
+        fileReader.addEventListener('load', () => {
+          str = myTextDecoder.decode(fileReader.result);
+          displayData(str);
+        });
+        fileReader.readAsArrayBuffer(ev.data);
       }
-      else {
-        throw "TODO: handle Blob?";
-      }
-    }
-
-    if (buffered) {
-      term._pushToBuffer(str || ev.data);
+    } else if (typeof ev.data === 'string') {
+      displayData(ev.data);
     } else {
-      term.write(str || ev.data);
+      throw Error(`Cannot handle "${typeof ev.data}" websocket message.`);
     }
   };
 
-  term._sendData = function(data) {
+  /**
+  * Push data to buffer or write it in the terminal.
+  * This is used as a callback for FileReader.onload.
+  *
+  * @param str String decoded by FileReader.
+  * @param data The data of the EventMessage.
+  */
+  function displayData(str?: string, data?: string): void {
+    if (buffered) {
+      addonTerminal.__pushToBuffer(str || data);
+    } else {
+      addonTerminal.write(str || data);
+    }
+  }
+
+  addonTerminal.__sendData = (data: string) => {
     if (socket.readyState !== 1) {
       return;
     }
     socket.send(data);
   };
 
-  socket.addEventListener('message', term._getMessage);
+  addonTerminal._core.register(addSocketListener(socket, 'message', addonTerminal.__getMessage));
 
   if (bidirectional) {
-    term.on('data', term._sendData);
+    addonTerminal.__dataListener = addonTerminal.onData(addonTerminal.__sendData);
+    addonTerminal._core.register(addonTerminal.__dataListener);
   }
 
-  socket.addEventListener('close', term.detach.bind(term, socket));
-  socket.addEventListener('error', term.detach.bind(term, socket));
-};
+  addonTerminal._core.register(addSocketListener(socket, 'close', () => detach(addonTerminal, socket)));
+  addonTerminal._core.register(addSocketListener(socket, 'error', () => detach(addonTerminal, socket)));
+}
+
+function addSocketListener(socket: WebSocket, type: string, handler: (this: WebSocket, ev: Event) => any): IDisposable {
+  socket.addEventListener(type, handler);
+  return {
+    dispose: () => {
+      if (!handler) {
+        // Already disposed
+        return;
+      }
+      socket.removeEventListener(type, handler);
+      handler = null;
+    }
+  };
+}
 
 /**
  * Detaches the given terminal from the given socket
  *
- * @param {Terminal} term - The terminal to be detached from the given socket.
- * @param {WebSocket} socket - The socket from which to detach the current
- *                             terminal.
+ * @param term The terminal to be detached from the given socket.
+ * @param socket The socket from which to detach the current terminal.
  */
-export function detach(term, socket) {
-  term.off('data', term._sendData);
+export function detach(term: Terminal, socket: WebSocket): void {
+  const addonTerminal = <IAttachAddonTerminal>term;
+  addonTerminal.__dataListener.dispose();
+  addonTerminal.__dataListener = undefined;
 
-  socket = (typeof socket == 'undefined') ? term.socket : socket;
+  socket = (typeof socket === 'undefined') ? addonTerminal.__socket : socket;
 
   if (socket) {
-    socket.removeEventListener('message', term._getMessage);
+    socket.removeEventListener('message', addonTerminal.__getMessage);
   }
 
-  delete term.socket;
-};
+  delete addonTerminal.__socket;
+}
 
 
-export function apply(terminalConstructor) {
+export function apply(terminalConstructor: typeof Terminal): void {
   /**
    * Attaches the current terminal to the given socket
    *
-   * @param {WebSocket} socket - The socket to attach the current terminal.
-   * @param {boolean} bidirectional - Whether the terminal should send data
-   *                                  to the socket as well.
-   * @param {boolean} buffered - Whether the rendering of incoming data
-   *                             should happen instantly or at a maximum
-   *                             frequency of 1 rendering per 10ms.
+   * @param socket The socket to attach the current terminal.
+   * @param bidirectional Whether the terminal should send data to the socket as well.
+   * @param buffered Whether the rendering of incoming data should happen instantly or at a maximum
+   * frequency of 1 rendering per 10ms.
    */
-  terminalConstructor.prototype.attach = function(socket, bidirectional, buffered) {
-    return attach(this, socket, bidirectional, buffered);
+  (<any>terminalConstructor.prototype).attach = function (socket: WebSocket, bidirectional: boolean, buffered: boolean): void {
+    attach(this, socket, bidirectional, buffered);
   };
 
   /**
    * Detaches the current terminal from the given socket.
    *
-   * @param {WebSocket} socket - The socket from which to detach the current
-   *                             terminal.
+   * @param socket The socket from which to detach the current terminal.
    */
-  terminalConstructor.prototype.detach = function(socket) {
-    return detach(this, socket);
+  (<any>terminalConstructor.prototype).detach = function (socket: WebSocket): void {
+    detach(this, socket);
   };
 }

src/addons/attach/tsconfig.json

@@ -2,9 +2,18 @@
   "compilerOptions": {
     "module": "commonjs",
     "target": "es5",
+    "lib": [
+      "dom",
+      "es6",
+    ],
     "rootDir": ".",
     "outDir": "../../../lib/addons/attach/",
     "sourceMap": true,
-    "removeComments": true
-  }
+    "removeComments": true,
+    "declaration": true
+  },
+  "include": [
+    "**/*.ts",
+    "../../../typings/xterm.d.ts"
+  ]
 }

src/addons/fit/README.md

@@ -0,0 +1,3 @@
+## fit addon
+
+The fit addon adjusts the dimensions of the terminal to match best fit its parent element container. `fit` will only work when the element is visible.

src/addons/fit/fit.test.ts

@@ -3,16 +3,16 @@
  * @license MIT
  */
 
-import { assert, expect } from 'chai';
+import { assert } from 'chai';
 
-import * as fit from './fit'
+import * as fit from './fit';
 
 class MockTerminal {}
 
 describe('fit addon', () => {
   describe('apply', () => {
     it('should do register the `proposeGeometry` and `fit` methods', () => {
-      fit.apply(MockTerminal);
+      fit.apply(<any>MockTerminal);
       assert.equal(typeof (<any>MockTerminal).prototype.proposeGeometry, 'function');
       assert.equal(typeof (<any>MockTerminal).prototype.fit, 'function');
     });

src/addons/fit/fit.ts

@@ -13,43 +13,55 @@
  *          row and truncate its width with the current number of columns).
  */
 
-export function proposeGeometry(term) {
+import { Terminal } from 'xterm';
+
+export interface IGeometry {
+  rows: number;
+  cols: number;
+}
+
+export function proposeGeometry(term: Terminal): IGeometry {
   if (!term.element.parentElement) {
     return null;
   }
-  var parentElementStyle = window.getComputedStyle(term.element.parentElement);
-  var parentElementHeight = parseInt(parentElementStyle.getPropertyValue('height'));
-  var parentElementWidth = Math.max(0, parseInt(parentElementStyle.getPropertyValue('width')) - 17);
-  var elementStyle = window.getComputedStyle(term.element);
-  var elementPaddingVer = parseInt(elementStyle.getPropertyValue('padding-top')) + parseInt(elementStyle.getPropertyValue('padding-bottom'));
-  var elementPaddingHor = parseInt(elementStyle.getPropertyValue('padding-right')) + parseInt(elementStyle.getPropertyValue('padding-left'));
-  var availableHeight = parentElementHeight - elementPaddingVer;
-  var availableWidth = parentElementWidth - elementPaddingHor;
-  var geometry = {
-    cols: Math.floor(availableWidth / term.renderer.dimensions.actualCellWidth),
-    rows: Math.floor(availableHeight / term.renderer.dimensions.actualCellHeight)
+  const parentElementStyle = window.getComputedStyle(term.element.parentElement);
+  const parentElementHeight = parseInt(parentElementStyle.getPropertyValue('height'));
+  const parentElementWidth = Math.max(0, parseInt(parentElementStyle.getPropertyValue('width')));
+  const elementStyle = window.getComputedStyle(term.element);
+  const elementPadding = {
+    top: parseInt(elementStyle.getPropertyValue('padding-top')),
+    bottom: parseInt(elementStyle.getPropertyValue('padding-bottom')),
+    right: parseInt(elementStyle.getPropertyValue('padding-right')),
+    left: parseInt(elementStyle.getPropertyValue('padding-left'))
+  };
+  const elementPaddingVer = elementPadding.top + elementPadding.bottom;
+  const elementPaddingHor = elementPadding.right + elementPadding.left;
+  const availableHeight = parentElementHeight - elementPaddingVer;
+  const availableWidth = parentElementWidth - elementPaddingHor - (<any>term)._core.viewport.scrollBarWidth;
+  const geometry = {
+    cols: Math.floor(availableWidth / (<any>term)._core._renderCoordinator.dimensions.actualCellWidth),
+    rows: Math.floor(availableHeight / (<any>term)._core._renderCoordinator.dimensions.actualCellHeight)
   };
-
   return geometry;
-};
+}
 
-export function fit(term) {
-  var geometry = proposeGeometry(term);
+export function fit(term: Terminal): void {
+  const geometry = proposeGeometry(term);
   if (geometry) {
     // Force a full render
     if (term.rows !== geometry.rows || term.cols !== geometry.cols) {
-      term.renderer.clear();
+      (<any>term)._core._renderCoordinator.clear();
       term.resize(geometry.cols, geometry.rows);
     }
   }
-};
-
-export function apply(terminalConstructor) {
-  terminalConstructor.prototype.proposeGeometry = function() {
-    return proposeGeometry(this);
-  }
-
-  terminalConstructor.prototype.fit = function() {
-    return fit(this);
-  }
+}
+
+export function apply(terminalConstructor: typeof Terminal): void {
+  (<any>terminalConstructor.prototype).proposeGeometry = function (): IGeometry {
+    return proposeGeometry(this);
+  };
+
+  (<any>terminalConstructor.prototype).fit = function (): void {
+    fit(this);
+  };
 }

src/addons/fit/tsconfig.json

@@ -2,9 +2,21 @@
   "compilerOptions": {
     "module": "commonjs",
     "target": "es5",
+    "lib": [
+      "dom",
+      "es5"
+    ],
     "rootDir": ".",
     "outDir": "../../../lib/addons/fit/",
     "sourceMap": true,
-    "removeComments": true
-  }
+    "removeComments": true,
+    "declaration": true,
+    "types": [
+      "../../node_modules/@types/mocha"
+    ]
+  },
+  "include": [
+    "**/*.ts",
+    "../../../typings/xterm.d.ts"
+  ]
 }

src/addons/fullscreen/fullscreen.test.ts

@@ -3,16 +3,16 @@
  * @license MIT
  */
 
-import { assert, expect } from 'chai';
+import { assert } from 'chai';
 
-import * as fullscreen from './fullscreen'
+import * as fullscreen from './fullscreen';
 
 class MockTerminal {}
 
 describe('fullscreen addon', () => {
   describe('apply', () => {
     it('should do register the `toggleFullscreen` method', () => {
-      fullscreen.apply(MockTerminal);
+      fullscreen.apply(<any>MockTerminal);
       assert.equal(typeof (<any>MockTerminal).prototype.toggleFullScreen, 'function');
     });
   });

src/addons/fullscreen/fullscreen.ts

@@ -3,27 +3,31 @@
  * @license MIT
  */
 
+import { Terminal } from 'xterm';
+
 /**
  * Toggle the given terminal's fullscreen mode.
- * @param {Terminal} term - The terminal to toggle full screen mode
- * @param {boolean} fullscreen - Toggle fullscreen on (true) or off (false)
+ * @param term The terminal to toggle full screen mode
+ * @param fullscreen Toggle fullscreen on (true) or off (false)
  */
-export function toggleFullScreen(term, fullscreen) {
-  var fn;
+export function toggleFullScreen(term: Terminal, fullscreen: boolean): void {
+  let fn: (...tokens: string[]) => void;
 
-  if (typeof fullscreen == 'undefined') {
-    fn = (term.element.classList.contains('fullscreen')) ? 'remove' : 'add';
+  if (typeof fullscreen === 'undefined') {
+    fn = (term.element.classList.contains('fullscreen')) ?
+      term.element.classList.remove : term.element.classList.add;
   } else if (!fullscreen) {
-    fn = 'remove';
+    fn = term.element.classList.remove;
   } else {
-    fn = 'add';
+    fn = term.element.classList.add;
   }
 
-  term.element.classList[fn]('fullscreen');
-};
+  fn = fn.bind(term.element.classList);
+  fn('fullscreen');
+}
 
-export function apply(terminalConstructor) {
-  terminalConstructor.prototype.toggleFullScreen = function (fullscreen) {
-    return toggleFullScreen(this, fullscreen);
+export function apply(terminalConstructor: typeof Terminal): void {
+  (<any>terminalConstructor.prototype).toggleFullScreen = function (fullscreen: boolean): void {
+    toggleFullScreen(this, fullscreen);
   };
 }

src/addons/fullscreen/tsconfig.json

@@ -2,9 +2,21 @@
   "compilerOptions": {
     "module": "commonjs",
     "target": "es5",
+    "lib": [
+      "dom",
+      "es5"
+    ],
     "rootDir": ".",
     "outDir": "../../../lib/addons/fullscreen/",
     "sourceMap": true,
-    "removeComments": true
-  }
+    "removeComments": true,
+    "declaration": true,
+    "types": [
+      "../../node_modules/@types/mocha"
+    ]
+  },
+  "include": [
+    "**/*.ts",
+    "../../../typings/xterm.d.ts"
+  ]
 }

src/addons/search/Interfaces.ts

@@ -0,0 +1,32 @@
+/**
+ * Copyright (c) 2018 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+import { Terminal } from 'xterm';
+
+export interface ISearchAddonTerminal extends Terminal {
+  __searchHelper?: ISearchHelper;
+}
+
+export interface ISearchHelper {
+  findNext(term: string, searchOptions: ISearchOptions): boolean;
+  findPrevious(term: string, searchOptions: ISearchOptions): boolean;
+}
+
+export interface ISearchOptions {
+  regex?: boolean;
+  wholeWord?: boolean;
+  caseSensitive?: boolean;
+  /**
+   * Use this when you want the selection to expand if it still matches as the
+   * user types. Note that this only affects findNext.
+   */
+  incremental?: boolean;
+}
+
+export interface ISearchResult {
+  term: string;
+  col: number;
+  row: number;
+}

src/addons/search/SearchHelper.ts

@@ -3,57 +3,92 @@
  * @license MIT
  */
 
-// import { ITerminal } from '../../Interfaces';
-// import { translateBufferLineToString } from '../../utils/BufferLine';
+import { ISearchHelper, ISearchAddonTerminal, ISearchOptions, ISearchResult } from './Interfaces';
+import { IDisposable } from 'xterm';
 
-interface ISearchResult {
-  term: string;
-  col: number;
-  row: number;
-}
+const NON_WORD_CHARACTERS = ' ~!@#$%^&*()+`-=[]{}|\;:"\',./<>?';
+const LINES_CACHE_TIME_TO_LIVE = 15 * 1000; // 15 secs
 
 /**
  * A class that knows how to search the terminal and how to display the results.
  */
-export class SearchHelper {
-  constructor(private _terminal: any) {
-    // TODO: Search for multiple instances on 1 line
-    // TODO: Don't use the actual selection, instead use a "find selection" so multiple instances can be highlighted
-    // TODO: Highlight other instances in the viewport
-    // TODO: Support regex, case sensitivity, etc.
+export class SearchHelper implements ISearchHelper {
+  /**
+   * translateBufferLineToStringWithWrap is a fairly expensive call.
+   * We memoize the calls into an array that has a time based ttl.
+   * _linesCache is also invalidated when the terminal cursor moves.
+   */
+  private _linesCache: string[] = null;
+  private _linesCacheTimeoutId = 0;
+  private _cursorMoveListener: IDisposable | undefined;
+  private _resizeListener: IDisposable | undefined;
+
+  constructor(private _terminal: ISearchAddonTerminal) {
+    this._destroyLinesCache = this._destroyLinesCache.bind(this);
   }
 
   /**
    * Find the next instance of the term, then scroll to and select it. If it
    * doesn't exist, do nothing.
-   * @param term Tne search term.
+   * @param term The search term.
+   * @param searchOptions Search options.
    * @return Whether a result was found.
    */
-  public findNext(term: string): boolean {
+  public findNext(term: string, searchOptions?: ISearchOptions): boolean {
+    const {incremental} = searchOptions;
+    let result: ISearchResult;
+
     if (!term || term.length === 0) {
+      this._terminal.clearSelection();
       return false;
     }
 
-    let result: ISearchResult;
+    let startCol: number = 0;
+    let startRow = this._terminal.buffer.viewportY;
 
-    let startRow = this._terminal.buffer.ydisp;
-    if (this._terminal.selectionManager.selectionEnd) {
+    if (this._terminal.hasSelection()) {
       // Start from the selection end if there is a selection
-      startRow = this._terminal.selectionManager.selectionEnd[1];
+      // For incremental search, use existing row
+      const currentSelection = this._terminal.getSelectionPosition();
+      startRow = incremental ? currentSelection.startRow : currentSelection.endRow;
+      startCol = incremental ? currentSelection.startColumn : currentSelection.endColumn;
     }
 
-    // Search from ydisp + 1 to end
-    for (let y = startRow + 1; y < this._terminal.buffer.ybase + this._terminal.rows; y++) {
-      result = this._findInLine(term, y);
-      if (result) {
-        break;
+    this._initLinesCache();
+
+    // A row that has isWrapped = false
+    let findingRow = startRow;
+    // index of beginning column that _findInLine need to scan.
+    let cumulativeCols = startCol;
+    // If startRow is wrapped row, scan for unwrapped row above.
+    // So we can start matching on wrapped line from long unwrapped line.
+    while (this._terminal.buffer.getLine(findingRow).isWrapped) {
+      findingRow--;
+      cumulativeCols += this._terminal.cols;
+    }
+
+    // Search startRow
+    result = this._findInLine(term, findingRow, cumulativeCols, searchOptions);
+
+    // Search from startRow + 1 to end
+    if (!result) {
+
+      for (let y = startRow + 1; y < this._terminal.buffer.baseY + this._terminal.rows; y++) {
+
+        // If the current line is wrapped line, increase index of column to ignore the previous scan
+        // Otherwise, reset beginning column index to zero with set new unwrapped line index
+        result = this._findInLine(term, y, 0, searchOptions);
+        if (result) {
+          break;
+        }
       }
     }
 
-    // Search from the top to the current ydisp
+    // Search from the top to the startRow (search the whole startRow again in
+    // case startCol > 0)
     if (!result) {
-      for (let y = 0; y < startRow; y++) {
-        result = this._findInLine(term, y);
+      for (let y = 0; y < findingRow; y++) {
+        result = this._findInLine(term, y, 0, searchOptions);
         if (result) {
           break;
         }
@@ -67,37 +102,72 @@ export class SearchHelper {
   /**
    * Find the previous instance of the term, then scroll to and select it. If it
    * doesn't exist, do nothing.
-   * @param term Tne search term.
+   * @param term The search term.
+   * @param searchOptions Search options.
    * @return Whether a result was found.
    */
-  public findPrevious(term: string): boolean {
+  public findPrevious(term: string, searchOptions?: ISearchOptions): boolean {
+    let result: ISearchResult;
+
     if (!term || term.length === 0) {
+      this._terminal.clearSelection();
       return false;
     }
 
-    let result: ISearchResult;
+    const isReverseSearch = true;
+    let startRow = this._terminal.buffer.viewportY + this._terminal.rows - 1;
+    let startCol = this._terminal.cols;
 
-    let startRow = this._terminal.buffer.ydisp;
-    if (this._terminal.selectionManager.selectionStart) {
-      // Start from the selection end if there is a selection
-      startRow = this._terminal.selectionManager.selectionStart[1];
+    if (this._terminal.hasSelection()) {
+      // Start from the selection start if there is a selection
+      const currentSelection = this._terminal.getSelectionPosition();
+      startRow = currentSelection.startRow;
+      startCol = currentSelection.startColumn;
     }
 
-    // Search from ydisp + 1 to end
-    for (let y = startRow - 1; y >= 0; y--) {
-      result = this._findInLine(term, y);
-      if (result) {
-        break;
+    this._initLinesCache();
+
+    // Search startRow
+    result = this._findInLine(term, startRow, startCol, searchOptions, isReverseSearch);
+
+    // Search from startRow - 1 to top
+    if (!result) {
+      // If the line is wrapped line, increase number of columns that is needed to be scanned
+      // Se we can scan on wrapped line from unwrapped line
+      let cumulativeCols = this._terminal.cols;
+      if (this._terminal.buffer.getLine(startRow).isWrapped) {
+        cumulativeCols += startCol;
+      }
+      for (let y = startRow - 1; y >= 0; y--) {
+        result = this._findInLine(term, y, cumulativeCols, searchOptions, isReverseSearch);
+        if (result) {
+          break;
+        }
+        // If the current line is wrapped line, increase scanning range,
+        // preparing for scanning on unwrapped line
+        if (this._terminal.buffer.getLine(y).isWrapped) {
+          cumulativeCols += this._terminal.cols;
+        } else {
+          cumulativeCols = this._terminal.cols;
+        }
       }
     }
 
-    // Search from the top to the current ydisp
+    // Search from the bottom to startRow (search the whole startRow again in
+    // case startCol > 0)
     if (!result) {
-      for (let y = this._terminal.buffer.ybase + this._terminal.rows - 1; y > startRow; y--) {
-        result = this._findInLine(term, y);
+      const searchFrom = this._terminal.buffer.baseY + this._terminal.rows - 1;
+      let cumulativeCols = this._terminal.cols;
+      for (let y = searchFrom; y >= startRow; y--) {
+        result = this._findInLine(term, y, cumulativeCols, searchOptions, isReverseSearch);
         if (result) {
           break;
         }
+        if (this._terminal.buffer.getLine(y).isWrapped) {
+          cumulativeCols += this._terminal.cols;
+        } else {
+          cumulativeCols = this._terminal.cols;
+        }
       }
     }
 
@@ -106,23 +176,156 @@ export class SearchHelper {
   }
 
   /**
-   * Searches a line for a search term.
-   * @param term Tne search term.
-   * @param y The line to search.
+   * Sets up a line cache with a ttl
+   */
+  private _initLinesCache(): void {
+    if (!this._linesCache) {
+      this._linesCache = new Array(this._terminal.buffer.length);
+      this._cursorMoveListener = this._terminal.onCursorMove(() => this._destroyLinesCache());
+      this._resizeListener = this._terminal.onResize(() => this._destroyLinesCache());
+    }
+
+    window.clearTimeout(this._linesCacheTimeoutId);
+    this._linesCacheTimeoutId = window.setTimeout(() => this._destroyLinesCache(), LINES_CACHE_TIME_TO_LIVE);
+  }
+
+  private _destroyLinesCache(): void {
+    this._linesCache = null;
+    if (this._cursorMoveListener) {
+      this._cursorMoveListener.dispose();
+      this._cursorMoveListener = undefined;
+    }
+    if (this._resizeListener) {
+      this._resizeListener.dispose();
+      this._resizeListener = undefined;
+    }
+    if (this._linesCacheTimeoutId) {
+      window.clearTimeout(this._linesCacheTimeoutId);
+      this._linesCacheTimeoutId = 0;
+    }
+  }
+
+  /**
+   * A found substring is a whole word if it doesn't have an alphanumeric character directly adjacent to it.
+   * @param searchIndex starting indext of the potential whole word substring
+   * @param line entire string in which the potential whole word was found
+   * @param term the substring that starts at searchIndex
+   */
+  private _isWholeWord(searchIndex: number, line: string, term: string): boolean {
+    return (((searchIndex === 0) || (NON_WORD_CHARACTERS.indexOf(line[searchIndex - 1]) !== -1)) &&
+        (((searchIndex + term.length) === line.length) || (NON_WORD_CHARACTERS.indexOf(line[searchIndex + term.length]) !== -1)));
+  }
+
+  /**
+   * Searches a line for a search term. Takes the provided terminal line and searches the text line, which may contain
+   * subsequent terminal lines if the text is wrapped. If the provided line number is part of a wrapped text line that
+   * started on an earlier line then it is skipped since it will be properly searched when the terminal line that the
+   * text starts on is searched.
+   * @param term The search term.
+   * @param row The line to  start the search from.
+   * @param col The column to start the search from.
+   * @param searchOptions Search options.
    * @return The search result if it was found.
    */
-  private _findInLine(term: string, y: number): ISearchResult {
-    const lowerStringLine = this._terminal.buffer.translateBufferLineToString(y, true).toLowerCase();
-    const lowerTerm = term.toLowerCase();
-    const searchIndex = lowerStringLine.indexOf(lowerTerm);
-    if (searchIndex >= 0) {
+  protected _findInLine(term: string, row: number, col: number, searchOptions: ISearchOptions = {}, isReverseSearch: boolean = false): ISearchResult {
+
+    // Ignore wrapped lines, only consider on unwrapped line (first row of command string).
+    if (this._terminal.buffer.getLine(row).isWrapped) {
+      return;
+    }
+    let stringLine = this._linesCache ? this._linesCache[row] : void 0;
+    if (stringLine === void 0) {
+      stringLine = this.translateBufferLineToStringWithWrap(row, true);
+      if (this._linesCache) {
+        this._linesCache[row] = stringLine;
+      }
+    }
+
+    const searchTerm = searchOptions.caseSensitive ? term : term.toLowerCase();
+    const searchStringLine = searchOptions.caseSensitive ? stringLine : stringLine.toLowerCase();
+
+    let resultIndex = -1;
+    if (searchOptions.regex) {
+      const searchRegex = RegExp(searchTerm, 'g');
+      let foundTerm: RegExpExecArray;
+      if (isReverseSearch) {
+        // This loop will get the resultIndex of the _last_ regex match in the range 0..col
+        while (foundTerm = searchRegex.exec(searchStringLine.slice(0, col))) {
+          resultIndex = searchRegex.lastIndex - foundTerm[0].length;
+          term = foundTerm[0];
+          searchRegex.lastIndex -= (term.length - 1);
+        }
+      } else {
+        foundTerm = searchRegex.exec(searchStringLine.slice(col));
+        if (foundTerm && foundTerm[0].length > 0) {
+          resultIndex = col + (searchRegex.lastIndex - foundTerm[0].length);
+          term = foundTerm[0];
+        }
+      }
+    } else {
+      if (isReverseSearch) {
+        if (col - searchTerm.length >= 0) {
+          resultIndex = searchStringLine.lastIndexOf(searchTerm, col - searchTerm.length);
+        }
+      } else {
+        resultIndex = searchStringLine.indexOf(searchTerm, col);
+      }
+    }
+
+    if (resultIndex >= 0) {
+      // Adjust the row number and search index if needed since a "line" of text can span multiple rows
+      if (resultIndex >= this._terminal.cols) {
+        row += Math.floor(resultIndex / this._terminal.cols);
+        resultIndex = resultIndex % this._terminal.cols;
+      }
+      if (searchOptions.wholeWord && !this._isWholeWord(resultIndex, searchStringLine, term)) {
+        return;
+      }
+
+      const line = this._terminal.buffer.getLine(row);
+
+      for (let i = 0; i < resultIndex; i++) {
+        const cell = line.getCell(i);
+        // Adjust the searchIndex to normalize emoji into single chars
+        const char = cell.char;
+        if (char.length > 1) {
+          resultIndex -= char.length - 1;
+        }
+        // Adjust the searchIndex for empty characters following wide unicode
+        // chars (eg. CJK)
+        const charWidth = cell.width;
+        if (charWidth === 0) {
+          resultIndex++;
+        }
+      }
       return {
         term,
-        col: searchIndex,
-        row: y
+        col: resultIndex,
+        row
       };
     }
   }
+  /**
+   * Translates a buffer line to a string, including subsequent lines if they are wraps.
+   * Wide characters will count as two columns in the resulting string. This
+   * function is useful for getting the actual text underneath the raw selection
+   * position.
+   * @param line The line being translated.
+   * @param trimRight Whether to trim whitespace to the right.
+   */
+  public translateBufferLineToStringWithWrap(lineIndex: number, trimRight: boolean): string {
+    let lineString = '';
+    let lineWrapsToNext: boolean;
+
+    do {
+      const nextLine = this._terminal.buffer.getLine(lineIndex + 1);
+      lineWrapsToNext = nextLine ? nextLine.isWrapped : false;
+      lineString += this._terminal.buffer.getLine(lineIndex).translateToString(!lineWrapsToNext && trimRight).substring(0, this._terminal.cols);
+      lineIndex++;
+    } while (lineWrapsToNext);
+
+    return lineString;
+  }
 
   /**
    * Selects and scrolls to a result.
@@ -131,10 +334,11 @@ export class SearchHelper {
    */
   private _selectResult(result: ISearchResult): boolean {
     if (!result) {
+      this._terminal.clearSelection();
       return false;
     }
-    this._terminal.selectionManager.setSelection(result.col, result.row, result.term.length);
-    this._terminal.scrollLines(result.row - this._terminal.buffer.ydisp, false);
+    this._terminal.select(result.col, result.row, result.term.length);
+    this._terminal.scrollLines(result.row - this._terminal.buffer.viewportY);
     return true;
   }
 }

src/addons/search/search.test.ts

@@ -0,0 +1,358 @@
+/**
+ * Copyright (c) 2018 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+declare var require: any;
+
+import { assert, expect } from 'chai';
+import * as search from './search';
+import { SearchHelper } from './SearchHelper';
+import { ISearchOptions, ISearchResult } from './Interfaces';
+
+class MockTerminalPlain {}
+
+class MockTerminal {
+  private _core: any;
+  public searchHelper: TestSearchHelper;
+  public cols: number;
+  constructor(options: any) {
+    this._core = new (require('../../../lib/Terminal')).Terminal(options);
+    this.searchHelper = new TestSearchHelper(this as any);
+    this.cols = options.cols;
+  }
+  get core(): any {
+    return this._core;
+  }
+  get buffer(): IBuffer {
+    // TODO: This is a hacky workaround until we use puppeteer for addon tests
+    const buffer = this._core.buffer;
+    return {
+      cursorY: buffer.y,
+      cursorX: buffer.x,
+      viewportY: buffer.ydisp,
+      baseY: buffer.ybase,
+      length: buffer.length,
+      getLine(y: number): IBufferLine {
+        return {
+          isWrapped: buffer.lines.get(y) ? buffer.lines.get(y).isWrapped : false,
+          getCell(x: number): IBufferCell {
+            return {
+              char: buffer.lines.get(y).get(x)[1/*CHAR_DATA_CHAR_INDEX*/],
+              width: buffer.lines.get(y).get(x)[2/*CHAR_DATA_WIDTH_INDEX*/]
+            };
+          },
+          translateToString(trimRight?: boolean, startColumn?: number, endColumn?: number): string {
+            return buffer.translateBufferLineToString(y, trimRight);
+          }
+        };
+      }
+    };
+  }
+  pushWriteData(): void {
+    this._core._innerWrite();
+  }
+}
+
+interface IBuffer {
+  readonly cursorY: number;
+  readonly cursorX: number;
+  readonly viewportY: number;
+  readonly baseY: number;
+  readonly length: number;
+  getLine(y: number): IBufferLine | undefined;
+}
+
+interface IBufferLine {
+  readonly isWrapped: boolean;
+  getCell(x: number): IBufferCell;
+  translateToString(trimRight?: boolean, startColumn?: number, endColumn?: number): string;
+}
+
+interface IBufferCell {
+  readonly char: string;
+  readonly width: number;
+}
+
+class TestSearchHelper extends SearchHelper {
+  public findInLine(term: string, rowNumber: number, searchOptions?: ISearchOptions): ISearchResult {
+    return this._findInLine(term, rowNumber, 0, searchOptions);
+  }
+  public findFromIndex(term: string, row: number, col: number, searchOptions?: ISearchOptions, isReverseSearch?: boolean): ISearchResult {
+    return this._findInLine(term, row, col, searchOptions, isReverseSearch);
+  }
+}
+
+describe('search addon', () => {
+  describe('apply', () => {
+    it('should register findNext and findPrevious', () => {
+      search.apply(<any>MockTerminalPlain);
+      assert.equal(typeof (<any>MockTerminalPlain).prototype.findNext, 'function');
+      assert.equal(typeof (<any>MockTerminalPlain).prototype.findPrevious, 'function');
+    });
+  });
+  describe('find', () => {
+    it('Searchhelper - should find correct position', () => {
+      search.apply(<any>MockTerminal);
+      const term = new MockTerminal({cols: 20, rows: 3});
+      term.core.write('Hello World\r\ntest\n123....hello');
+      term.pushWriteData();
+      const hello0 = term.searchHelper.findInLine('Hello', 0);
+      const hello1 = term.searchHelper.findInLine('Hello', 1);
+      const hello2 = term.searchHelper.findInLine('Hello', 2);
+      expect(hello0).eql({col: 0, row: 0, term: 'Hello'});
+      expect(hello1).eql(undefined);
+      expect(hello2).eql({col: 11, row: 2, term: 'Hello'});
+    });
+    it('should find search term accross line wrap', () => {
+      search.apply(<any>MockTerminal);
+      const term = new MockTerminal({cols: 10, rows: 5});
+      term.core.write('texttextHellotext\r\n');
+      term.core.write('texttexttextHellotext         goodbye');
+      term.pushWriteData();
+      /*
+        texttextHe
+        llotext
+        texttextte
+        xtHellotex
+        t         (these spaces included intentionally)
+        goodbye
+      */
+
+      const hello0 = term.searchHelper.findInLine('Hello', 0);
+      const hello1 = term.searchHelper.findInLine('Hello', 1);
+      const hello2 = term.searchHelper.findInLine('Hello', 2);
+      const hello3 = term.searchHelper.findInLine('Hello', 3);
+      const llo = term.searchHelper.findInLine('llo', 1);
+      const goodbye = term.searchHelper.findInLine('goodbye', 2);
+      expect(hello0).eql({col: 8, row: 0, term: 'Hello'});
+      expect(hello1).eql(undefined);
+      expect(hello2).eql({col: 2, row: 3, term: 'Hello'});
+      expect(hello3).eql(undefined);
+      expect(llo).eql(undefined);
+      expect(goodbye).eql({col: 0, row: 5, term: 'goodbye'});
+      term.core.resize(9, 5);
+      const hello0Resize = term.searchHelper.findInLine('Hello', 0);
+      expect(hello0Resize).eql({col: 8, row: 0, term: 'Hello'});
+    });
+    it('should respect search regex', () => {
+      search.apply(<any>MockTerminal);
+      const term = new MockTerminal({cols: 10, rows: 4});
+      term.core.write('abcdefghijklmnopqrstuvwxyz\r\n~/dev  ');
+      /*
+        abcdefghij
+        klmnopqrst
+        uvwxyz
+        ~/dev
+      */
+      term.pushWriteData();
+      const searchOptions = {
+        regex: true,
+        wholeWord: false,
+        caseSensitive: false
+      };
+      const hello0 = term.searchHelper.findInLine('dee*', 0, searchOptions);
+      const hello1 = term.searchHelper.findInLine('jkk*', 0, searchOptions);
+      const hello2 = term.searchHelper.findInLine('mnn*', 1, searchOptions);
+      const tilda0 = term.searchHelper.findInLine('^~', 3, searchOptions);
+      const tilda1 = term.searchHelper.findInLine('^[~]', 3, searchOptions);
+      const tilda2 = term.searchHelper.findInLine('^\\~', 3, searchOptions);
+      expect(hello0).eql({col: 3, row: 0, term: 'de'});
+      expect(hello1).eql({col: 9, row: 0, term: 'jk'});
+      expect(hello2).eql(undefined);
+      expect(tilda0).eql({col: 0, row: 3, term: '~'});
+      expect(tilda1).eql({col: 0, row: 3, term: '~'});
+      expect(tilda2).eql({col: 0, row: 3, term: '~'});
+    });
+    it('should not select empty lines', () => {
+      search.apply(<any>MockTerminal);
+      const term = new MockTerminal({cols: 20, rows: 3});
+      const line = term.searchHelper.findInLine('^.*$', 0, { regex: true });
+      expect(line).eql(undefined);
+    });
+    it('should respect case sensitive', function(): void {
+      search.apply(<any>MockTerminal);
+      const term = new MockTerminal({cols: 20, rows: 4});
+      term.core.write('Hello World\r\n123....hello\r\nmoreTestHello');
+      term.pushWriteData();
+      const searchOptions = {
+        regex: false,
+        wholeWord: false,
+        caseSensitive: true
+      };
+      const hello0 = term.searchHelper.findInLine('Hello', 0, searchOptions);
+      const hello1 = term.searchHelper.findInLine('Hello', 1, searchOptions);
+      const hello2 = term.searchHelper.findInLine('Hello', 2, searchOptions);
+      expect(hello0).eql({col: 0, row: 0, term: 'Hello'});
+      expect(hello1).eql(undefined);
+      expect(hello2).eql({col: 8, row: 2, term: 'Hello'});
+    });
+    it('should respect case sensitive + regex', function(): void {
+      search.apply(<any>MockTerminal);
+      const term = new MockTerminal({cols: 20, rows: 4});
+      term.core.write('hellohello\r\nHelloHello');
+      term.pushWriteData();
+
+      /**
+       * hellohello
+       * HelloHello
+       */
+
+      const searchOptions = {
+        regex: true,
+        wholeWord: false,
+        caseSensitive: true
+      };
+      const hello0 = term.searchHelper.findInLine('Hello', 0, searchOptions);
+      const hello1 = term.searchHelper.findInLine('Hello$', 0, searchOptions);
+      const hello2 = term.searchHelper.findInLine('Hello', 1, searchOptions);
+      const hello3 = term.searchHelper.findInLine('Hello$', 1, searchOptions);
+      expect(hello0).eql(undefined);
+      expect(hello1).eql(undefined);
+      expect(hello2).eql({col: 0, row: 1, term: 'Hello'});
+      expect(hello3).eql({col: 5, row: 1, term: 'Hello'});
+    });
+    it('should respect whole-word search option', function(): void {
+      search.apply(<any>MockTerminal);
+      const term = new MockTerminal({cols: 20, rows: 5});
+      term.core.write('Hello World\r\nWorld Hello\r\nWorldHelloWorld\r\nHelloWorld\r\nWorldHello');
+      term.pushWriteData();
+      const searchOptions = {
+        regex: false,
+        wholeWord: true,
+        caseSensitive: false
+      };
+      const hello0 = term.searchHelper.findInLine('Hello', 0, searchOptions);
+      const hello1 = term.searchHelper.findInLine('Hello', 1, searchOptions);
+      const hello2 = term.searchHelper.findInLine('Hello', 2, searchOptions);
+      const hello3 = term.searchHelper.findInLine('Hello', 3, searchOptions);
+      const hello4 = term.searchHelper.findInLine('Hello', 4, searchOptions);
+      expect(hello0).eql({col: 0, row: 0, term: 'Hello'});
+      expect(hello1).eql({col: 6, row: 1, term: 'Hello'});
+      expect(hello2).eql(undefined);
+      expect(hello3).eql(undefined);
+      expect(hello4).eql(undefined);
+    });
+    it('should respect whole-word + case sensitive search options', function(): void {
+      search.apply(<any>MockTerminal);
+      const term = new MockTerminal({cols: 20, rows: 5});
+      term.core.write('Hello World\r\nHelloWorld');
+      term.pushWriteData();
+      const searchOptions = {
+        regex: false,
+        wholeWord: true,
+        caseSensitive: true
+      };
+      const hello0 = term.searchHelper.findInLine('Hello', 0, searchOptions);
+      const hello1 = term.searchHelper.findInLine('hello', 0, searchOptions);
+      const hello2 = term.searchHelper.findInLine('Hello', 1, searchOptions);
+      const hello3 = term.searchHelper.findInLine('hello', 1, searchOptions);
+      expect(hello0).eql({col: 0, row: 0, term: 'Hello'});
+      expect(hello1).eql(undefined);
+      expect(hello2).eql(undefined);
+      expect(hello3).eql(undefined);
+    });
+    it('should respect whole-word + regex search options', function(): void {
+      search.apply(<any>MockTerminal);
+      const term = new MockTerminal({cols: 20, rows: 5});
+      term.core.write('Hello World Hello\r\nHelloWorldHello');
+      term.pushWriteData();
+      const searchOptions = {
+        regex: true,
+        wholeWord: true,
+        caseSensitive: false
+      };
+      const hello0 = term.searchHelper.findInLine('Hello', 0, searchOptions);
+      const hello1 = term.searchHelper.findInLine('Hello$', 0, searchOptions);
+      const hello2 = term.searchHelper.findInLine('Hello', 1, searchOptions);
+      const hello3 = term.searchHelper.findInLine('Hello$', 1, searchOptions);
+      expect(hello0).eql({col: 0, row: 0, term: 'hello'});
+      expect(hello1).eql({col: 12, row: 0, term: 'hello'});
+      expect(hello2).eql(undefined);
+      expect(hello3).eql(undefined);
+    });
+    it('should respect all search options', function(): void {
+      search.apply(<any>MockTerminal);
+      const term = new MockTerminal({cols: 20, rows: 5});
+      term.core.write('Hello World Hello\r\nHelloWorldHello');
+      term.pushWriteData();
+      const searchOptions = {
+        regex: true,
+        wholeWord: true,
+        caseSensitive: true
+      };
+      const hello0 = term.searchHelper.findInLine('Hello', 0, searchOptions);
+      const hello1 = term.searchHelper.findInLine('Hello$', 0, searchOptions);
+      const hello2 = term.searchHelper.findInLine('hello', 0, searchOptions);
+      const hello3 = term.searchHelper.findInLine('hello$', 0, searchOptions);
+      const hello4 = term.searchHelper.findInLine('hello', 1, searchOptions);
+      const hello5 = term.searchHelper.findInLine('hello$', 1, searchOptions);
+      expect(hello0).eql({col: 0, row: 0, term: 'Hello'});
+      expect(hello1).eql({col: 12, row: 0, term: 'Hello'});
+      expect(hello2).eql(undefined);
+      expect(hello3).eql(undefined);
+      expect(hello4).eql(undefined);
+      expect(hello5).eql(undefined);
+    });
+    it('should find multiple matches in line', function(): void {
+      search.apply(<any>MockTerminal);
+      const term = new MockTerminal({cols: 20, rows: 5});
+      term.core.write('helloooo helloooo\r\naaaAAaaAAA');
+      term.pushWriteData();
+      const searchOptions = {
+        regex: false,
+        wholeWord: false,
+        caseSensitive: false
+      };
+      const find0 = term.searchHelper.findFromIndex('hello', 0, 0, searchOptions);
+      const find1 = term.searchHelper.findFromIndex('hello', 0, find0.col + find0.term.length, searchOptions);
+      const find2 = term.searchHelper.findFromIndex('aaaa', 1, 0, searchOptions);
+      const find3 = term.searchHelper.findFromIndex('aaaa', 1, find2.col + find2.term.length, searchOptions);
+      const find4 = term.searchHelper.findFromIndex('aaaa', 1, find3.col + find3.term.length, searchOptions);
+      expect(find0).eql({col: 0, row: 0, term: 'hello'});
+      expect(find1).eql({col: 9, row: 0, term: 'hello'});
+      expect(find2).eql({col: 0, row: 1, term: 'aaaa'});
+      expect(find3).eql({col: 4, row: 1, term: 'aaaa'});
+      expect(find4).eql(undefined);
+    });
+    it('should find multiple matches in line - reverse search', function(): void {
+      search.apply(<any>MockTerminal);
+      const term = new MockTerminal({cols: 20, rows: 5});
+      term.core.write('it is what it is');
+      term.pushWriteData();
+      const searchOptions = {
+        regex: false,
+        wholeWord: false,
+        caseSensitive: false
+      };
+      const isReverseSearch = true;
+      const find0 = term.searchHelper.findFromIndex('is', 0, 16, searchOptions, isReverseSearch);
+      const find1 = term.searchHelper.findFromIndex('is', 0, find0.col, searchOptions, isReverseSearch);
+      const find2 = term.searchHelper.findFromIndex('it', 0, 16, searchOptions, isReverseSearch);
+      const find3 = term.searchHelper.findFromIndex('it', 0, find2.col, searchOptions, isReverseSearch);
+      expect(find0).eql({col: 14, row: 0, term: 'is'});
+      expect(find1).eql({col: 3, row: 0, term: 'is'});
+      expect(find2).eql({col: 11, row: 0, term: 'it'});
+      expect(find3).eql({col: 0, row: 0, term: 'it'});
+    });
+    it('should find multiple matches in line - reverse search with regex', function(): void {
+      search.apply(<any>MockTerminal);
+      const term = new MockTerminal({cols: 20, rows: 5});
+      term.core.write('zzzABCzzzzABCABC');
+      term.pushWriteData();
+      const searchOptions = {
+        regex: true,
+        wholeWord: false,
+        caseSensitive: true
+      };
+      const isReverseSearch = true;
+      const find0 = term.searchHelper.findFromIndex('[A-Z]{3}', 0, 16, searchOptions, isReverseSearch);
+      const find1 = term.searchHelper.findFromIndex('[A-Z]{3}', 0, find0.col, searchOptions, isReverseSearch);
+      const find2 = term.searchHelper.findFromIndex('[A-Z]{3}', 0, find1.col, searchOptions, isReverseSearch);
+      const find3 = term.searchHelper.findFromIndex('[A-Z]{3}', 0, find2.col, searchOptions, isReverseSearch);
+      expect(find0).eql({col: 13, row: 0, term: 'ABC'});
+      expect(find1).eql({col: 10, row: 0, term: 'ABC'});
+      expect(find2).eql({col: 3, row: 0, term: 'ABC'});
+      expect(find3).eql(undefined);
+    });
+  });
+});

src/addons/search/search.ts

@@ -4,40 +4,45 @@
  */
 
 import { SearchHelper } from './SearchHelper';
-
+import { Terminal } from 'xterm';
+import { ISearchAddonTerminal, ISearchOptions } from './Interfaces';
 
 /**
  * Find the next instance of the term, then scroll to and select it. If it
  * doesn't exist, do nothing.
- * @param term Tne search term.
+ * @param term The search term.
+ * @param searchOptions Search options
  * @return Whether a result was found.
  */
-export function findNext(terminal: any, term: string): boolean {
-  if (!terminal._searchHelper) {
-    terminal.searchHelper = new SearchHelper(terminal);
+export function findNext(terminal: Terminal, term: string, searchOptions: ISearchOptions = {}): boolean {
+  const addonTerminal = <ISearchAddonTerminal>terminal;
+  if (!addonTerminal.__searchHelper) {
+    addonTerminal.__searchHelper = new SearchHelper(addonTerminal);
   }
-  return (<SearchHelper>terminal.searchHelper).findNext(term);
-};
+  return addonTerminal.__searchHelper.findNext(term, searchOptions);
+}
 
 /**
  * Find the previous instance of the term, then scroll to and select it. If it
  * doesn't exist, do nothing.
- * @param term Tne search term.
+ * @param term The search term.
+ * @param searchOptions Search options
  * @return Whether a result was found.
  */
-export function findPrevious(terminal: any, term: string): boolean {
-  if (!terminal._searchHelper) {
-    terminal.searchHelper = new SearchHelper(terminal);
-  }
-  return (<SearchHelper>terminal.searchHelper).findPrevious(term);
-};
-
-export function apply(terminalConstructor) {
-  terminalConstructor.prototype.findNext = function(term) {
-    return findNext(this, term);
-  }
-
-  terminalConstructor.prototype.findPrevious = function(term) {
-    return findPrevious(this, term);
+export function findPrevious(terminal: Terminal, term: string, searchOptions: ISearchOptions): boolean {
+  const addonTerminal = <ISearchAddonTerminal>terminal;
+  if (!addonTerminal.__searchHelper) {
+    addonTerminal.__searchHelper = new SearchHelper(addonTerminal);
   }
+  return addonTerminal.__searchHelper.findPrevious(term, searchOptions);
+}
+
+export function apply(terminalConstructor: typeof Terminal): void {
+  (<any>terminalConstructor.prototype).findNext = function(term: string, searchOptions: ISearchOptions): boolean {
+    return findNext(this, term, searchOptions);
+  };
+
+  (<any>terminalConstructor.prototype).findPrevious = function(term: string, searchOptions: ISearchOptions): boolean {
+    return findPrevious(this, term, searchOptions);
+  };
 }

src/addons/search/tsconfig.json

@@ -2,9 +2,21 @@
   "compilerOptions": {
     "module": "commonjs",
     "target": "es5",
+    "lib": [
+      "dom",
+      "es5"
+    ],
     "rootDir": ".",
     "outDir": "../../../lib/addons/search/",
     "sourceMap": true,
-    "removeComments": true
-  }
+    "removeComments": true,
+    "declaration": true,
+    "types": [
+      "../../node_modules/@types/mocha"
+    ]
+  },
+  "include": [
+    "**/*.ts",
+    "../../../typings/xterm.d.ts"
+  ]
 }

src/addons/terminado/Interfaces.ts

@@ -0,0 +1,24 @@
+/**
+ * Copyright (c) 2018 The xterm.js authors. All rights reserved.
+ * @license MIT
+ *
+ * Implements the attach method, that attaches the terminal to a WebSocket stream.
+ */
+
+import { Terminal, IDisposable } from 'xterm';
+
+export interface ITerminadoAddonTerminal extends Terminal {
+  _core: {
+    register<T extends IDisposable>(d: T): void;
+  };
+
+  __socket?: WebSocket;
+  __attachSocketBuffer?: string;
+  __dataListener?: IDisposable;
+
+  __getMessage?(ev: MessageEvent): void;
+  __flushBuffer?(): void;
+  __pushToBuffer?(data: string): void;
+  __sendData?(data: string): void;
+  __setSize?(size: {rows: number, cols: number}): void;
+}

src/addons/terminado/terminado.test.ts

@@ -3,16 +3,16 @@
  * @license MIT
  */
 
-import { assert, expect } from 'chai';
+import { assert } from 'chai';
 
-import * as terminado from './terminado'
+import * as terminado from './terminado';
 
 class MockTerminal {}
 
 describe('terminado addon', () => {
   describe('apply', () => {
     it('should do register the `terminadoAttach` and `terminadoDetach` methods', () => {
-      terminado.apply(MockTerminal);
+      terminado.apply(<any>MockTerminal);
       assert.equal(typeof (<any>MockTerminal).prototype.terminadoAttach, 'function');
       assert.equal(typeof (<any>MockTerminal).prototype.terminadoDetach, 'function');
     });

src/addons/terminado/terminado.ts

@@ -6,106 +6,106 @@
  * WebSocket stream.
  */
 
+import { Terminal } from 'xterm';
+import { ITerminadoAddonTerminal } from './Interfaces';
+
 /**
  * Attaches the given terminal to the given socket.
  *
- * @param {Terminal} term - The terminal to be attached to the given socket.
- * @param {WebSocket} socket - The socket to attach the current terminal.
- * @param {boolean} bidirectional - Whether the terminal should send data
- *                                  to the socket as well.
- * @param {boolean} buffered - Whether the rendering of incoming data
- *                             should happen instantly or at a maximum
- *                             frequency of 1 rendering per 10ms.
+ * @param term The terminal to be attached to the given socket.
+ * @param socket The socket to attach the current terminal.
+ * @param bidirectional Whether the terminal should send data to the socket as well.
+ * @param buffered Whether the rendering of incoming data should happen instantly or at a maximum
+ * frequency of 1 rendering per 10ms.
  */
-export function terminadoAttach(term, socket, bidirectional, buffered) {
-  bidirectional = (typeof bidirectional == 'undefined') ? true : bidirectional;
-  term.socket = socket;
+export function terminadoAttach(term: Terminal, socket: WebSocket, bidirectional: boolean, buffered: boolean): void {
+  const addonTerminal = <ITerminadoAddonTerminal>term;
+  bidirectional = (typeof bidirectional === 'undefined') ? true : bidirectional;
+  addonTerminal.__socket = socket;
 
-  term._flushBuffer = function() {
-    term.write(term._attachSocketBuffer);
-    term._attachSocketBuffer = null;
+  addonTerminal.__flushBuffer = () => {
+    addonTerminal.write(addonTerminal.__attachSocketBuffer);
+    addonTerminal.__attachSocketBuffer = null;
   };
 
-  term._pushToBuffer = function(data) {
-    if (term._attachSocketBuffer) {
-      term._attachSocketBuffer += data;
+  addonTerminal.__pushToBuffer = (data: string) => {
+    if (addonTerminal.__attachSocketBuffer) {
+      addonTerminal.__attachSocketBuffer += data;
     } else {
-      term._attachSocketBuffer = data;
-      setTimeout(term._flushBuffer, 10);
+      addonTerminal.__attachSocketBuffer = data;
+      setTimeout(addonTerminal.__flushBuffer, 10);
     }
   };
 
-  term._getMessage = function(ev) {
-    var data = JSON.parse(ev.data)
-    if( data[0] == "stdout" ) {
+  addonTerminal.__getMessage = (ev: MessageEvent) => {
+    const data = JSON.parse(ev.data);
+    if (data[0] === 'stdout') {
       if (buffered) {
-        term._pushToBuffer(data[1]);
+        addonTerminal.__pushToBuffer(data[1]);
       } else {
-        term.write(data[1]);
+        addonTerminal.write(data[1]);
       }
     }
   };
 
-  term._sendData = function(data) {
+  addonTerminal.__sendData = (data: string) => {
     socket.send(JSON.stringify(['stdin', data]));
   };
 
-  term._setSize = function(size) {
+  addonTerminal.__setSize = (size: {rows: number, cols: number}) => {
     socket.send(JSON.stringify(['set_size', size.rows, size.cols]));
   };
 
-  socket.addEventListener('message', term._getMessage);
+  socket.addEventListener('message', addonTerminal.__getMessage);
 
   if (bidirectional) {
-    term.on('data', term._sendData);
+    addonTerminal._core.register(addonTerminal.onData(addonTerminal.__sendData));
   }
-  term.on('resize', term._setSize);
+  addonTerminal._core.register(addonTerminal.onResize(addonTerminal.__setSize));
 
-  socket.addEventListener('close', term.terminadoDetach.bind(term, socket));
-  socket.addEventListener('error', term.terminadoDetach.bind(term, socket));
-};
+  socket.addEventListener('close', () => terminadoDetach(addonTerminal, socket));
+  socket.addEventListener('error', () => terminadoDetach(addonTerminal, socket));
+}
 
 /**
  * Detaches the given terminal from the given socket
  *
- * @param {Xterm} term - The terminal to be detached from the given socket.
- * @param {WebSocket} socket - The socket from which to detach the current
- *                             terminal.
+ * @param term The terminal to be detached from the given socket.
+ * @param socket The socket from which to detach the current terminal.
  */
-export function terminadoDetach(term, socket) {
-  term.off('data', term._sendData);
+export function terminadoDetach(term: Terminal, socket: WebSocket): void {
+  const addonTerminal = <ITerminadoAddonTerminal>term;
+  addonTerminal.__dataListener.dispose();
+  addonTerminal.__dataListener = undefined;
 
-  socket = (typeof socket == 'undefined') ? term.socket : socket;
+  socket = (typeof socket === 'undefined') ? addonTerminal.__socket : socket;
 
   if (socket) {
-    socket.removeEventListener('message', term._getMessage);
+    socket.removeEventListener('message', addonTerminal.__getMessage);
   }
 
-  delete term.socket;
-};
+  delete addonTerminal.__socket;
+}
 
-export function apply(terminalConstructor) {
+export function apply(terminalConstructor: typeof Terminal): void {
   /**
    * Attaches the current terminal to the given socket
    *
-   * @param {WebSocket} socket - The socket to attach the current terminal.
-   * @param {boolean} bidirectional - Whether the terminal should send data
-   *                                  to the socket as well.
-   * @param {boolean} buffered - Whether the rendering of incoming data
-   *                             should happen instantly or at a maximum
-   *                             frequency of 1 rendering per 10ms.
+   * @param socket - The socket to attach the current terminal.
+   * @param bidirectional - Whether the terminal should send data to the socket as well.
+   * @param buffered - Whether the rendering of incoming data should happen instantly or at a
+   * maximum frequency of 1 rendering per 10ms.
    */
-  terminalConstructor.prototype.terminadoAttach = function(socket, bidirectional, buffered) {
+  (<any>terminalConstructor.prototype).terminadoAttach = function (socket: WebSocket, bidirectional: boolean, buffered: boolean): void {
     return terminadoAttach(this, socket, bidirectional, buffered);
   };
 
   /**
    * Detaches the current terminal from the given socket.
    *
-   * @param {WebSocket} socket - The socket from which to detach the current
-   *                             terminal.
+   * @param socket The socket from which to detach the current terminal.
    */
-  terminalConstructor.prototype.terminadoDetach = function(socket) {
+  (<any>terminalConstructor.prototype).terminadoDetach = function (socket: WebSocket): void {
     return terminadoDetach(this, socket);
   };
 }