Merge pull request #2179 from Tyriar/release/3.14_2174

Fix NPE in open

.vscode/launch.json

@@ -13,7 +13,25 @@
       "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" ],

README.md

@@ -187,6 +187,6 @@ You can read the [guide on the wiki](https://github.com/xtermjs/xterm.js/wiki/Co
 
 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) 2017-2018, [The xterm.js authors](https://github.com/xtermjs/xterm.js/graphs/contributors) (MIT License)<br>
+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

@@ -21,7 +21,7 @@ jobs:
     displayName: 'Install dependencies and build'
   - script: |
       yarn mocha
-    displayName: 'Test'
+    displayName: 'Unit tests'
   - script: |
       yarn lint
     displayName: 'Lint'
@@ -39,13 +39,13 @@ jobs:
     displayName: 'Install dependencies and build'
   - script: |
       yarn mocha
-    displayName: 'Test'
+    displayName: 'Unit tests'
   - script: |
       yarn lint
     displayName: 'Lint'
   - script: |
       yarn test-coverage
-      export COVERALLS_GIT_BRANCH=$BUILD_SOURCEBRANCH
+      export COVERALLS_GIT_BRANCH=$BUILD_SOURCEBRANCHNAME
       yarn coveralls
     displayName: 'Generate and publish coverage'
 
@@ -62,17 +62,39 @@ jobs:
     displayName: 'Install dependencies and build'
   - script: |
       yarn mocha
-    displayName: 'Test'
+    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
-  condition: and(succeeded(), eq(variables['Build.SourceBranch'], 'refs/heads/master'))
+  - 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:

bin/prepare-release

@@ -1,24 +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 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

@@ -39,10 +39,10 @@ function getNextBetaVersion() {
   }
   const tag = 'beta';
   const stableVersion = packageJson.version.split('.');
-  const nextStableVersion = `${stableVersion[0]}.${parseInt(stableVersion[1]) + 1}.${stableVersion[2]}`;
+  const nextStableVersion = `${stableVersion[0]}.${parseInt(stableVersion[1]) + 1}.0`;
   const publishedVersions = getPublishedVersions(nextStableVersion, tag);
   if (publishedVersions.length === 0) {
-    return `${packageJson.version}-${tag}1`;
+    return `${nextStableVersion}-${tag}1`;
   }
   const latestPublishedVersion = publishedVersions.sort((a, b) => {
     const aVersion = parseInt(a.substr(a.search(/[0-9]+$/)));
@@ -54,7 +54,7 @@ function getNextBetaVersion() {
 }
 
 function getPublishedVersions(version, tag) {
-  const versionsProcess = cp.spawnSync('npm', ['view', 'xterm', 'versions', '--json']);
+  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]+`)));

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/client.ts

@@ -8,12 +8,11 @@
 /// <reference path="../typings/xterm.d.ts"/>
 
 import { Terminal } from '../lib/public/Terminal';
-import * as attach from '../lib/addons/attach/attach';
+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';
-import * as fullscreen from '../lib/addons/fullscreen/fullscreen';
-import * as search from '../lib/addons/search/search';
-import * as webLinks from '../lib/addons/webLinks/webLinks';
-import { ISearchOptions } from '../lib/addons/search/Interfaces';
 
 // Pulling in the module's types relies on the <reference> above, it's looks a
 // little weird here as we're importing "this" module
@@ -21,17 +20,14 @@ import { Terminal as TerminalType, ITerminalOptions } from 'xterm';
 
 export interface IWindowWithTerminal extends Window {
   term: TerminalType;
+  Terminal?: typeof TerminalType;
 }
 declare let window: IWindowWithTerminal;
 
-Terminal.applyAddon(attach);
 Terminal.applyAddon(fit);
-Terminal.applyAddon(fullscreen);
-Terminal.applyAddon(search);
-Terminal.applyAddon(webLinks);
-
 
 let term;
+let searchAddon: SearchAddon;
 let protocol;
 let socketURL;
 let socket;
@@ -57,8 +53,6 @@ function getSearchOptions(): ISearchOptions {
   };
 }
 
-createTerminal();
-
 const disposeRecreateButtonHandler = () => {
   // If the terminal exists dispose of it, otherwise recreate it
   if (term) {
@@ -74,17 +68,30 @@ const disposeRecreateButtonHandler = () => {
   }
 };
 
-document.getElementById('dispose').addEventListener('click', disposeRecreateButtonHandler);
+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) {
@@ -100,8 +107,6 @@ function createTerminal(): void {
   socketURL = protocol + location.hostname + ((location.port) ? (':' + location.port) : '') + '/terminals/';
 
   term.open(terminalContainer);
-
-  term.webLinksInit();
   term.fit();
   term.focus();
 
@@ -110,12 +115,12 @@ function createTerminal(): void {
   addDomListener(actionElements.findNext, 'keyup', (e) => {
     const searchOptions = getSearchOptions();
     searchOptions.incremental = e.key !== `Enter`;
-    term.findNext(actionElements.findNext.value, searchOptions);
+    searchAddon.findNext(actionElements.findNext.value, searchOptions);
   });
 
   addDomListener(actionElements.findPrevious, 'keyup', (e) => {
     if (e.key === `Enter`) {
-      term.findPrevious(actionElements.findPrevious.value, getSearchOptions());
+      searchAddon.findPrevious(actionElements.findPrevious.value, getSearchOptions());
     }
   });
 
@@ -144,7 +149,14 @@ function createTerminal(): void {
 }
 
 function runRealTerminal(): void {
-  term.attach(socket);
+  /**
+   * 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;
 }
 
@@ -259,8 +271,11 @@ function initOptions(term: TerminalType): void {
       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, o === 'lineHeight' ? parseFloat(input.value) : parseInt(input.value, 10));
+        term.setOption(o, parseInt(input.value));
       }
     });
   });
@@ -281,8 +296,8 @@ function addDomListener(element: HTMLElement, type: string, handler: (...args: a
 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.renderer.dimensions.actualCellWidth + term._core.viewport.scrollBarWidth).toString() + 'px';
-  const height = (rows * term._core.renderer.dimensions.actualCellHeight).toString() + 'px';
+  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

@@ -2,8 +2,8 @@
 <html>
   <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="/src/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>
@@ -16,7 +16,7 @@
       <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>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>

demo/server.js

@@ -3,6 +3,13 @@ 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);
@@ -11,11 +18,16 @@ function startServer() {
       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');
   });
@@ -32,7 +44,8 @@ function startServer() {
           cols: cols || 80,
           rows: rows || 24,
           cwd: process.env.PWD,
-          env: process.env
+          env: process.env,
+          encoding: USE_BINARY_UTF8 ? null : 'utf8'
         });
 
     console.log('Created terminal with PID: ' + term.pid);
@@ -61,6 +74,7 @@ function startServer() {
     console.log('Connected to terminal ' + term.pid);
     ws.send(logs[term.pid]);
 
+    // string message buffering
     function buffer(socket, timeout) {
       let s = '';
       let sender = null;
@@ -75,7 +89,25 @@ function startServer() {
         }
       };
     }
-    const send = buffer(ws, 5);
+    // 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 {

demo/start.js

@@ -25,11 +25,13 @@ const clientConfig = {
       {
         test: /\.js$/,
         use: ["source-map-loader"],
-        enforce: "pre"
+        enforce: "pre",
+        exclude: /node_modules/
       }
     ]
   },
   resolve: {
+    modules: [path.resolve(__dirname, '..'), 'node_modules'],
     extensions: [ '.tsx', '.ts', '.js' ]
   },
   output: {

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>

fixtures/typings-test/typings-test.ts

@@ -21,7 +21,7 @@ namespace constructor {
       'disableStdin': false,
       'rows': 1,
       'scrollback': 10,
-      'tabStopWidth': 2,
+      'tabStopWidth': 2
     });
   }
 }
@@ -119,8 +119,8 @@ 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);
+    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);
@@ -155,6 +155,7 @@ namespace methods_core {
       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();
@@ -177,6 +178,7 @@ namespace methods_core {
       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);

gulpfile.js

@@ -39,6 +39,10 @@ gulp.task('css', function() {
   return gulp.src(`${srcDir}/**/*.css`).pipe(gulp.dest(outDir));
 });
 
+gulp.task('css-build', function() {
+  return gulp.src(`${srcDir}/**/*.css`).pipe(gulp.dest(buildDir));
+});
+
 gulp.task('watch-css', function() {
   return gulp.watch(`${srcDir}/**/*.css`, ['css']);
 });
@@ -136,6 +140,6 @@ gulp.task('sorcery-addons', ['browserify-addons'], function () {
   })
 });
 
-gulp.task('build', ['css', 'sorcery', 'sorcery-addons']);
+gulp.task('build', ['css', 'css-build', 'sorcery', 'sorcery-addons']);
 gulp.task('test', ['mocha']);
 gulp.task('default', ['build']);

package.json

@@ -1,7 +1,7 @@
 {
   "name": "xterm",
   "description": "Full xterm terminal, in your browser",
-  "version": "3.13.0",
+  "version": "3.14.2",
   "main": "lib/public/Terminal.js",
   "types": "typings/xterm.d.ts",
   "repository": "https://github.com/xtermjs/xterm.js",
@@ -12,6 +12,8 @@
     "@types/jsdom": "11.0.1",
     "@types/mocha": "^2.2.33",
     "@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",
@@ -32,16 +34,21 @@
     "node-pty": "0.7.6",
     "nodemon": "1.10.2",
     "nyc": "^11.8.0",
+    "puppeteer": "^1.15.0",
     "sorcery": "^0.10.0",
     "source-map-loader": "^0.2.4",
     "ts-loader": "^4.5.0",
     "tslint": "^5.9.1",
     "tslint-consistent-codestyle": "^1.13.0",
-    "typescript": "3.4",
+    "typescript": "3.5",
+    "utf8": "^3.0.0",
     "vinyl-buffer": "^1.0.0",
     "vinyl-source-stream": "^1.1.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": {
@@ -54,10 +61,12 @@
     "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",
+    "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

@@ -9,6 +9,8 @@ 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;
 
@@ -25,6 +27,7 @@ export class AccessibilityManager extends Disposable {
   private _liveRegionLineCount: number = 0;
 
   private _renderRowsDebouncer: RenderDebouncer;
+  private _screenDprMonitor: ScreenDprMonitor;
 
   private _topBoundaryFocusListener: (e: FocusEvent) => void;
   private _bottomBoundaryFocusListener: (e: FocusEvent) => void;
@@ -40,7 +43,12 @@ export class AccessibilityManager extends Disposable {
    */
   private _charsToConsume: string[] = [];
 
-  constructor(private _terminal: ITerminal) {
+  private _charsToAnnounce: string = '';
+
+  constructor(
+    private _terminal: ITerminal,
+    private _dimensions: IRenderDimensions
+  ) {
     super();
     this._accessibilityTreeRoot = document.createElement('div');
     this._accessibilityTreeRoot.classList.add('xterm-accessibility');
@@ -81,13 +89,12 @@ export class AccessibilityManager extends Disposable {
     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()));
-    // TODO: Maybe renderer should fire an event on terminal when the characters change and that
-    //       should be listened to instead? That would mean that the order of events are always
-    //       guarenteed
-    this.register(this._terminal.addDisposableListener('dprchange', () => this._refreshRowsDimensions()));
-    this.register(this._terminal.renderer.onCanvasResize(() => this._refreshRowsDimensions()));
+
+    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 dprchange event isn't supported
+    // media query that drives the ScreenDprMonitor isn't supported
     this.register(addDisposableDomListener(window, 'resize', () => this._refreshRowsDimensions()));
   }
 
@@ -197,10 +204,10 @@ export class AccessibilityManager extends Disposable {
         // Have the screen reader ignore the char if it was just input
         const shiftedChar = this._charsToConsume.shift();
         if (shiftedChar !== char) {
-          this._announceCharacter(char);
+          this._charsToAnnounce += char;
         }
       } else {
-        this._announceCharacter(char);
+        this._charsToAnnounce += char;
       }
 
       if (char === '\n') {
@@ -249,14 +256,17 @@ export class AccessibilityManager extends Disposable {
       const lineData = buffer.translateBufferLineToString(buffer.ydisp + i, true);
       const posInSet = (buffer.ydisp + i + 1).toString();
       const element = this._rowElements[i];
-      element.textContent = lineData.length === 0 ? Strings.blankLine : lineData;
-      element.setAttribute('aria-posinset', posInSet);
-      element.setAttribute('aria-setsize', setSize);
+      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._terminal.renderer.dimensions.actualCellHeight) {
+    if (!this._dimensions.actualCellHeight) {
       return;
     }
     if (this._rowElements.length !== this._terminal.rows) {
@@ -267,17 +277,20 @@ export class AccessibilityManager extends Disposable {
     }
   }
 
-  private _refreshRowDimensions(element: HTMLElement): void {
-    element.style.height = `${this._terminal.renderer.dimensions.actualCellHeight}px`;
+  public setDimensions(dimensions: IRenderDimensions): void {
+    this._dimensions = dimensions;
+    this._refreshRowsDimensions();
   }
 
-  private _announceCharacter(char: string): void {
-    if (char === ' ') {
-      // Always use nbsp for spaces in order to preserve the space between characters in
-      // voiceover's caption window
-      this._liveRegion.innerHTML += ' ';
-    } else {
-      this._liveRegion.textContent += char;
+  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.test.ts

@@ -5,10 +5,10 @@
 
 import { assert, expect } from 'chai';
 import { ITerminal } from './Types';
-import { Buffer, DEFAULT_ATTR_DATA } from './Buffer';
+import { Buffer } from './Buffer';
 import { CircularList } from './common/CircularList';
 import { MockTerminal, TestTerminal } from './TestUtils.test';
-import { BufferLine, CellData } from './BufferLine';
+import { BufferLine, CellData, DEFAULT_ATTR_DATA } from './core/buffer/BufferLine';
 
 const INIT_COLS = 80;
 const INIT_ROWS = 24;

src/Buffer.ts

@@ -4,42 +4,14 @@
  */
 
 import { CircularList, IInsertEvent } from './common/CircularList';
-import { ITerminal, IBuffer, IBufferLine, BufferIndex, IBufferStringIterator, IBufferStringIteratorResult, ICellData, IAttributeData } from './Types';
-import { IMarker } from 'xterm';
-import { BufferLine, CellData, AttributeData } from './BufferLine';
-import { reflowLargerApplyNewLayout, reflowLargerCreateNewLayout, reflowLargerGetLinesToRemove, reflowSmallerGetNewLineLengths, getWrappedLineTrimmedLength } from './BufferReflow';
-import { DEFAULT_COLOR } from './renderer/atlas/Types';
-import { EventEmitter2, IEvent } from './common/EventEmitter2';
-import { Disposable } from '../lib/common/Lifecycle';
+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 DEFAULT_ATTR = (0 << 18) | (DEFAULT_COLOR << 9) | (256 << 0);
-
-export const DEFAULT_ATTR_DATA = new AttributeData();
-
-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
 
-/**
- * Null cell - a real empty cell (containing nothing).
- * Note that code should always be 0 for a null cell as
- * several test condition of the buffer line rely on this.
- */
-export const NULL_CELL_CHAR = '';
-export const NULL_CELL_WIDTH = 1;
-export const NULL_CELL_CODE = 0;
-
-/**
- * Whitespace cell.
- * This is meant as a replacement for empty cells when needed
- * during rendering lines to preserve correct aligment.
- */
-export const WHITESPACE_CELL_CHAR = ' ';
-export const WHITESPACE_CELL_WIDTH = 1;
-export const WHITESPACE_CELL_CODE = 32;
-
 /**
  * This class represents a terminal buffer (an internal state of the terminal), where the
  * following information is stored (in high-level):
@@ -322,7 +294,7 @@ export class Buffer implements IBuffer {
     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.isWrapped && nextLine.getTrimmedLength() <= newCols) {
+      if (!nextLine || !nextLine.isWrapped && nextLine.getTrimmedLength() <= newCols) {
         continue;
       }
 
@@ -629,33 +601,6 @@ export class Buffer implements IBuffer {
   }
 }
 
-export class Marker extends Disposable implements IMarker {
-  private static _nextId = 1;
-
-  private _id: number = Marker._nextId++;
-  public isDisposed: boolean = false;
-
-  public get id(): number { return this._id; }
-
-  private _onDispose = new EventEmitter2<void>();
-  public get onDispose(): IEvent<void> { return this._onDispose.event; }
-
-  constructor(
-    public line: number
-  ) {
-    super();
-  }
-
-  public dispose(): void {
-    if (this.isDisposed) {
-      return;
-    }
-    this.isDisposed = true;
-    // Emit before super.dispose such that dispose listeners get a change to react
-    this._onDispose.fire();
-  }
-}
-
 /**
  * Iterator to get unwrapped content strings from the buffer.
  * The iterator returns at least the string data between the borders

src/BufferSet.ts

@@ -3,7 +3,8 @@
  * @license MIT
  */
 
-import { ITerminal, IBufferSet, IAttributeData, IBuffer } from './Types';
+import { ITerminal, IBufferSet, IBuffer } from './Types';
+import { IAttributeData } from './core/Types';
 import { Buffer } from './Buffer';
 import { EventEmitter2, IEvent } from './common/EventEmitter2';
 

src/CharWidth.test.ts

@@ -7,8 +7,7 @@ import { TestTerminal } from './TestUtils.test';
 import { assert } from 'chai';
 import { getStringCellWidth, wcwidth } from './CharWidth';
 import { IBuffer } from './Types';
-import { CHAR_DATA_WIDTH_INDEX, CHAR_DATA_CHAR_INDEX } from './Buffer';
-import { CellData } from './BufferLine';
+import { CellData, CHAR_DATA_WIDTH_INDEX, CHAR_DATA_CHAR_INDEX } from './core/buffer/BufferLine';
 
 
 describe('getStringCellWidth', function(): void {

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

@@ -6,10 +6,9 @@
 import { assert, expect } from 'chai';
 import { InputHandler } from './InputHandler';
 import { MockInputHandlingTerminal, TestTerminal } from './TestUtils.test';
-import { DEFAULT_ATTR_DATA } from './Buffer';
 import { Terminal } from './Terminal';
-import { IBufferLine } from './Types';
-import { CellData, Attributes, AttributeData } from './BufferLine';
+import { IBufferLine } from './core/Types';
+import { CellData, Attributes, AttributeData, DEFAULT_ATTR_DATA } from './core/buffer/BufferLine';
 
 describe('InputHandler', () => {
   describe('save and restore cursor', () => {
@@ -496,6 +495,46 @@ describe('InputHandler', () => {
       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`);

src/InputHandler.ts

@@ -7,14 +7,13 @@
 import { IInputHandler, IDcsHandler, IEscapeSequenceParser, IInputHandlingTerminal } from './Types';
 import { C0, C1 } from './common/data/EscapeSequences';
 import { CHARSETS, DEFAULT_CHARSET } from './core/data/Charsets';
-import { NULL_CELL_WIDTH, NULL_CELL_CODE, DEFAULT_ATTR_DATA } from './Buffer';
 import { wcwidth } from './CharWidth';
 import { EscapeSequenceParser } from './EscapeSequenceParser';
 import { IDisposable } from 'xterm';
 import { Disposable } from './common/Lifecycle';
 import { concat } from './common/TypedArrayUtils';
-import { StringToUtf32, stringFromCodePoint, utf32ToString } from './core/input/TextDecoder';
-import { CellData, Attributes, FgFlags, BgFlags, AttributeData } from './BufferLine';
+import { StringToUtf32, stringFromCodePoint, utf32ToString, Utf8ToUtf32 } from './core/input/TextDecoder';
+import { CellData, Attributes, FgFlags, BgFlags, AttributeData, NULL_CELL_WIDTH, NULL_CELL_CODE, DEFAULT_ATTR_DATA } from './core/buffer/BufferLine';
 import { EventEmitter2, IEvent } from './common/EventEmitter2';
 
 /**
@@ -105,6 +104,7 @@ class DECRQSS implements IDcsHandler {
 export class InputHandler extends Disposable implements IInputHandler {
   private _parseBuffer: Uint32Array = new Uint32Array(4096);
   private _stringDecoder: StringToUtf32 = new StringToUtf32();
+  private _utf8Decoder: Utf8ToUtf32 = new Utf8ToUtf32();
   private _workCell: CellData = new CellData();
 
   private _onCursorMove = new EventEmitter2<void>();
@@ -319,6 +319,32 @@ export class InputHandler extends Disposable implements IInputHandler {
     }
   }
 
+  public parseUtf8(data: Uint8Array): void {
+    // Ensure the terminal is not disposed
+    if (!this._terminal) {
+      return;
+    }
+
+    let buffer = this._terminal.buffer;
+    const cursorStartX = buffer.x;
+    const cursorStartY = buffer.y;
+
+    // TODO: Consolidate debug/logging #1560
+    if ((<any>this._terminal).debug) {
+      this._terminal.log('data: ' + data);
+    }
+
+    if (this._parseBuffer.length < data.length) {
+      this._parseBuffer = new Uint32Array(data.length);
+    }
+    this._parser.parse(this._parseBuffer, this._utf8Decoder.decode(data, this._parseBuffer));
+
+    buffer = this._terminal.buffer;
+    if (buffer.x !== cursorStartX || buffer.y !== cursorStartY) {
+      this._terminal.emit('cursormove');
+    }
+  }
+
   public print(data: Uint32Array, start: number, end: number): void {
     let code: number;
     let chWidth: number;
@@ -1667,7 +1693,7 @@ export class InputHandler extends Disposable implements IInputHandler {
         attr.bg &= ~(Attributes.CM_MASK | Attributes.RGB_MASK);
         attr.bg |= DEFAULT_ATTR_DATA.bg & (Attributes.PCOLOR_MASK | Attributes.RGB_MASK);
       } else if (p === 38) {
-        // fg color 256
+        // fg color 256 and RGB
         if (params[i + 1] === 2) {
           i += 2;
           attr.fg |= Attributes.CM_RGB;
@@ -1677,11 +1703,11 @@ export class InputHandler extends Disposable implements IInputHandler {
         } else if (params[i + 1] === 5) {
           i += 2;
           p = params[i] & 0xff;
-          attr.fg &= ~Attributes.PCOLOR_MASK;
+          attr.fg &= ~(Attributes.CM_MASK | Attributes.PCOLOR_MASK);
           attr.fg |= Attributes.CM_P256 | p;
         }
       } else if (p === 48) {
-        // bg color 256
+        // bg color 256 and RGB
         if (params[i + 1] === 2) {
           i += 2;
           attr.bg |= Attributes.CM_RGB;
@@ -1691,7 +1717,7 @@ export class InputHandler extends Disposable implements IInputHandler {
         } else if (params[i + 1] === 5) {
           i += 2;
           p = params[i] & 0xff;
-          attr.bg &= ~Attributes.PCOLOR_MASK;
+          attr.bg &= ~(Attributes.CM_MASK | Attributes.PCOLOR_MASK);
           attr.bg |= Attributes.CM_P256 | p;
         }
       } else if (p === 100) {

src/Linkifier.test.ts

@@ -4,11 +4,12 @@
  */
 
 import { assert } from 'chai';
-import { IMouseZoneManager, IMouseZone, ILinkMatcher, ITerminal, IBufferLine } from './Types';
+import { IMouseZoneManager, IMouseZone, ILinkMatcher, ITerminal } from './Types';
+import { IBufferLine } from './core/Types';
 import { Linkifier } from './Linkifier';
 import { MockBuffer, MockTerminal, TestTerminal } from './TestUtils.test';
 import { CircularList } from './common/CircularList';
-import { BufferLine, CellData } from './BufferLine';
+import { BufferLine, CellData } from './core/buffer/BufferLine';
 
 class TestLinkifier extends Linkifier {
   constructor(terminal: ITerminal) {

src/MouseHelper.test.ts

@@ -31,7 +31,7 @@ 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', () => {

src/MouseHelper.ts

@@ -4,13 +4,12 @@
  */
 
 import { ICharMeasure, IMouseHelper } from './Types';
-import { IRenderer } from './renderer/Types';
+import { RenderCoordinator } from './renderer/RenderCoordinator';
 
 export class MouseHelper implements IMouseHelper {
-  constructor(private _renderer: IRenderer) {}
-
-  public setRenderer(renderer: IRenderer): void {
-    this._renderer = renderer;
+  constructor(
+    private _renderCoordinator: RenderCoordinator
+  ) {
   }
 
   public static getCoordsRelativeToElement(event: {clientX: number, clientY: number}, element: HTMLElement): [number, number] {
@@ -42,8 +41,8 @@ export class MouseHelper implements IMouseHelper {
       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

src/SelectionManager.test.ts

@@ -8,9 +8,10 @@ import { CharMeasure } from './CharMeasure';
 import { SelectionManager, SelectionMode } from './SelectionManager';
 import { SelectionModel } from './SelectionModel';
 import { BufferSet } from './BufferSet';
-import { ITerminal, IBuffer, IBufferLine } from './Types';
+import { ITerminal, IBuffer } from './Types';
+import { IBufferLine } from './core/Types';
 import { MockTerminal } from './TestUtils.test';
-import { BufferLine, CellData } from './BufferLine';
+import { BufferLine, CellData } from './core/buffer/BufferLine';
 
 class TestMockTerminal extends MockTerminal {
   emit(event: string, data: any): void {}

src/SelectionManager.ts

@@ -3,13 +3,14 @@
  * @license MIT
  */
 
-import { ITerminal, ISelectionManager, IBuffer, IBufferLine, ISelectionRedrawRequestEvent } from './Types';
+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 { AltClickHandler } from './handlers/AltClickHandler';
-import { CellData } from './BufferLine';
+import { CellData } from './core/buffer/BufferLine';
 import { IDisposable } from 'xterm';
 import { EventEmitter2, IEvent } from './common/EventEmitter2';
 
@@ -245,6 +246,7 @@ export class SelectionManager implements ISelectionManager {
     this._model.clearSelection();
     this._removeMouseDownListeners();
     this.refresh();
+    this._onSelectionChange.fire();
   }
 
   /**

src/Terminal.integration.ts

@@ -13,9 +13,8 @@ import * as path from 'path';
 import * as pty from 'node-pty';
 import { assert } from 'chai';
 import { Terminal } from './Terminal';
-import { WHITESPACE_CELL_CHAR } from './Buffer';
 import { IViewport } from './Types';
-import { CellData } from './BufferLine';
+import { CellData, WHITESPACE_CELL_CHAR } from './core/buffer/BufferLine';
 
 class TestTerminal extends Terminal {
   innerWrite(): void { this._innerWrite(); }
@@ -92,7 +91,8 @@ if (os.platform() !== 'win32') {
   primitivePty = (<any>pty).native.open(cols, rows);
 
   /** tests */
-  describe('xterm output comparison', () => {
+  describe('xterm output comparison', function(): void {
+    this.timeout(10000);
     let xterm: TestTerminal;
 
     beforeEach(() => {
@@ -114,8 +114,8 @@ if (os.platform() !== 'win32') {
       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++) {
@@ -123,9 +123,9 @@ if (os.platform() !== 'win32') {
         continue;
       }
       ((filename: string) => {
+        const inFile = fs.readFileSync(filename, 'utf8');
         it(filename.split('/').slice(-1)[0], done => {
           ptyReset(() => {
-            const inFile = fs.readFileSync(filename, 'utf8');
             ptyWriteRead(inFile, fromPty => {
               // uncomment this to get log from terminal
               // console.log = function(){};

src/Terminal.test.ts

@@ -6,8 +6,7 @@
 import { assert, expect } from 'chai';
 import { Terminal } from './Terminal';
 import { MockViewport, MockCompositionHelper, MockRenderer } from './TestUtils.test';
-import { DEFAULT_ATTR_DATA } from './Buffer';
-import { CellData } from './BufferLine';
+import { CellData, DEFAULT_ATTR_DATA } from './core/buffer/BufferLine';
 
 const INIT_COLS = 80;
 const INIT_ROWS = 24;
@@ -17,7 +16,7 @@ class TestTerminal extends Terminal {
   public keyPress(ev: any): boolean { return this._keyPress(ev); }
 }
 
-describe('xterm.js', () => {
+describe('Terminal', () => {
   let term: TestTerminal;
   const termOptions = {
     cols: INIT_COLS,

src/Terminal.ts

@@ -21,10 +21,10 @@
  *   http://linux.die.net/man/7/urxvt
  */
 
-import { IInputHandlingTerminal, IViewport, ICompositionHelper, ITerminalOptions, ITerminal, IBrowser, ILinkifier, ILinkMatcherOptions, CustomKeyEventHandler, LinkMatcherHandler, CharacterJoinerHandler, IBufferLine, IAttributeData, IMouseZoneManager } from './Types';
+import { IInputHandlingTerminal, IViewport, ICompositionHelper, ITerminalOptions, ITerminal, IBrowser, ILinkifier, ILinkMatcherOptions, CustomKeyEventHandler, LinkMatcherHandler, CharacterJoinerHandler, IMouseZoneManager } from './Types';
 import { IRenderer } from './renderer/Types';
 import { BufferSet } from './BufferSet';
-import { Buffer, MAX_BUFFER_SIZE, DEFAULT_ATTR_DATA } from './Buffer';
+import { Buffer, MAX_BUFFER_SIZE } from './Buffer';
 import { CompositionHelper } from './CompositionHelper';
 import { EventEmitter } from './common/EventEmitter';
 import { Viewport } from './Viewport';
@@ -42,17 +42,18 @@ import { MouseHelper } from './MouseHelper';
 import { DEFAULT_BELL_SOUND, SoundManager } from './SoundManager';
 import { MouseZoneManager } from './MouseZoneManager';
 import { AccessibilityManager } from './AccessibilityManager';
-import { ScreenDprMonitor } from './ui/ScreenDprMonitor';
-import { ITheme, IMarker, IDisposable } from 'xterm';
+import { ITheme, IMarker, IDisposable, ISelectionPosition } from 'xterm';
 import { removeTerminalFromCache } from './renderer/atlas/CharAtlasCache';
 import { DomRenderer } from './renderer/dom/DomRenderer';
 import { IKeyboardEvent } from './common/Types';
 import { evaluateKeyboardEvent } from './core/input/Keyboard';
-import { KeyboardResultType, ICharset } from './core/Types';
+import { KeyboardResultType, ICharset, IBufferLine, IAttributeData } from './core/Types';
 import { clone } from './common/Clone';
 import { EventEmitter2, IEvent } from './common/EventEmitter2';
-import { Attributes } from './BufferLine';
+import { Attributes, DEFAULT_ATTR_DATA } from './core/buffer/BufferLine';
 import { applyWindowsMode } from './WindowsMode';
+import { ColorManager } from './ui/ColorManager';
+import { RenderCoordinator } from './renderer/RenderCoordinator';
 
 // Let it work inside Node.js for automated testing purposes.
 const document = (typeof window !== 'undefined') ? window.document : null;
@@ -71,6 +72,7 @@ const WRITE_BUFFER_PAUSE_THRESHOLD = 5;
  * depends on the time it takes for the renderer to draw the frame.
  */
 const WRITE_TIMEOUT_MS = 12;
+const WRITE_BUFFER_LENGTH_THRESHOLD = 50;
 
 const MINIMUM_COLS = 2; // Less than 2 can mess with wide chars
 const MINIMUM_ROWS = 1;
@@ -109,7 +111,7 @@ const DEFAULT_OPTIONS: ITerminalOptions = {
   useFlowControl: false,
   allowTransparency: false,
   tabStopWidth: 8,
-  theme: null,
+  theme: undefined,
   rightClickSelectsWord: Browser.isMac,
   rendererType: 'canvas',
   windowsMode: false
@@ -183,6 +185,7 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
 
   // user input states
   public writeBuffer: string[];
+  public writeBufferUtf8: Uint8Array[];
   private _writeInProgress: boolean;
 
   /**
@@ -201,7 +204,7 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
 
   private _inputHandler: InputHandler;
   public soundManager: SoundManager;
-  public renderer: IRenderer;
+  private _renderCoordinator: RenderCoordinator;
   public selectionManager: SelectionManager;
   public linkifier: ILinkifier;
   public buffers: BufferSet;
@@ -211,7 +214,7 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
   private _mouseZoneManager: IMouseZoneManager;
   public mouseHelper: MouseHelper;
   private _accessibilityManager: AccessibilityManager;
-  private _screenDprMonitor: ScreenDprMonitor;
+  private _colorManager: ColorManager;
   private _theme: ITheme;
   private _windowsMode: IDisposable | undefined;
 
@@ -340,6 +343,7 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
 
     // user input states
     this.writeBuffer = [];
+    this.writeBufferUtf8 = [];
     this._writeInProgress = false;
 
     this._xoffSentToCatchUp = false;
@@ -350,10 +354,9 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
     this._inputHandler = new InputHandler(this);
     this._inputHandler.onCursorMove(() => this._onCursorMove.fire());
     this._inputHandler.onLineFeed(() => this._onLineFeed.fire());
+    this._inputHandler.onData(e => this._onData.fire(e));
     this.register(this._inputHandler);
 
-    // Reuse renderer if the Terminal is being recreated via a reset call.
-    this.renderer = this.renderer || null;
     this.selectionManager = this.selectionManager || null;
     this.linkifier = this.linkifier || new Linkifier(this);
     this._mouseZoneManager = this._mouseZoneManager || null;
@@ -465,12 +468,7 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
         }
         break;
       case 'theme':
-        // If open has been called we do not want to set options.theme as the
-        // source of truth is owned by the renderer.
-        if (this.renderer) {
-          this._setTheme(<ITheme>value);
-          return;
-        }
+        this._setTheme(<ITheme>value);
         break;
       case 'scrollback':
         value = Math.min(value, MAX_BUFFER_SIZE);
@@ -499,8 +497,8 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
       case 'fontFamily':
       case 'fontSize':
         // When the font changes the size of the cells may change which requires a renderer clear
-        if (this.renderer) {
-          this.renderer.clear();
+        if (this._renderCoordinator) {
+          this._renderCoordinator.clear();
           this.charMeasure.measure(this.options);
         }
         break;
@@ -512,24 +510,16 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
       case 'fontWeight':
       case 'fontWeightBold':
         // When the font changes the size of the cells may change which requires a renderer clear
-        if (this.renderer) {
-          this.renderer.clear();
-          this.renderer.onResize(this.cols, this.rows);
+        if (this._renderCoordinator) {
+          this._renderCoordinator.clear();
+          this._renderCoordinator.onResize(this.cols, this.rows);
           this.refresh(0, this.rows - 1);
         }
         break;
       case 'rendererType':
-        if (this.renderer) {
-          this.unregister(this.renderer);
-          this.renderer.dispose();
-          this.renderer = null;
+        if (this._renderCoordinator) {
+          this._renderCoordinator.setRenderer(this._createRenderer());
         }
-        this._setupRenderer();
-        this.renderer.onCharSizeChanged();
-        if (this._theme) {
-          this.renderer.setTheme(this._theme);
-        }
-        this.mouseHelper.setRenderer(this.renderer);
         break;
       case 'scrollback':
         this.buffers.resize(this.cols, this.rows);
@@ -539,8 +529,8 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
         break;
       case 'screenReaderMode':
         if (value) {
-          if (!this._accessibilityManager) {
-            this._accessibilityManager = new AccessibilityManager(this);
+          if (!this._accessibilityManager && this._renderCoordinator) {
+            this._accessibilityManager = new AccessibilityManager(this, this._renderCoordinator.dimensions);
           }
         } else {
           if (this._accessibilityManager) {
@@ -564,8 +554,8 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
         break;
     }
     // Inform renderer of changes
-    if (this.renderer) {
-      this.renderer.onOptionsChanged();
+    if (this._renderCoordinator) {
+      this._renderCoordinator.onOptionsChanged();
     }
   }
 
@@ -704,10 +694,6 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
     this._context = this._parent.ownerDocument.defaultView;
     this._document = this._parent.ownerDocument;
 
-    this._screenDprMonitor = new ScreenDprMonitor();
-    this._screenDprMonitor.setListener(() => this.emit('dprchange', window.devicePixelRatio));
-    this.register(this._screenDprMonitor);
-
     // Create main element container
     this.element = this._document.createElement('div');
     this.element.dir = 'ltr';   // xterm.css assumes LTR
@@ -763,28 +749,30 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
     // Performance: Add viewport and helper elements from the fragment
     this.element.appendChild(fragment);
 
-    this._setupRenderer();
     this._theme = this.options.theme;
-    this.options.theme = null;
-    this.viewport = new Viewport(this, this._viewportElement, this._viewportScrollArea, this.charMeasure);
-    this.viewport.onThemeChanged(this.renderer.colorManager.colors);
+    this._colorManager = new ColorManager(document, this.options.allowTransparency);
+    this._colorManager.setTheme(this._theme);
+
+    const renderer = this._createRenderer();
+    this._renderCoordinator = new RenderCoordinator(renderer, this.rows, this.screenElement);
+    this._renderCoordinator.onRender(e => this._onRender.fire(e));
+    this.onResize(e => this._renderCoordinator.resize(e.cols, e.rows));
+
+    this.viewport = new Viewport(this, this._viewportElement, this._viewportScrollArea, this.charMeasure, this._renderCoordinator.dimensions);
+    this.viewport.onThemeChange(this._colorManager.colors);
     this.register(this.viewport);
 
-    this.register(this.onCursorMove(() => this.renderer.onCursorMove()));
-    this.register(this.onResize(() => this.renderer.onResize(this.cols, this.rows)));
-    this.register(this.addDisposableListener('blur', () => this.renderer.onBlur()));
-    this.register(this.addDisposableListener('focus', () => this.renderer.onFocus()));
-    this.register(this.addDisposableListener('dprchange', () => this.renderer.onWindowResize(window.devicePixelRatio)));
-    // dprchange should handle this case, we need this as well for browsers that don't support the
-    // matchMedia query.
-    this.register(addDisposableDomListener(window, 'resize', () => this.renderer.onWindowResize(window.devicePixelRatio)));
-    this.register(this.charMeasure.onCharSizeChanged(() => this.renderer.onCharSizeChanged()));
-    this.register(this.renderer.onCanvasResize(() => this.viewport.syncScrollArea()));
+    this.register(this.onCursorMove(() => this._renderCoordinator.onCursorMove()));
+    this.register(this.onResize(() => this._renderCoordinator.onResize(this.cols, this.rows)));
+    this.register(this.addDisposableListener('blur', () => this._renderCoordinator.onBlur()));
+    this.register(this.addDisposableListener('focus', () => this._renderCoordinator.onFocus()));
+    this.register(this.charMeasure.onCharSizeChanged(() => this._renderCoordinator.onCharSizeChanged()));
+    this.register(this._renderCoordinator.onDimensionsChange(() => this.viewport.syncScrollArea()));
 
     this.selectionManager = new SelectionManager(this, this.charMeasure);
     this.register(this.selectionManager.onSelectionChange(() => this._onSelectionChange.fire()));
     this.register(addDisposableDomListener(this.element, 'mousedown', (e: MouseEvent) => this.selectionManager.onMouseDown(e)));
-    this.register(this.selectionManager.onRedrawRequest(e => this.renderer.onSelectionChanged(e.start, e.end, e.columnSelectMode)));
+    this.register(this.selectionManager.onRedrawRequest(e => this._renderCoordinator.onSelectionChanged(e.start, e.end, e.columnSelectMode)));
     this.register(this.selectionManager.onLinuxMouseSelection(text => {
       // If there's a new selection, put it into the textarea, focus and select it
       // in order to register it as a selection on the OS. This event is fired
@@ -799,7 +787,7 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
     }));
     this.register(addDisposableDomListener(this._viewportElement, 'scroll', () => this.selectionManager.refresh()));
 
-    this.mouseHelper = new MouseHelper(this.renderer);
+    this.mouseHelper = new MouseHelper(this._renderCoordinator);
     // apply mouse event classes set by escape codes before terminal was attached
     this.element.classList.toggle('enable-mouse-events', this.mouseEvents);
     if (this.mouseEvents) {
@@ -811,7 +799,8 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
     if (this.options.screenReaderMode) {
       // Note that this must be done *after* the renderer is created in order to
       // ensure the correct order of the dprchange event
-      this._accessibilityManager = new AccessibilityManager(this);
+      this._accessibilityManager = new AccessibilityManager(this, this._renderCoordinator.dimensions);
+      this._accessibilityManager.register(this._renderCoordinator.onDimensionsChange(e => this._accessibilityManager.setDimensions(e)));
     }
 
     // Measure the character size
@@ -829,14 +818,12 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
 
   }
 
-  private _setupRenderer(): void {
+  private _createRenderer(): IRenderer {
     switch (this.options.rendererType) {
-      case 'canvas': this.renderer = new Renderer(this, this.options.theme); break;
-      case 'dom': this.renderer = new DomRenderer(this, this.options.theme); break;
+      case 'canvas': return new Renderer(this, this._colorManager.colors); break;
+      case 'dom': return new DomRenderer(this, this._colorManager.colors); break;
       default: throw new Error(`Unrecognized rendererType "${this.options.rendererType}"`);
     }
-    this.renderer.onRender(e => this._onRender.fire(e));
-    this.register(this.renderer);
   }
 
   /**
@@ -845,9 +832,12 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
    */
   private _setTheme(theme: ITheme): void {
     this._theme = theme;
-    const colors = this.renderer.setTheme(theme);
+    this._colorManager.setTheme(theme);
+    if (this._renderCoordinator) {
+      this._renderCoordinator.setColors(this._colorManager.colors);
+    }
     if (this.viewport) {
-      this.viewport.onThemeChanged(colors);
+      this.viewport.onThemeChange(this._colorManager.colors);
     }
   }
 
@@ -1200,8 +1190,8 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
    * @param end The row to end at (between start and this.rows - 1).
    */
   public refresh(start: number, end: number): void {
-    if (this.renderer) {
-      this.renderer.refreshRows(start, end);
+    if (this._renderCoordinator) {
+      this._renderCoordinator.refreshRows(start, end);
     }
   }
 
@@ -1365,6 +1355,93 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
     }
   }
 
+  /**
+   * Writes raw utf8 bytes to the terminal.
+   * @param data UintArray with UTF8 bytes to write to the terminal.
+   */
+  public writeUtf8(data: Uint8Array): void {
+    // Ensure the terminal isn't disposed
+    if (this._isDisposed) {
+      return;
+    }
+
+    // Ignore falsy data values
+    if (!data) {
+      return;
+    }
+
+    this.writeBufferUtf8.push(data);
+
+    // Send XOFF to pause the pty process if the write buffer becomes too large so
+    // xterm.js can catch up before more data is sent. This is necessary in order
+    // to keep signals such as ^C responsive.
+    if (this.options.useFlowControl && !this._xoffSentToCatchUp && this.writeBufferUtf8.length >= WRITE_BUFFER_PAUSE_THRESHOLD) {
+      // XOFF - stop pty pipe
+      // XON will be triggered by emulator before processing data chunk
+      this.handler(C0.DC3);
+      this._xoffSentToCatchUp = true;
+    }
+
+    if (!this._writeInProgress && this.writeBufferUtf8.length > 0) {
+      // Kick off a write which will write all data in sequence recursively
+      this._writeInProgress = true;
+      // Kick off an async innerWrite so more writes can come in while processing data
+      setTimeout(() => {
+        this._innerWriteUtf8();
+      });
+    }
+  }
+
+  protected _innerWriteUtf8(bufferOffset: number = 0): void {
+    // Ensure the terminal isn't disposed
+    if (this._isDisposed) {
+      this.writeBufferUtf8 = [];
+    }
+
+    const startTime = Date.now();
+    while (this.writeBufferUtf8.length > bufferOffset) {
+      const data = this.writeBufferUtf8[bufferOffset];
+      bufferOffset++;
+
+      // If XOFF was sent in order to catch up with the pty process, resume it if
+      // we reached the end of the writeBuffer to allow more data to come in.
+      if (this._xoffSentToCatchUp && this.writeBufferUtf8.length === bufferOffset) {
+        this.handler(C0.DC1);
+        this._xoffSentToCatchUp = false;
+      }
+
+      this._refreshStart = this.buffer.y;
+      this._refreshEnd = this.buffer.y;
+
+      // HACK: Set the parser state based on it's state at the time of return.
+      // This works around the bug #662 which saw the parser state reset in the
+      // middle of parsing escape sequence in two chunks. For some reason the
+      // state of the parser resets to 0 after exiting parser.parse. This change
+      // just sets the state back based on the correct return statement.
+
+      this._inputHandler.parseUtf8(data);
+
+      this.updateRange(this.buffer.y);
+      this.refresh(this._refreshStart, this._refreshEnd);
+
+      if (Date.now() - startTime >= WRITE_TIMEOUT_MS) {
+        break;
+      }
+    }
+    if (this.writeBufferUtf8.length > bufferOffset) {
+      // Allow renderer to catch up before processing the next batch
+      // trim already processed chunks if we are above threshold
+      if (bufferOffset > WRITE_BUFFER_LENGTH_THRESHOLD) {
+        this.writeBufferUtf8 = this.writeBufferUtf8.slice(bufferOffset);
+        bufferOffset = 0;
+      }
+      setTimeout(() => this._innerWriteUtf8(bufferOffset), 0);
+    } else {
+      this._writeInProgress = false;
+      this.writeBufferUtf8 = [];
+    }
+  }
+
   /**
    * Writes text to the terminal.
    * @param data The text to write to the terminal.
@@ -1440,6 +1517,11 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
     }
     if (this.writeBuffer.length > bufferOffset) {
       // Allow renderer to catch up before processing the next batch
+      // trim already processed chunks if we are above threshold
+      if (bufferOffset > WRITE_BUFFER_LENGTH_THRESHOLD) {
+        this.writeBuffer = this.writeBuffer.slice(bufferOffset);
+        bufferOffset = 0;
+      }
       setTimeout(() => this._innerWrite(bufferOffset), 0);
     } else {
       this._writeInProgress = false;
@@ -1504,13 +1586,13 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
   }
 
   public registerCharacterJoiner(handler: CharacterJoinerHandler): number {
-    const joinerId = this.renderer.registerCharacterJoiner(handler);
+    const joinerId = this._renderCoordinator.registerCharacterJoiner(handler);
     this.refresh(0, this.rows - 1);
     return joinerId;
   }
 
   public deregisterCharacterJoiner(joinerId: number): void {
-    if (this.renderer.deregisterCharacterJoiner(joinerId)) {
+    if (this._renderCoordinator.deregisterCharacterJoiner(joinerId)) {
       this.refresh(0, this.rows - 1);
     }
   }
@@ -1535,6 +1617,16 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
     return this.selectionManager ? this.selectionManager.hasSelection : false;
   }
 
+  /**
+   * Selects text within the terminal.
+   * @param column The column the selection starts at..
+   * @param row The row the selection starts at.
+   * @param length The length of the selection.
+   */
+  public select(column: number, row: number, length: number): void {
+    this.selectionManager.setSelection(column, row, length);
+  }
+
   /**
    * Gets the terminal's current selection, this is useful for implementing copy
    * behavior outside of xterm.js.
@@ -1543,6 +1635,19 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
     return this.selectionManager ? this.selectionManager.selectionText : '';
   }
 
+  public getSelectionPosition(): ISelectionPosition | undefined {
+    if (!this.selectionManager.hasSelection) {
+      return undefined;
+    }
+
+    return {
+      startColumn: this.selectionManager.selectionStart[0],
+      startRow: this.selectionManager.selectionStart[1],
+      endColumn: this.selectionManager.selectionEnd[0],
+      endRow: this.selectionManager.selectionEnd[1]
+    };
+  }
+
   /**
    * Clears the current terminal selection.
    */
@@ -1902,15 +2007,34 @@ export class Terminal extends EventEmitter implements ITerminal, IDisposable, II
    * ESC c Full Reset (RIS).
    */
   public reset(): void {
+    /**
+     * Since _setup handles a full terminal creation, we have to carry forward
+     * a few things that should not reset.
+     */
     this.options.rows = this.rows;
     this.options.cols = this.cols;
     const customKeyEventHandler = this._customKeyEventHandler;
     const inputHandler = this._inputHandler;
     const cursorState = this.cursorState;
+    const writeBuffer = this.writeBuffer;
+    const writeBufferUtf8 = this.writeBufferUtf8;
+    const writeInProgress = this._writeInProgress;
+    const xoffSentToCatchUp = this._xoffSentToCatchUp;
+    const userScrolling = this._userScrolling;
+
     this._setup();
+
+    // reattach
     this._customKeyEventHandler = customKeyEventHandler;
     this._inputHandler = inputHandler;
     this.cursorState = cursorState;
+    this.writeBuffer = writeBuffer;
+    this.writeBufferUtf8 = writeBufferUtf8;
+    this._writeInProgress = writeInProgress;
+    this._xoffSentToCatchUp = xoffSentToCatchUp;
+    this._userScrolling = userScrolling;
+
+    // do a full screen refresh
     this.refresh(0, this.rows - 1);
     if (this.viewport) {
       this.viewport.syncScrollArea();

src/TestUtils.test.ts

@@ -3,14 +3,16 @@
  * @license MIT
  */
 
-import { IColorSet, IRenderer, IRenderDimensions, IColorManager } from './renderer/Types';
-import { IInputHandlingTerminal, IViewport, ICompositionHelper, ITerminal, IBuffer, IBufferSet, IBrowser, ICharMeasure, ISelectionManager, ITerminalOptions, ILinkifier, IMouseHelper, ILinkMatcherOptions, CharacterJoinerHandler, IBufferLine, IBufferStringIterator, ICellData, IAttributeData } from './Types';
+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 { ITheme, IDisposable, IMarker, IEvent } from 'xterm';
+import { IDisposable, IMarker, IEvent, ISelectionPosition } from 'xterm';
 import { Terminal } from './Terminal';
-import { AttributeData } from './BufferLine';
+import { AttributeData } from './core/buffer/BufferLine';
+import { IColorManager, IColorSet } from './ui/Types';
 
 export class TestTerminal extends Terminal {
   writeSync(data: string): void {
@@ -82,9 +84,15 @@ export class MockTerminal implements ITerminal {
   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.');
   }
@@ -109,6 +117,9 @@ export class MockTerminal implements ITerminal {
   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;
@@ -373,7 +384,9 @@ export class MockRenderer implements IRenderer {
     throw new Error('Method not implemented.');
   }
   dimensions: IRenderDimensions;
-  setTheme(theme: ITheme): IColorSet { return <IColorSet>{}; }
+  setColors(colors: IColorSet): void {
+    throw new Error('Method not implemented.');
+  }
   onResize(cols: number, rows: number): void {}
   onCharSizeChanged(): void {}
   onBlur(): void {}
@@ -381,9 +394,9 @@ export class MockRenderer implements IRenderer {
   onSelectionChanged(start: [number, number], end: [number, number]): void {}
   onCursorMove(): void {}
   onOptionsChanged(): void {}
-  onWindowResize(devicePixelRatio: number): void {}
+  onDevicePixelRatioChange(): void {}
   clear(): void {}
-  refreshRows(start: number, end: number): void {}
+  renderRows(start: number, end: number): void {}
   registerCharacterJoiner(handler: CharacterJoinerHandler): number { return 0; }
   deregisterCharacterJoiner(): boolean { return true; }
 }
@@ -393,7 +406,7 @@ export class MockViewport implements IViewport {
     throw new Error('Method not implemented.');
   }
   scrollBarWidth: number = 0;
-  onThemeChanged(colors: IColorSet): void {
+  onThemeChange(colors: IColorSet): void {
     throw new Error('Method not implemented.');
   }
   onWheel(ev: WheelEvent): void {

src/Types.ts

@@ -3,15 +3,14 @@
  * @license MIT
  */
 
-import { Terminal as PublicTerminal, ITerminalOptions as IPublicTerminalOptions, IEventEmitter, IDisposable } from 'xterm';
-import { IColorSet, IRenderer } from './renderer/Types';
-import { ICharset } from './core/Types';
+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 CharData = [number, string, number, number];
 export type LineData = CharData[];
 
 export type LinkMatcherHandler = (event: MouseEvent, uri: string) => void;
@@ -88,7 +87,7 @@ export interface IViewport extends IDisposable {
   onWheel(ev: WheelEvent): void;
   onTouchStart(ev: TouchEvent): void;
   onTouchMove(ev: TouchEvent): void;
-  onThemeChanged(colors: IColorSet): void;
+  onThemeChange(colors: IColorSet): void;
 }
 
 export interface ICompositionHelper {
@@ -104,6 +103,7 @@ export interface ICompositionHelper {
  */
 export interface IInputHandler {
   parse(data: string): void;
+  parseUtf8(data: Uint8Array): void;
   print(data: Uint32Array, start: number, end: number): void;
 
   /** C0 BEL */ bell(): void;
@@ -196,11 +196,10 @@ export interface ILinkifierEvent {
   fg: number;
 }
 
-export interface ITerminal extends PublicTerminal, IElementAccessor, IBufferAccessor, ILinkifierAccessor {
+export interface ITerminal extends IPublicTerminal, IElementAccessor, IBufferAccessor, ILinkifierAccessor {
   screenElement: HTMLElement;
   selectionManager: ISelectionManager;
   charMeasure: ICharMeasure;
-  renderer: IRenderer;
   browser: IBrowser;
   writeBuffer: string[];
   cursorHidden: boolean;
@@ -221,6 +220,58 @@ export interface ITerminal extends PublicTerminal, IElementAccessor, IBufferAcce
   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;
 }
@@ -525,85 +576,6 @@ export interface IEscapeSequenceParser extends IDisposable {
   clearErrorHandler(): void;
 }
 
-/** RGB color type */
-export type IColorRGB = [number, number, number];
-
-/** Attribute data */
-export interface IAttributeData {
-  fg: number;
-  bg: number;
-
-  clone(): IAttributeData;
-
-  // flags
-  isInverse(): number;
-  isBold(): number;
-  isUnderline(): number;
-  isBlink(): number;
-  isInvisible(): number;
-  isItalic(): number;
-  isDim(): number;
-
-  // color modes
-  getFgColorMode(): number;
-  getBgColorMode(): number;
-  isFgRGB(): boolean;
-  isBgRGB(): boolean;
-  isFgPalette(): boolean;
-  isBgPalette(): boolean;
-  isFgDefault(): boolean;
-  isBgDefault(): boolean;
-
-  // colors
-  getFgColor(): number;
-  getBgColor(): number;
-}
-
-/** Cell data */
-export interface ICellData extends IAttributeData {
-  content: number;
-  combinedData: string;
-  isCombined(): number;
-  getWidth(): number;
-  getChars(): string;
-  getCode(): number;
-  setFromCharData(value: CharData): void;
-  getAsCharData(): CharData;
-}
-
-/**
- * Interface for a line in the terminal buffer.
- */
-export interface IBufferLine {
-  length: number;
-  isWrapped: boolean;
-  get(index: number): CharData;
-  set(index: number, value: CharData): void;
-  loadCell(index: number, cell: ICellData): ICellData;
-  setCell(index: number, cell: ICellData): void;
-  setCellFromCodePoint(index: number, codePoint: number, width: number, fg: number, bg: number): void;
-  addCodepointToCell(index: number, codePoint: number): void;
-  insertCells(pos: number, n: number, ch: ICellData): void;
-  deleteCells(pos: number, n: number, fill: ICellData): void;
-  replaceCells(start: number, end: number, fill: ICellData): void;
-  resize(cols: number, fill: ICellData): void;
-  fill(fillCellData: ICellData): void;
-  copyFrom(line: IBufferLine): void;
-  clone(): IBufferLine;
-  getTrimmedLength(): number;
-  translateToString(trimRight?: boolean, startCol?: number, endCol?: number): string;
-
-  /* direct access to cell attrs */
-  getWidth(index: number): number;
-  hasWidth(index: number): number;
-  getFg(index: number): number;
-  getBg(index: number): number;
-  hasContent(index: number): number;
-  getCodePoint(index: number): number;
-  isCombined(index: number): number;
-  getString(index: number): string;
-}
-
 export interface IMouseZoneManager extends IDisposable {
   add(zone: IMouseZone): void;
   clearAll(start?: number, end?: number): void;

src/Viewport.ts

@@ -3,11 +3,12 @@
  * @license MIT
  */
 
-import { IColorSet } from './renderer/Types';
 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;
 
@@ -43,7 +44,8 @@ export class Viewport extends Disposable implements IViewport {
     private _terminal: ITerminal,
     private _viewportElement: HTMLElement,
     private _scrollArea: HTMLElement,
-    private _charMeasure: CharMeasure
+    private _charMeasure: CharMeasure,
+    private _dimensions: IRenderDimensions
   ) {
     super();
 
@@ -57,7 +59,11 @@ export class Viewport extends Disposable implements IViewport {
     setTimeout(() => this.syncScrollArea(), 0);
   }
 
-  public onThemeChanged(colors: IColorSet): void {
+  public onDimensionsChance(dimensions: IRenderDimensions): void {
+    this._dimensions = dimensions;
+  }
+
+  public onThemeChange(colors: IColorSet): void {
     this._viewportElement.style.backgroundColor = colors.background.css;
   }
 
@@ -73,9 +79,9 @@ export class Viewport extends Disposable implements IViewport {
 
   private _innerRefresh(): void {
     if (this._charMeasure.height > 0) {
-      this._currentRowHeight = this._terminal.renderer.dimensions.scaledCellHeight / window.devicePixelRatio;
+      this._currentRowHeight = this._dimensions.scaledCellHeight / window.devicePixelRatio;
       this._lastRecordedViewportHeight = this._viewportElement.offsetHeight;
-      const newBufferHeight = Math.round(this._currentRowHeight * this._lastRecordedBufferLength) + (this._lastRecordedViewportHeight - this._terminal.renderer.dimensions.canvasHeight);
+      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';
@@ -106,7 +112,7 @@ export class Viewport extends Disposable implements IViewport {
     }
 
     // If viewport height changed
-    if (this._lastRecordedViewportHeight !== (<any>this._terminal).renderer.dimensions.canvasHeight) {
+    if (this._lastRecordedViewportHeight !== this._dimensions.canvasHeight) {
       this._refresh();
       return;
     }
@@ -125,7 +131,7 @@ export class Viewport extends Disposable implements IViewport {
     }
 
     // If row height changed
-    if (this._terminal.renderer.dimensions.scaledCellHeight / window.devicePixelRatio !== this._currentRowHeight) {
+    if (this._dimensions.scaledCellHeight / window.devicePixelRatio !== this._currentRowHeight) {
       this._refresh();
       return;
     }

src/WindowsMode.ts

@@ -5,7 +5,7 @@
 
 import { IDisposable } from 'xterm';
 import { ITerminal } from './Types';
-import { CHAR_DATA_CODE_INDEX, NULL_CELL_CODE, WHITESPACE_CELL_CODE } from './Buffer';
+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

src/addons/fit/fit.ts

@@ -39,8 +39,8 @@ export function proposeGeometry(term: Terminal): IGeometry {
   const availableHeight = parentElementHeight - elementPaddingVer;
   const availableWidth = parentElementWidth - elementPaddingHor - (<any>term)._core.viewport.scrollBarWidth;
   const geometry = {
-    cols: Math.floor(availableWidth / (<any>term)._core.renderer.dimensions.actualCellWidth),
-    rows: Math.floor(availableHeight / (<any>term)._core.renderer.dimensions.actualCellHeight)
+    cols: Math.floor(availableWidth / (<any>term)._core._renderCoordinator.dimensions.actualCellWidth),
+    rows: Math.floor(availableHeight / (<any>term)._core._renderCoordinator.dimensions.actualCellHeight)
   };
   return geometry;
 }
@@ -50,7 +50,7 @@ export function fit(term: Terminal): void {
   if (geometry) {
     // Force a full render
     if (term.rows !== geometry.rows || term.cols !== geometry.cols) {
-      (<any>term)._core.renderer.clear();
+      (<any>term)._core._renderCoordinator.clear();
       term.resize(geometry.cols, geometry.rows);
     }
   }

src/addons/search/Interfaces.ts

@@ -5,15 +5,8 @@
 
 import { Terminal } from 'xterm';
 
-// TODO: Don't rely on this private API
-export interface ITerminalCore {
-  buffer: any;
-  selectionManager: any;
-}
-
 export interface ISearchAddonTerminal extends Terminal {
   __searchHelper?: ISearchHelper;
-  _core: ITerminalCore;
 }
 
 export interface ISearchHelper {

src/addons/search/SearchHelper.ts

@@ -35,25 +35,23 @@ export class SearchHelper implements ISearchHelper {
    * @return Whether a result was found.
    */
   public findNext(term: string, searchOptions?: ISearchOptions): boolean {
-    const selectionManager = this._terminal._core.selectionManager;
     const {incremental} = searchOptions;
     let result: ISearchResult;
 
     if (!term || term.length === 0) {
-      selectionManager.clearSelection();
+      this._terminal.clearSelection();
       return false;
     }
 
     let startCol: number = 0;
-    let startRow = this._terminal._core.buffer.ydisp;
+    let startRow = this._terminal.buffer.viewportY;
 
-    if (selectionManager.selectionEnd) {
+    if (this._terminal.hasSelection()) {
       // Start from the selection end if there is a selection
       // For incremental search, use existing row
-      if (this._terminal.getSelection().length !== 0) {
-        startRow = incremental ? selectionManager.selectionStart[1] : selectionManager.selectionEnd[1];
-        startCol = incremental ? selectionManager.selectionStart[0] : selectionManager.selectionEnd[0];
-      }
+      const currentSelection = this._terminal.getSelectionPosition();
+      startRow = incremental ? currentSelection.startRow : currentSelection.endRow;
+      startCol = incremental ? currentSelection.startColumn : currentSelection.endColumn;
     }
 
     this._initLinesCache();
@@ -64,7 +62,7 @@ export class SearchHelper implements ISearchHelper {
     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._core.buffer.lines.get(findingRow).isWrapped) {
+    while (this._terminal.buffer.getLine(findingRow).isWrapped) {
       findingRow--;
       cumulativeCols += this._terminal.cols;
     }
@@ -75,7 +73,7 @@ export class SearchHelper implements ISearchHelper {
     // Search from startRow + 1 to end
     if (!result) {
 
-      for (let y = startRow + 1; y < this._terminal._core.buffer.ybase + this._terminal.rows; y++) {
+      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
@@ -109,24 +107,22 @@ export class SearchHelper implements ISearchHelper {
    * @return Whether a result was found.
    */
   public findPrevious(term: string, searchOptions?: ISearchOptions): boolean {
-    const selectionManager = this._terminal._core.selectionManager;
     let result: ISearchResult;
 
     if (!term || term.length === 0) {
-      selectionManager.clearSelection();
+      this._terminal.clearSelection();
       return false;
     }
 
     const isReverseSearch = true;
-    let startRow = this._terminal._core.buffer.ydisp + this._terminal.rows - 1;
+    let startRow = this._terminal.buffer.viewportY + this._terminal.rows - 1;
     let startCol = this._terminal.cols;
 
-    if (selectionManager.selectionStart) {
+    if (this._terminal.hasSelection()) {
       // Start from the selection start if there is a selection
-      if (this._terminal.getSelection().length !== 0) {
-        startRow = selectionManager.selectionStart[1];
-        startCol = selectionManager.selectionStart[0];
-      }
+      const currentSelection = this._terminal.getSelectionPosition();
+      startRow = currentSelection.startRow;
+      startCol = currentSelection.startColumn;
     }
 
     this._initLinesCache();
@@ -139,7 +135,7 @@ export class SearchHelper implements ISearchHelper {
       // 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._core.buffer.lines.get(startRow).isWrapped) {
+      if (this._terminal.buffer.getLine(startRow).isWrapped) {
         cumulativeCols += startCol;
       }
       for (let y = startRow - 1; y >= 0; y--) {
@@ -149,7 +145,7 @@ export class SearchHelper implements ISearchHelper {
         }
         // If the current line is wrapped line, increase scanning range,
         // preparing for scanning on unwrapped line
-        if (this._terminal._core.buffer.lines.get(y).isWrapped) {
+        if (this._terminal.buffer.getLine(y).isWrapped) {
           cumulativeCols += this._terminal.cols;
         } else {
           cumulativeCols = this._terminal.cols;
@@ -160,14 +156,14 @@ export class SearchHelper implements ISearchHelper {
     // Search from the bottom to startRow (search the whole startRow again in
     // case startCol > 0)
     if (!result) {
-      const searchFrom = this._terminal._core.buffer.ybase + this._terminal.rows - 1;
+      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._core.buffer.lines.get(y).isWrapped) {
+        if (this._terminal.buffer.getLine(y).isWrapped) {
           cumulativeCols += this._terminal.cols;
         } else {
           cumulativeCols = this._terminal.cols;
@@ -184,7 +180,7 @@ export class SearchHelper implements ISearchHelper {
    */
   private _initLinesCache(): void {
     if (!this._linesCache) {
-      this._linesCache = new Array(this._terminal._core.buffer.length);
+      this._linesCache = new Array(this._terminal.buffer.length);
       this._cursorMoveListener = this._terminal.onCursorMove(() => this._destroyLinesCache());
       this._resizeListener = this._terminal.onResize(() => this._destroyLinesCache());
     }
@@ -234,7 +230,7 @@ export class SearchHelper implements ISearchHelper {
   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._core.buffer.lines.get(row).isWrapped) {
+    if (this._terminal.buffer.getLine(row).isWrapped) {
       return;
     }
     let stringLine = this._linesCache ? this._linesCache[row] : void 0;
@@ -286,18 +282,18 @@ export class SearchHelper implements ISearchHelper {
         return;
       }
 
-      const line = this._terminal._core.buffer.lines.get(row);
+      const line = this._terminal.buffer.getLine(row);
 
       for (let i = 0; i < resultIndex; i++) {
-        const charData = line.get(i);
+        const cell = line.getCell(i);
         // Adjust the searchIndex to normalize emoji into single chars
-        const char = charData[1/*CHAR_DATA_CHAR_INDEX*/];
+        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 = charData[2/*CHAR_DATA_WIDTH_INDEX*/];
+        const charWidth = cell.width;
         if (charWidth === 0) {
           resultIndex++;
         }
@@ -322,9 +318,9 @@ export class SearchHelper implements ISearchHelper {
     let lineWrapsToNext: boolean;
 
     do {
-      const nextLine = this._terminal._core.buffer.lines.get(lineIndex + 1);
+      const nextLine = this._terminal.buffer.getLine(lineIndex + 1);
       lineWrapsToNext = nextLine ? nextLine.isWrapped : false;
-      lineString += this._terminal._core.buffer.translateBufferLineToString(lineIndex, !lineWrapsToNext && trimRight).substring(0, this._terminal.cols);
+      lineString += this._terminal.buffer.getLine(lineIndex).translateToString(!lineWrapsToNext && trimRight).substring(0, this._terminal.cols);
       lineIndex++;
     } while (lineWrapsToNext);
 
@@ -341,8 +337,8 @@ export class SearchHelper implements ISearchHelper {
       this._terminal.clearSelection();
       return false;
     }
-    this._terminal._core.selectionManager.setSelection(result.col, result.row, result.term.length);
-    this._terminal.scrollLines(result.row - this._terminal._core.buffer.ydisp);
+    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

@@ -23,11 +23,56 @@ class MockTerminal {
   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);

src/addons/webLinks/webLinks.test.ts

@@ -183,4 +183,30 @@ describe('webLinks addon', () => {
       assert.equal(uri, 'http://bar.io/');
     });
   });
+
+  describe('should allow + character in URI path', () => {
+    it('foo.com', () => {
+      const term = new MockTerminal();
+      webLinks.webLinksInit(<any>term);
+
+      const row = 'http://foo.com/subpath/+/id';
+
+      const match = row.match(term.regex);
+      const uri = match[term.options.matchIndex];
+
+      assert.equal(uri, 'http://foo.com/subpath/+/id');
+    });
+
+    it('bar.io', () => {
+      const term = new MockTerminal();
+      webLinks.webLinksInit(<any>term);
+
+      const row = 'http://bar.io/subpath/+/id';
+
+      const match = row.match(term.regex);
+      const uri = match[term.options.matchIndex];
+
+      assert.equal(uri, 'http://bar.io/subpath/+/id');
+    });
+  });
 });

src/addons/webLinks/webLinks.ts

@@ -14,7 +14,7 @@ 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 pathCharacterSet = '(\\/[\\/\\w\\.\\-%~:]*)*([^:"\'\\s])';
+const pathCharacterSet = '(\\/[\\/\\w\\.\\-%~:+]*)*([^:"\'\\s])';
 const pathClause = '(' + pathCharacterSet + ')?';
 const queryStringHashFragmentCharacterSet = '[0-9\\w\\[\\]\\(\\)\\/\\?\\!#@$%&\'*+,:;~\\=\\.\\-]*';
 const queryStringClause = '(\\?' + queryStringHashFragmentCharacterSet + ')?';

src/common/Types.ts

@@ -6,6 +6,8 @@
 import { IEvent, EventEmitter2 } from './EventEmitter2';
 import { IDeleteEvent, IInsertEvent } from './CircularList';
 
+export const DEFAULT_COLOR = 256;
+
 export interface IDisposable {
   dispose(): void;
 }

src/core/Types.ts

@@ -3,6 +3,8 @@
  * @license MIT
  */
 
+import { IDisposable } from '../common/Types';
+
 export const enum KeyboardResultType {
   SEND_KEY,
   SELECT_ALL,
@@ -19,3 +21,88 @@ export interface IKeyboardResult {
 export interface ICharset {
   [key: string]: string;
 }
+
+export type CharData = [number, string, number, number];
+export type IColorRGB = [number, number, number];
+
+/** Attribute data */
+export interface IAttributeData {
+  fg: number;
+  bg: number;
+
+  clone(): IAttributeData;
+
+  // flags
+  isInverse(): number;
+  isBold(): number;
+  isUnderline(): number;
+  isBlink(): number;
+  isInvisible(): number;
+  isItalic(): number;
+  isDim(): number;
+
+  // color modes
+  getFgColorMode(): number;
+  getBgColorMode(): number;
+  isFgRGB(): boolean;
+  isBgRGB(): boolean;
+  isFgPalette(): boolean;
+  isBgPalette(): boolean;
+  isFgDefault(): boolean;
+  isBgDefault(): boolean;
+
+  // colors
+  getFgColor(): number;
+  getBgColor(): number;
+}
+
+/** Cell data */
+export interface ICellData extends IAttributeData {
+  content: number;
+  combinedData: string;
+  isCombined(): number;
+  getWidth(): number;
+  getChars(): string;
+  getCode(): number;
+  setFromCharData(value: CharData): void;
+  getAsCharData(): CharData;
+}
+
+/**
+ * Interface for a line in the terminal buffer.
+ */
+export interface IBufferLine {
+  length: number;
+  isWrapped: boolean;
+  get(index: number): CharData;
+  set(index: number, value: CharData): void;
+  loadCell(index: number, cell: ICellData): ICellData;
+  setCell(index: number, cell: ICellData): void;
+  setCellFromCodePoint(index: number, codePoint: number, width: number, fg: number, bg: number): void;
+  addCodepointToCell(index: number, codePoint: number): void;
+  insertCells(pos: number, n: number, ch: ICellData): void;
+  deleteCells(pos: number, n: number, fill: ICellData): void;
+  replaceCells(start: number, end: number, fill: ICellData): void;
+  resize(cols: number, fill: ICellData): void;
+  fill(fillCellData: ICellData): void;
+  copyFrom(line: IBufferLine): void;
+  clone(): IBufferLine;
+  getTrimmedLength(): number;
+  translateToString(trimRight?: boolean, startCol?: number, endCol?: number): string;
+
+  /* direct access to cell attrs */
+  getWidth(index: number): number;
+  hasWidth(index: number): number;
+  getFg(index: number): number;
+  getBg(index: number): number;
+  hasContent(index: number): number;
+  getCodePoint(index: number): number;
+  isCombined(index: number): number;
+  getString(index: number): string;
+}
+
+export interface IMarker extends IDisposable {
+  readonly id: number;
+  readonly isDisposed: boolean;
+  readonly line: number;
+}

src/core/buffer/BufferLine.test.ts

@@ -3,10 +3,8 @@
  * @license MIT
  */
 import * as chai from 'chai';
-import { BufferLine, CellData, Content } from './BufferLine';
-import { CharData, IBufferLine } from './Types';
-import { NULL_CELL_CHAR, NULL_CELL_WIDTH, NULL_CELL_CODE, DEFAULT_ATTR } from './Buffer';
-
+import { BufferLine, CellData, Content, NULL_CELL_CHAR, NULL_CELL_WIDTH, NULL_CELL_CODE, DEFAULT_ATTR } from './BufferLine';
+import { CharData, IBufferLine } from '../Types';
 
 class TestBufferLine extends BufferLine {
   public get combined(): {[index: number]: string} {
@@ -57,7 +55,7 @@ describe('BufferLine', function(): void {
     chai.expect(line.length).equals(10);
     chai.expect(line.loadCell(0, new CellData()).getAsCharData()).eql([0, NULL_CELL_CHAR, NULL_CELL_WIDTH, NULL_CELL_CODE]);
     chai.expect(line.isWrapped).equals(false);
-    line = new TestBufferLine(10, null, true);
+    line = new TestBufferLine(10, undefined, true);
     chai.expect(line.length).equals(10);
     chai.expect(line.loadCell(0, new CellData()).getAsCharData()).eql([0, NULL_CELL_CHAR, NULL_CELL_WIDTH, NULL_CELL_CODE]);
     chai.expect(line.isWrapped).equals(true);
@@ -127,7 +125,7 @@ describe('BufferLine', function(): void {
     ]);
   });
   it('clone', function(): void {
-    const line = new TestBufferLine(5, null, true);
+    const line = new TestBufferLine(5, undefined, true);
     line.setCell(0, CellData.fromCharData([1, 'a', 0, 'a'.charCodeAt(0)]));
     line.setCell(1, CellData.fromCharData([2, 'b', 0, 'b'.charCodeAt(0)]));
     line.setCell(2, CellData.fromCharData([3, 'c', 0, 'c'.charCodeAt(0)]));
@@ -167,27 +165,27 @@ describe('BufferLine', function(): void {
     it('enlarge(false)', function(): void {
       const line = new TestBufferLine(5, CellData.fromCharData([1, 'a', 0, 'a'.charCodeAt(0)]), false);
       line.resize(10, CellData.fromCharData([1, 'a', 0, 'a'.charCodeAt(0)]));
-      chai.expect(line.toArray()).eql(Array(10).fill([1, 'a', 0, 'a'.charCodeAt(0)]));
+      chai.expect(line.toArray()).eql((Array(10) as any).fill([1, 'a', 0, 'a'.charCodeAt(0)]));
     });
     it('enlarge(true)', function(): void {
       const line = new TestBufferLine(5, CellData.fromCharData([1, 'a', 0, 'a'.charCodeAt(0)]), false);
       line.resize(10, CellData.fromCharData([1, 'a', 0, 'a'.charCodeAt(0)]));
-      chai.expect(line.toArray()).eql(Array(10).fill([1, 'a', 0, 'a'.charCodeAt(0)]));
+      chai.expect(line.toArray()).eql((Array(10) as any).fill([1, 'a', 0, 'a'.charCodeAt(0)]));
     });
     it('shrink(true) - should apply new size', function(): void {
       const line = new TestBufferLine(10, CellData.fromCharData([1, 'a', 0, 'a'.charCodeAt(0)]), false);
       line.resize(5, CellData.fromCharData([1, 'a', 0, 'a'.charCodeAt(0)]));
-      chai.expect(line.toArray()).eql(Array(5).fill([1, 'a', 0, 'a'.charCodeAt(0)]));
+      chai.expect(line.toArray()).eql((Array(5) as any).fill([1, 'a', 0, 'a'.charCodeAt(0)]));
     });
     it('shrink to 0 length', function(): void {
       const line = new TestBufferLine(10, CellData.fromCharData([1, 'a', 0, 'a'.charCodeAt(0)]), false);
       line.resize(0, CellData.fromCharData([1, 'a', 0, 'a'.charCodeAt(0)]));
-      chai.expect(line.toArray()).eql(Array(0).fill([1, 'a', 0, 'a'.charCodeAt(0)]));
+      chai.expect(line.toArray()).eql((Array(0) as any).fill([1, 'a', 0, 'a'.charCodeAt(0)]));
     });
     it('should remove combining data on replaced cells after shrinking then enlarging', () => {
       const line = new TestBufferLine(10, CellData.fromCharData([1, 'a', 0, 'a'.charCodeAt(0)]), false);
-      line.set(2, [ null, '😁', 1, '😁'.charCodeAt(0) ]);
-      line.set(9, [ null, '😁', 1, '😁'.charCodeAt(0) ]);
+      line.set(2, [ 0, '😁', 1, '😁'.charCodeAt(0) ]);
+      line.set(9, [ 0, '😁', 1, '😁'.charCodeAt(0) ]);
       chai.expect(line.translateToString()).eql('aa😁aaaaaa😁');
       chai.expect(Object.keys(line.combined).length).eql(2);
       line.resize(5, CellData.fromCharData([1, 'a', 0, 'a'.charCodeAt(0)]));
@@ -224,7 +222,7 @@ describe('BufferLine', function(): void {
       const line = new TestBufferLine(10, CellData.fromCharData([DEFAULT_ATTR, NULL_CELL_CHAR, NULL_CELL_WIDTH, NULL_CELL_CODE]), false);
       line.setCell(0, CellData.fromCharData([1, 'a', 1, 'a'.charCodeAt(0)]));
       line.setCell(2, CellData.fromCharData([1, '１', 2, '１'.charCodeAt(0)]));
-      line.setCell(3, CellData.fromCharData([0, '', 0, undefined]));
+      line.setCell(3, CellData.fromCharData([0, '', 0, 0]));
       chai.expect(line.getTrimmedLength()).equal(4); // also counts null cell after fullwidth
     });
   });
@@ -284,11 +282,11 @@ describe('BufferLine', function(): void {
       const line = new TestBufferLine(10, CellData.fromCharData([DEFAULT_ATTR, NULL_CELL_CHAR, NULL_CELL_WIDTH, NULL_CELL_CODE]), false);
       line.setCell(0, CellData.fromCharData([1, 'a', 1, 'a'.charCodeAt(0)]));
       line.setCell(2, CellData.fromCharData([1, '１', 2, '１'.charCodeAt(0)]));
-      line.setCell(3, CellData.fromCharData([0, '', 0, undefined]));
+      line.setCell(3, CellData.fromCharData([0, '', 0, 0]));
       line.setCell(5, CellData.fromCharData([1, '１', 2, '１'.charCodeAt(0)]));
-      line.setCell(6, CellData.fromCharData([0, '', 0, undefined]));
+      line.setCell(6, CellData.fromCharData([0, '', 0, 0]));
       line.setCell(7, CellData.fromCharData([1, '１', 2, '１'.charCodeAt(0)]));
-      line.setCell(8, CellData.fromCharData([0, '', 0, undefined]));
+      line.setCell(8, CellData.fromCharData([0, '', 0, 0]));
       chai.expect(line.translateToString(false)).equal('a １ １１ ');
       chai.expect(line.translateToString(true)).equal('a １ １１');
       chai.expect(line.translateToString(false, 0, 7)).equal('a １ １');

src/core/buffer/BufferLine.ts

@@ -2,10 +2,34 @@
  * Copyright (c) 2018 The xterm.js authors. All rights reserved.
  * @license MIT
  */
-import { CharData, IBufferLine, ICellData, IColorRGB, IAttributeData } from './Types';
-import { NULL_CELL_CODE, NULL_CELL_WIDTH, NULL_CELL_CHAR, CHAR_DATA_CHAR_INDEX, CHAR_DATA_WIDTH_INDEX, WHITESPACE_CELL_CHAR, CHAR_DATA_ATTR_INDEX } from './Buffer';
-import { stringFromCodePoint } from './core/input/TextDecoder';
+import { CharData, IBufferLine, ICellData, IColorRGB, IAttributeData } from '../Types';
+import { stringFromCodePoint } from '../input/TextDecoder';
+import { DEFAULT_COLOR } from '../../common/Types';
 
+export const DEFAULT_ATTR = (0 << 18) | (DEFAULT_COLOR << 9) | (256 << 0);
+
+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;
+
+/**
+ * Null cell - a real empty cell (containing nothing).
+ * Note that code should always be 0 for a null cell as
+ * several test condition of the buffer line rely on this.
+ */
+export const NULL_CELL_CHAR = '';
+export const NULL_CELL_WIDTH = 1;
+export const NULL_CELL_CODE = 0;
+
+/**
+ * Whitespace cell.
+ * This is meant as a replacement for empty cells when needed
+ * during rendering lines to preserve correct aligment.
+ */
+export const WHITESPACE_CELL_CHAR = ' ';
+export const WHITESPACE_CELL_WIDTH = 1;
+export const WHITESPACE_CELL_CODE = 32;
 
 /**
  * buffer memory layout:
@@ -193,6 +217,8 @@ export class AttributeData implements IAttributeData {
   }
 }
 
+export const DEFAULT_ATTR_DATA = new AttributeData();
+
 /**
  * CellData - represents a single Cell in the terminal buffer.
  */
@@ -299,17 +325,15 @@ export class CellData extends AttributeData implements ICellData {
  * memory allocs / GC pressure can be greatly reduced by reusing the CellData object.
  */
 export class BufferLine implements IBufferLine {
-  protected _data: Uint32Array | null = null;
+  protected _data: Uint32Array;
   protected _combined: {[index: number]: string} = {};
   public length: number;
 
   constructor(cols: number, fillCellData?: ICellData, public isWrapped: boolean = false) {
-    if (cols) {
-      this._data = new Uint32Array(cols * CELL_SIZE);
-      const cell = fillCellData || CellData.fromCharData([0, NULL_CELL_CHAR, NULL_CELL_WIDTH, NULL_CELL_CODE]);
-      for (let i = 0; i < cols; ++i) {
-        this.setCell(i, cell);
-      }
+    this._data = new Uint32Array(cols * CELL_SIZE);
+    const cell = fillCellData || CellData.fromCharData([0, NULL_CELL_CHAR, NULL_CELL_WIDTH, NULL_CELL_CODE]);
+    for (let i = 0; i < cols; ++i) {
+      this.setCell(i, cell);
     }
     this.length = cols;
   }
@@ -547,7 +571,7 @@ export class BufferLine implements IBufferLine {
           }
         }
       } else {
-        this._data = null;
+        this._data = new Uint32Array(0);
         this._combined = {};
       }
     }

src/core/buffer/BufferReflow.test.ts

@@ -3,18 +3,17 @@
  * @license MIT
  */
 import { assert } from 'chai';
-import { BufferLine } from './BufferLine';
+import { BufferLine, NULL_CELL_CHAR, NULL_CELL_WIDTH, NULL_CELL_CODE } from './BufferLine';
 import { reflowSmallerGetNewLineLengths } from './BufferReflow';
-import { NULL_CELL_CHAR, NULL_CELL_WIDTH, NULL_CELL_CODE } from './Buffer';
 
 describe('BufferReflow', () => {
   describe('reflowSmallerGetNewLineLengths', () => {
     it('should return correct line lengths for a small line with wide characters', () => {
       const line = new BufferLine(4);
-      line.set(0, [null, '汉', 2, '汉'.charCodeAt(0)]);
-      line.set(1, [null, '', 0, undefined]);
-      line.set(2, [null, '语', 2, '语'.charCodeAt(0)]);
-      line.set(3, [null, '', 0, undefined]);
+      line.set(0, [0, '汉', 2, '汉'.charCodeAt(0)]);
+      line.set(1, [0, '', 0, 0]);
+      line.set(2, [0, '语', 2, '语'.charCodeAt(0)]);
+      line.set(3, [0, '', 0, 0]);
       assert.equal(line.translateToString(true), '汉语');
       assert.deepEqual(reflowSmallerGetNewLineLengths([line], 4, 3), [2, 2], 'line: 汉, 语');
       assert.deepEqual(reflowSmallerGetNewLineLengths([line], 4, 2), [2, 2], 'line: 汉, 语');
@@ -22,12 +21,12 @@ describe('BufferReflow', () => {
     it('should return correct line lengths for a large line with wide characters', () => {
       const line = new BufferLine(12);
       for (let i = 0; i < 12; i += 4) {
-        line.set(i, [null, '汉', 2, '汉'.charCodeAt(0)]);
-        line.set(i + 2, [null, '语', 2, '语'.charCodeAt(0)]);
+        line.set(i, [0, '汉', 2, '汉'.charCodeAt(0)]);
+        line.set(i + 2, [0, '语', 2, '语'.charCodeAt(0)]);
       }
       for (let i = 1; i < 12; i += 2) {
-        line.set(i, [null, '', 0, undefined]);
-        line.set(i, [null, '', 0, undefined]);
+        line.set(i, [0, '', 0, 0]);
+        line.set(i, [0, '', 0, 0]);
       }
       assert.equal(line.translateToString(), '汉语汉语汉语');
       assert.deepEqual(reflowSmallerGetNewLineLengths([line], 12, 11), [10, 2], 'line: 汉语汉语汉, 语');
@@ -43,12 +42,12 @@ describe('BufferReflow', () => {
     });
     it('should return correct line lengths for a string with wide and single characters', () => {
       const line = new BufferLine(6);
-      line.set(0, [null, 'a', 1, 'a'.charCodeAt(0)]);
-      line.set(1, [null, '汉', 2, '汉'.charCodeAt(0)]);
-      line.set(2, [null, '', 0, undefined]);
-      line.set(3, [null, '语', 2, '语'.charCodeAt(0)]);
-      line.set(4, [null, '', 0, undefined]);
-      line.set(5, [null, 'b', 1, 'b'.charCodeAt(0)]);
+      line.set(0, [0, 'a', 1, 'a'.charCodeAt(0)]);
+      line.set(1, [0, '汉', 2, '汉'.charCodeAt(0)]);
+      line.set(2, [0, '', 0, 0]);
+      line.set(3, [0, '语', 2, '语'.charCodeAt(0)]);
+      line.set(4, [0, '', 0, 0]);
+      line.set(5, [0, 'b', 1, 'b'.charCodeAt(0)]);
       assert.equal(line.translateToString(), 'a汉语b');
       assert.deepEqual(reflowSmallerGetNewLineLengths([line], 6, 5), [5, 1], 'line: a汉语b');
       assert.deepEqual(reflowSmallerGetNewLineLengths([line], 6, 4), [3, 3], 'line: a汉, 语b');
@@ -57,19 +56,19 @@ describe('BufferReflow', () => {
     });
     it('should return correct line lengths for a wrapped line with wide and single characters', () => {
       const line1 = new BufferLine(6);
-      line1.set(0, [null, 'a', 1, 'a'.charCodeAt(0)]);
-      line1.set(1, [null, '汉', 2, '汉'.charCodeAt(0)]);
-      line1.set(2, [null, '', 0, undefined]);
-      line1.set(3, [null, '语', 2, '语'.charCodeAt(0)]);
-      line1.set(4, [null, '', 0, undefined]);
-      line1.set(5, [null, 'b', 1, 'b'.charCodeAt(0)]);
+      line1.set(0, [0, 'a', 1, 'a'.charCodeAt(0)]);
+      line1.set(1, [0, '汉', 2, '汉'.charCodeAt(0)]);
+      line1.set(2, [0, '', 0, 0]);
+      line1.set(3, [0, '语', 2, '语'.charCodeAt(0)]);
+      line1.set(4, [0, '', 0, 0]);
+      line1.set(5, [0, 'b', 1, 'b'.charCodeAt(0)]);
       const line2 = new BufferLine(6, undefined, true);
-      line2.set(0, [null, 'a', 1, 'a'.charCodeAt(0)]);
-      line2.set(1, [null, '汉', 2, '汉'.charCodeAt(0)]);
-      line2.set(2, [null, '', 0, undefined]);
-      line2.set(3, [null, '语', 2, '语'.charCodeAt(0)]);
-      line2.set(4, [null, '', 0, undefined]);
-      line2.set(5, [null, 'b', 1, 'b'.charCodeAt(0)]);
+      line2.set(0, [0, 'a', 1, 'a'.charCodeAt(0)]);
+      line2.set(1, [0, '汉', 2, '汉'.charCodeAt(0)]);
+      line2.set(2, [0, '', 0, 0]);
+      line2.set(3, [0, '语', 2, '语'.charCodeAt(0)]);
+      line2.set(4, [0, '', 0, 0]);
+      line2.set(5, [0, 'b', 1, 'b'.charCodeAt(0)]);
       assert.equal(line1.translateToString(), 'a汉语b');
       assert.equal(line2.translateToString(), 'a汉语b');
       assert.deepEqual(reflowSmallerGetNewLineLengths([line1, line2], 6, 5), [5, 4, 3], 'lines: a汉语, ba汉, 语b');
@@ -79,11 +78,11 @@ describe('BufferReflow', () => {
     });
     it('should work on lines ending in null space', () => {
       const line = new BufferLine(5);
-      line.set(0, [null, '汉', 2, '汉'.charCodeAt(0)]);
-      line.set(1, [null, '', 0, undefined]);
-      line.set(2, [null, '语', 2, '语'.charCodeAt(0)]);
-      line.set(3, [null, '', 0, undefined]);
-      line.set(4, [null, NULL_CELL_CHAR, NULL_CELL_WIDTH, NULL_CELL_CODE]);
+      line.set(0, [0, '汉', 2, '汉'.charCodeAt(0)]);
+      line.set(1, [0, '', 0, 0]);
+      line.set(2, [0, '语', 2, '语'.charCodeAt(0)]);
+      line.set(3, [0, '', 0, 0]);
+      line.set(4, [0, NULL_CELL_CHAR, NULL_CELL_WIDTH, NULL_CELL_CODE]);
       assert.equal(line.translateToString(true), '汉语');
       assert.equal(line.translateToString(false), '汉语 ');
       assert.deepEqual(reflowSmallerGetNewLineLengths([line], 4, 3), [2, 2], 'line: 汉, 语');

src/core/buffer/BufferReflow.ts

@@ -4,8 +4,8 @@
  */
 
 import { BufferLine } from './BufferLine';
-import { CircularList } from './common/CircularList';
-import { IBufferLine, ICellData } from './Types';
+import { CircularList } from '../../common/CircularList';
+import { IBufferLine, ICellData } from '../Types';
 
 export interface INewLayoutResult {
   layout: number[];

src/core/buffer/Marker.ts

@@ -0,0 +1,35 @@
+/**
+ * Copyright (c) 2018 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+import { EventEmitter2, IEvent } from '../../common/EventEmitter2';
+import { Disposable } from '../../common/Lifecycle';
+import { IMarker } from '../Types';
+
+export class Marker extends Disposable implements IMarker {
+  private static _nextId = 1;
+
+  private _id: number = Marker._nextId++;
+  public isDisposed: boolean = false;
+
+  public get id(): number { return this._id; }
+
+  private _onDispose = new EventEmitter2<void>();
+  public get onDispose(): IEvent<void> { return this._onDispose.event; }
+
+  constructor(
+    public line: number
+  ) {
+    super();
+  }
+
+  public dispose(): void {
+    if (this.isDisposed) {
+      return;
+    }
+    this.isDisposed = true;
+    // Emit before super.dispose such that dispose listeners get a change to react
+    this._onDispose.fire();
+  }
+}

src/core/input/TextDecoder.test.ts

@@ -4,7 +4,41 @@
  */
 
 import { assert } from 'chai';
-import { StringToUtf32, stringFromCodePoint, utf32ToString } from './TextDecoder';
+import { StringToUtf32, stringFromCodePoint, Utf8ToUtf32, utf32ToString } from './TextDecoder';
+import { encode } from 'utf8';
+
+// convert UTF32 codepoints to string
+function toString(data: Uint32Array, length: number): string {
+  if ((String as any).fromCodePoint) {
+    return (String as any).fromCodePoint.apply(null, data.subarray(0, length));
+  }
+  let result = '';
+  for (let i = 0; i < length; ++i) {
+    result += stringFromCodePoint(data[i]);
+  }
+  return result;
+}
+
+// convert "bytestring" (charCode 0-255) to bytes
+function fromByteString(s: string): Uint8Array {
+  const result = new Uint8Array(s.length);
+  for (let i = 0; i < s.length; ++i) {
+    result[i] = s.charCodeAt(i);
+  }
+  return result;
+}
+
+const TEST_STRINGS = [
+  'Лорем ипсум долор сит амет, ех сеа аццусам диссентиет. Ан еос стет еирмод витуперата. Иус дицерет урбанитас ет. Ан при алтера долорес сплендиде, цу яуо интегре денияуе, игнота волуптариа инструцтиор цу вим.',
+  'ლორემ იფსუმ დოლორ სით ამეთ, ფაცერ მუციუს ცონსეთეთურ ყუო იდ, ფერ ვივენდუმ ყუაერენდუმ ეა, ესთ ამეთ მოვეთ სუავითათე ცუ. ვითაე სენსიბუს ან ვიხ. ეხერცი დეთერრუისსეთ უთ ყუი. ვოცენთ დებითის ადიფისცი ეთ ფერ. ნეც ან ფეუგაით ფორენსიბუს ინთერესსეთ. იდ დიცო რიდენს იუს. დისსენთიეთ ცონსეყუუნთურ სედ ნე, ნოვუმ მუნერე ეუმ ათ, ნე ეუმ ნიჰილ ირაცუნდია ურბანითას.',
+  'अधिकांश अमितकुमार प्रोत्साहित मुख्य जाने प्रसारन विश्लेषण विश्व दारी अनुवादक अधिकांश नवंबर विषय गटकउसि गोपनीयता विकास जनित परस्पर गटकउसि अन्तरराष्ट्रीयकरन होसके मानव पुर्णता कम्प्युटर यन्त्रालय प्रति साधन',
+  '覧六子当聞社計文護行情投身斗来。増落世的況上席備界先関権能万。本物挙歯乳全事携供板栃果以。頭月患端撤競見界記引去法条公泊候。決海備駆取品目芸方用朝示上用報。講申務紙約週堂出応理田流団幸稿。起保帯吉対阜庭支肯豪彰属本躍。量抑熊事府募動極都掲仮読岸。自続工就断庫指北速配鳴約事新住米信中験。婚浜袋著金市生交保他取情距。',
+  '八メル務問へふらく博辞説いわょ読全タヨムケ東校どっ知壁テケ禁去フミ人過を装5階がねぜ法逆はじ端40落ミ予竹マヘナセ任1悪た。省ぜりせ製暇ょへそけ風井イ劣手はぼまず郵富法く作断タオイ取座ゅょが出作ホシ月給26島ツチ皇面ユトクイ暮犯リワナヤ断連こうでつ蔭柔薄とレにの。演めけふぱ損田転10得観びトげぎ王物鉄夜がまけ理惜くち牡提づ車惑参ヘカユモ長臓超漫ぼドかわ。',
+  '모든 국민은 행위시의 법률에 의하여 범죄를 구성하지 아니하는 행위로 소추되지 아니하며. 전직대통령의 신분과 예우에 관하여는 법률로 정한다, 국회는 헌법 또는 법률에 특별한 규정이 없는 한 재적의원 과반수의 출석과 출석의원 과반수의 찬성으로 의결한다. 군인·군무원·경찰공무원 기타 법률이 정하는 자가 전투·훈련등 직무집행과 관련하여 받은 손해에 대하여는 법률이 정하는 보상외에 국가 또는 공공단체에 공무원의 직무상 불법행위로 인한 배상은 청구할 수 없다.',
+  'كان فشكّل الشرقي مع, واحدة للمجهود تزامناً بعض بل. وتم جنوب للصين غينيا لم, ان وبدون وكسبت الأمور ذلك, أسر الخاسر الانجليزية هو. نفس لغزو مواقعها هو. الجو علاقة الصعداء انه أي, كما مع بمباركة للإتحاد الوزراء. ترتيب الأولى أن حدى, الشتوية باستحداث مدن بل, كان قد أوسع عملية. الأوضاع بالمطالبة كل قام, دون إذ شمال الربيع،. هُزم الخاصّة ٣٠ أما, مايو الصينية مع قبل.',
+  'או סדר החול מיזמי קרימינולוגיה. קהילה בגרסה לויקיפדים אל היא, של צעד ציור ואלקטרוניקה. מדע מה ברית המזנון ארכיאולוגיה, אל טבלאות מבוקשים כלל. מאמרשיחהצפה העריכהגירסאות שכל אל, כתב עיצוב מושגי של. קבלו קלאסיים ב מתן. נבחרים אווירונאוטיקה אם מלא, לוח למנוע ארכיאולוגיה מה. ארץ לערוך בקרבת מונחונים או, עזרה רקטות לויקיפדים אחר גם.',
+  'Лорем ლორემ अधिकांश 覧六子 八メル 모든 בקרבת 💮 😂 äggg 123€ 𝄞.'
+];
 
 describe('text encodings', () => {
   it('stringFromCodePoint/utf32ToString', () => {
@@ -17,7 +51,7 @@ describe('text encodings', () => {
     assert.equal(utf32ToString(data), s);
   });
 
-  describe('StringToUtf32 Decoder', () => {
+  describe('StringToUtf32 decoder', () => {
     describe('full codepoint test', () => {
       it('0..65535', () => {
         const decoder = new StringToUtf32();
@@ -34,7 +68,8 @@ describe('text encodings', () => {
           decoder.clear();
         }
       });
-      it('65536..0x10FFFF (surrogates)', function(): void {
+
+      it('65536..0x10FFFF (surrogates)', function (): void {
         this.timeout(20000);
         const decoder = new StringToUtf32();
         const target = new Uint32Array(5);
@@ -50,6 +85,16 @@ describe('text encodings', () => {
       });
     });
 
+    it('test strings', () => {
+      const decoder = new StringToUtf32();
+      const target = new Uint32Array(500);
+      for (let i = 0; i < TEST_STRINGS.length; ++i) {
+        const length = decoder.decode(TEST_STRINGS[i], target);
+        assert.equal(toString(target, length), TEST_STRINGS[i]);
+        decoder.clear();
+      }
+    });
+
     describe('stream handling', () => {
       it('surrogates mixed advance by 1', () => {
         const decoder = new StringToUtf32();
@@ -58,7 +103,114 @@ describe('text encodings', () => {
         let decoded = '';
         for (let i = 0; i < input.length; ++i) {
           const written = decoder.decode(input[i], target);
-          decoded += utf32ToString(target, written);
+          decoded += toString(target, written);
+        }
+        assert(decoded, 'Ä€𝄞Ö𝄞€Ü𝄞€');
+      });
+    });
+  });
+
+  describe('Utf8ToUtf32 decoder', () => {
+    describe('full codepoint test', () => {
+
+      it('0..65535 (1/2/3 byte sequences)', () => {
+        const decoder = new Utf8ToUtf32();
+        const target = new Uint32Array(5);
+        for (let i = 0; i < 65536; ++i) {
+          // skip surrogate pairs
+          if (i >= 0xD800 && i <= 0xDFFF) {
+            continue;
+          }
+          const utf8Data = fromByteString(encode(String.fromCharCode(i)));
+          const length = decoder.decode(utf8Data, target);
+          assert.equal(length, 1);
+          assert.equal(toString(target, length), String.fromCharCode(i));
+          decoder.clear();
+        }
+      });
+
+      it('65536..0x10FFFF (4 byte sequences)', function (): void {
+        this.timeout(20000);
+        const decoder = new Utf8ToUtf32();
+        const target = new Uint32Array(5);
+        for (let i = 65536; i < 0x10FFFF; ++i) {
+          const utf8Data = fromByteString(encode(stringFromCodePoint(i)));
+          const length = decoder.decode(utf8Data, target);
+          assert.equal(length, 1);
+          assert.equal(target[0], i);
+          decoder.clear();
+        }
+      });
+    });
+
+    it('test strings', () => {
+      const decoder = new Utf8ToUtf32();
+      const target = new Uint32Array(500);
+      for (let i = 0; i < TEST_STRINGS.length; ++i) {
+        const utf8Data = fromByteString(encode(TEST_STRINGS[i]));
+        const length = decoder.decode(utf8Data, target);
+        assert.equal(toString(target, length), TEST_STRINGS[i]);
+        decoder.clear();
+      }
+    });
+
+    describe('stream handling', () => {
+      it('2 byte sequences - advance by 1', () => {
+        const decoder = new Utf8ToUtf32();
+        const target = new Uint32Array(5);
+        const utf8Data = fromByteString('\xc3\x84\xc3\x96\xc3\x9c\xc3\x9f\xc3\xb6\xc3\xa4\xc3\xbc');
+        let decoded = '';
+        for (let i = 0; i < utf8Data.length; ++i) {
+          const written = decoder.decode(utf8Data.slice(i, i + 1), target);
+          decoded += toString(target, written);
+        }
+        assert(decoded, 'ÄÖÜßöäü');
+      });
+
+      it('2/3 byte sequences - advance by 1', () => {
+        const decoder = new Utf8ToUtf32();
+        const target = new Uint32Array(5);
+        const utf8Data = fromByteString('\xc3\x84\xe2\x82\xac\xc3\x96\xe2\x82\xac\xc3\x9c\xe2\x82\xac\xc3\x9f\xe2\x82\xac\xc3\xb6\xe2\x82\xac\xc3\xa4\xe2\x82\xac\xc3\xbc');
+        let decoded = '';
+        for (let i = 0; i < utf8Data.length; ++i) {
+          const written = decoder.decode(utf8Data.slice(i, i + 1), target);
+          decoded += toString(target, written);
+        }
+        assert(decoded, 'Āր܀߀ö€ä€ü');
+      });
+
+      it('2/3/4 byte sequences - advance by 1', () => {
+        const decoder = new Utf8ToUtf32();
+        const target = new Uint32Array(5);
+        const utf8Data = fromByteString('\xc3\x84\xe2\x82\xac\xf0\x9d\x84\x9e\xc3\x96\xf0\x9d\x84\x9e\xe2\x82\xac\xc3\x9c\xf0\x9d\x84\x9e\xe2\x82\xac');
+        let decoded = '';
+        for (let i = 0; i < utf8Data.length; ++i) {
+          const written = decoder.decode(utf8Data.slice(i, i + 1), target);
+          decoded += toString(target, written);
+        }
+        assert(decoded, 'Ä€𝄞Ö𝄞€Ü𝄞€');
+      });
+
+      it('2/3/4 byte sequences - advance by 2', () => {
+        const decoder = new Utf8ToUtf32();
+        const target = new Uint32Array(5);
+        const utf8Data = fromByteString('\xc3\x84\xe2\x82\xac\xf0\x9d\x84\x9e\xc3\x96\xf0\x9d\x84\x9e\xe2\x82\xac\xc3\x9c\xf0\x9d\x84\x9e\xe2\x82\xac');
+        let decoded = '';
+        for (let i = 0; i < utf8Data.length; i += 2) {
+          const written = decoder.decode(utf8Data.slice(i, i + 2), target);
+          decoded += toString(target, written);
+        }
+        assert(decoded, 'Ä€𝄞Ö𝄞€Ü𝄞€');
+      });
+
+      it('2/3/4 byte sequences - advance by 3', () => {
+        const decoder = new Utf8ToUtf32();
+        const target = new Uint32Array(5);
+        const utf8Data = fromByteString('\xc3\x84\xe2\x82\xac\xf0\x9d\x84\x9e\xc3\x96\xf0\x9d\x84\x9e\xe2\x82\xac\xc3\x9c\xf0\x9d\x84\x9e\xe2\x82\xac');
+        let decoded = '';
+        for (let i = 0; i < utf8Data.length; i += 3) {
+          const written = decoder.decode(utf8Data.slice(i, i + 3), target);
+          decoded += toString(target, written);
         }
         assert(decoded, 'Ä€𝄞Ö𝄞€Ü𝄞€');
       });

src/core/input/TextDecoder.ts

@@ -3,6 +3,45 @@
  * @license MIT
  */
 
+/**
+ * Polyfill - Convert UTF32 codepoint into JS string.
+ * Note: The built-in String.fromCodePoint happens to be much slower
+ *       due to additional sanity checks. We can avoid them since
+ *       we always operate on legal UTF32 (granted by the input decoders)
+ *       and use this faster version instead.
+ */
+export function stringFromCodePoint(codePoint: number): string {
+  if (codePoint > 0xFFFF) {
+    codePoint -= 0x10000;
+    return String.fromCharCode((codePoint >> 10) + 0xD800) + String.fromCharCode((codePoint % 0x400) + 0xDC00);
+  }
+  return String.fromCharCode(codePoint);
+}
+
+/**
+ * Convert UTF32 char codes into JS string.
+ * Basically the same as `stringFromCodePoint` but for multiple codepoints
+ * in a loop (which is a lot faster).
+ */
+export function utf32ToString(data: Uint32Array, start: number = 0, end: number = data.length): string {
+  let result = '';
+  for (let i = start; i < end; ++i) {
+    let codepoint = data[i];
+    if (codepoint > 0xFFFF) {
+      // JS strings are encoded as UTF16, thus a non BMP codepoint gets converted into a surrogate pair
+      // conversion rules:
+      //  - subtract 0x10000 from code point, leaving a 20 bit number
+      //  - add high 10 bits to 0xD800  --> first surrogate
+      //  - add low 10 bits to 0xDC00   --> second surrogate
+      codepoint -= 0x10000;
+      result += String.fromCharCode((codepoint >> 10) + 0xD800) + String.fromCharCode((codepoint % 0x400) + 0xDC00);
+    } else {
+      result += String.fromCharCode(codepoint);
+    }
+  }
+  return result;
+}
+
 /**
  * StringToUtf32 - decodes UTF16 sequences into UTF32 codepoints.
  * To keep the decoder in line with JS strings it handles single surrogates as UCS2.
@@ -73,37 +112,231 @@ export class StringToUtf32 {
 }
 
 /**
- * Convert UTF32 codepoint into JS string.
+ * Utf8Decoder - decodes UTF8 byte sequences into UTF32 codepoints.
  */
-export function stringFromCodePoint(codePoint: number): string {
-  if (codePoint > 0xFFFF) {
-    // UTF32 to UTF16 conversion (see comments in utf32ToString)
-    codePoint -= 0x10000;
-    return String.fromCharCode((codePoint >> 10) + 0xD800) + String.fromCharCode((codePoint % 0x400) + 0xDC00);
-  }
-  return String.fromCharCode(codePoint);
-}
+export class Utf8ToUtf32 {
+  public interim: Uint8Array = new Uint8Array(3);
 
-/**
- * Convert UTF32 char codes into JS string.
- * Basically the same as `stringFromCodePoint` but for multiple codepoints
- * in a loop (which is a lot faster).
- */
-export function utf32ToString(data: Uint32Array, start: number = 0, end: number = data.length): string {
-  let result = '';
-  for (let i = start; i < end; ++i) {
-    let codepoint = data[i];
-    if (codepoint > 0xFFFF) {
-      // JS string are encoded as UTF16, thus a non BMP codepoint gets converted into a surrogate pair
-      // conversion rules:
-      //  - subtract 0x10000 from code point, leaving a 20 bit number
-      //  - add high 10 bits to 0xD800  --> first surrogate
-      //  - add low 10 bits to 0xDC00   --> second surrogate
-      codepoint -= 0x10000;
-      result += String.fromCharCode((codepoint >> 10) + 0xD800) + String.fromCharCode((codepoint % 0x400) + 0xDC00);
-    } else {
-      result += String.fromCharCode(codepoint);
-    }
+  /**
+   * Clears interim bytes and resets decoder to clean state.
+   */
+  public clear(): void {
+    this.interim.fill(0);
+  }
+
+  /**
+   * Decodes UTF8 byte sequences in `input` to UTF32 codepoints in `target`.
+   * The methods assumes stream input and will store partly transmitted bytes
+   * and decode them with the next data chunk.
+   * Note: The method does no bound checks for target, therefore make sure
+   * the provided data chunk does not exceed the size of `target`.
+   * Returns the number of written codepoints in `target`.
+   */
+  decode(input: Uint8Array, target: Uint32Array): number {
+    const length = input.length;
+
+    if (!length) {
+      return 0;
+    }
+
+    let size = 0;
+    let byte1: number;
+    let byte2: number;
+    let byte3: number;
+    let byte4: number;
+    let codepoint = 0;
+    let startPos = 0;
+
+    // handle leftover bytes
+    if (this.interim[0]) {
+      let discardInterim = false;
+      let cp = this.interim[0];
+      cp &= ((((cp & 0xE0) === 0xC0)) ? 0x1F : (((cp & 0xF0) === 0xE0)) ? 0x0F : 0x07);
+      let pos = 0;
+      let tmp: number;
+      while ((tmp = this.interim[++pos] & 0x3F) && pos < 4) {
+        cp <<= 6;
+        cp |= tmp;
+      }
+      // missing bytes - read ahead from input
+      const type = (((this.interim[0] & 0xE0) === 0xC0)) ? 2 : (((this.interim[0] & 0xF0) === 0xE0)) ? 3 : 4;
+      const missing = type - pos;
+      while (startPos < missing) {
+        if (startPos >= length) {
+          return 0;
+        }
+        tmp = input[startPos++];
+        if ((tmp & 0xC0) !== 0x80) {
+          // wrong continuation, discard interim bytes completely
+          startPos--;
+          discardInterim = true;
+          break;
+        } else {
+          // need to save so we can continue short inputs in next call
+          this.interim[pos++] = tmp;
+          cp <<= 6;
+          cp |= tmp & 0x3F;
+        }
+      }
+      if (!discardInterim) {
+        // final test is type dependent
+        if (type === 2) {
+          if (cp < 0x80) {
+            // wrong starter byte
+            startPos--;
+          } else {
+            target[size++] = cp;
+          }
+        } else if (type === 3) {
+          if (cp < 0x0800 || (cp >= 0xD800 && cp <= 0xDFFF)) {
+            // illegal codepoint
+          } else {
+            target[size++] = cp;
+          }
+        } else {
+          if (codepoint < 0x010000 || codepoint > 0x10FFFF) {
+            // illegal codepoint
+          } else {
+            target[size++] = cp;
+          }
+        }
+      }
+      this.interim.fill(0);
+    }
+
+    // loop through input
+    const fourStop = length - 4;
+    let i = startPos;
+    while (i < length) {
+      /**
+       * ASCII shortcut with loop unrolled to 4 consecutive ASCII chars.
+       * This is a compromise between speed gain for ASCII
+       * and penalty for non ASCII:
+       * For best ASCII performance the char should be stored directly into target,
+       * but even a single attempt to write to target and compare afterwards
+       * penalizes non ASCII really bad (-50%), thus we load the char into byteX first,
+       * which reduces ASCII performance by ~15%.
+       * This trial for ASCII reduces non ASCII performance by ~10% which seems acceptible
+       * compared to the gains.
+       * Note that this optimization only takes place for 4 consecutive ASCII chars,
+       * for any shorter it bails out. Worst case - all 4 bytes being read but
+       * thrown away due to the last being a non ASCII char (-10% performance).
+       */
+      while (i < fourStop
+        && !((byte1 = input[i]) & 0x80)
+        && !((byte2 = input[i + 1]) & 0x80)
+        && !((byte3 = input[i + 2]) & 0x80)
+        && !((byte4 = input[i + 3]) & 0x80))
+      {
+        target[size++] = byte1;
+        target[size++] = byte2;
+        target[size++] = byte3;
+        target[size++] = byte4;
+        i += 4;
+      }
+
+      // reread byte1
+      byte1 = input[i++];
+
+      // 1 byte
+      if (byte1 < 0x80) {
+        target[size++] = byte1;
+
+        // 2 bytes
+      } else if ((byte1 & 0xE0) === 0xC0) {
+        if (i >= length) {
+          this.interim[0] = byte1;
+          return size;
+        }
+        byte2 = input[i++];
+        if ((byte2 & 0xC0) !== 0x80) {
+          // wrong continuation
+          i--;
+          continue;
+        }
+        codepoint = (byte1 & 0x1F) << 6 | (byte2 & 0x3F);
+        if (codepoint < 0x80) {
+          // wrong starter byte
+          i--;
+          continue;
+        }
+        target[size++] = codepoint;
+
+        // 3 bytes
+      } else if ((byte1 & 0xF0) === 0xE0) {
+        if (i >= length) {
+          this.interim[0] = byte1;
+          return size;
+        }
+        byte2 = input[i++];
+        if ((byte2 & 0xC0) !== 0x80) {
+          // wrong continuation
+          i--;
+          continue;
+        }
+        if (i >= length) {
+          this.interim[0] = byte1;
+          this.interim[1] = byte2;
+          return size;
+        }
+        byte3 = input[i++];
+        if ((byte3 & 0xC0) !== 0x80) {
+          // wrong continuation
+          i--;
+          continue;
+        }
+        codepoint = (byte1 & 0x0F) << 12 | (byte2 & 0x3F) << 6 | (byte3 & 0x3F);
+        if (codepoint < 0x0800 || (codepoint >= 0xD800 && codepoint <= 0xDFFF)) {
+          // illegal codepoint, no i-- here
+          continue;
+        }
+        target[size++] = codepoint;
+
+        // 4 bytes
+      } else if ((byte1 & 0xF8) === 0xF0) {
+        if (i >= length) {
+          this.interim[0] = byte1;
+          return size;
+        }
+        byte2 = input[i++];
+        if ((byte2 & 0xC0) !== 0x80) {
+          // wrong continuation
+          i--;
+          continue;
+        }
+        if (i >= length) {
+          this.interim[0] = byte1;
+          this.interim[1] = byte2;
+          return size;
+        }
+        byte3 = input[i++];
+        if ((byte3 & 0xC0) !== 0x80) {
+          // wrong continuation
+          i--;
+          continue;
+        }
+        if (i >= length) {
+          this.interim[0] = byte1;
+          this.interim[1] = byte2;
+          this.interim[2] = byte3;
+          return size;
+        }
+        byte4 = input[i++];
+        if ((byte4 & 0xC0) !== 0x80) {
+          // wrong continuation
+          i--;
+          continue;
+        }
+        codepoint = (byte1 & 0x07) << 18 | (byte2 & 0x3F) << 12 | (byte3 & 0x3F) << 6 | (byte4 & 0x3F);
+        if (codepoint < 0x010000 || codepoint > 0x10FFFF) {
+          // illegal codepoint, no i-- here
+          continue;
+        }
+        target[size++] = codepoint;
+      } else {
+        // illegal byte, just skip
+      }
+    }
+    return size;
   }
-  return result;
 }

src/handlers/AltClickHandler.ts

@@ -3,7 +3,8 @@
  * @license MIT
  */
 
-import { ITerminal, IBufferLine } from '../Types';
+import { ITerminal } from '../Types';
+import { IBufferLine } from '../core/Types';
 import { ICircularList } from '../common/Types';
 import { C0 } from '../common/data/EscapeSequences';
 

src/public/AddonManager.test.ts

@@ -0,0 +1,54 @@
+/**
+ * Copyright (c) 2019 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+import { assert } from 'chai';
+import { AddonManager, ILoadedAddon } from './AddonManager';
+import { ITerminalAddon } from 'xterm';
+
+class TestAddonManager extends AddonManager {
+  public get addons(): ILoadedAddon[] {
+    return this._addons;
+  }
+}
+
+describe('AddonManager', () => {
+  let manager: TestAddonManager;
+
+  beforeEach(() => {
+    manager = new TestAddonManager();
+  });
+
+  describe('loadAddon', () => {
+    it('should call addon constructor', () => {
+      let called = false;
+      class Addon implements ITerminalAddon {
+        activate(terminal: any): void {
+          assert.equal(terminal, 'foo', 'The first constructor arg should be Terminal');
+          called = true;
+        }
+        dispose(): void { }
+      }
+      manager.loadAddon('foo' as any, new Addon());
+      assert.equal(called, true);
+    });
+  });
+
+  describe('dispose', () => {
+    it('should dispose all loaded addons', () => {
+      let called = 0;
+      class Addon implements ITerminalAddon {
+        activate(): void {}
+        dispose(): void { called++; }
+      }
+      manager.loadAddon(null, new Addon());
+      manager.loadAddon(null, new Addon());
+      manager.loadAddon(null, new Addon());
+      assert.equal(manager.addons.length, 3);
+      manager.dispose();
+      assert.equal(called, 3);
+      assert.equal(manager.addons.length, 0);
+    });
+  });
+});

src/public/AddonManager.ts

@@ -0,0 +1,56 @@
+/**
+ * Copyright (c) 2019 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+import { ITerminalAddon, IDisposable, Terminal } from 'xterm';
+
+export interface ILoadedAddon {
+  instance: ITerminalAddon;
+  dispose: () => void;
+  isDisposed: boolean;
+}
+
+export class AddonManager implements IDisposable {
+  protected _addons: ILoadedAddon[] = [];
+
+  constructor() {
+  }
+
+  public dispose(): void {
+    for (let i = this._addons.length - 1; i >= 0; i--) {
+      this._addons[i].instance.dispose();
+    }
+  }
+
+  public loadAddon(terminal: Terminal, instance: ITerminalAddon): void {
+    const loadedAddon: ILoadedAddon = {
+      instance,
+      dispose: instance.dispose,
+      isDisposed: false
+    };
+    this._addons.push(loadedAddon);
+    instance.dispose = () => this._wrappedAddonDispose(loadedAddon);
+    instance.activate(<any>terminal);
+  }
+
+  private _wrappedAddonDispose(loadedAddon: ILoadedAddon): void {
+    if (loadedAddon.isDisposed) {
+      // Do nothing if already disposed
+      return;
+    }
+    let index = -1;
+    for (let i = 0; i < this._addons.length; i++) {
+      if (this._addons[i] === loadedAddon) {
+        index = i;
+        break;
+      }
+    }
+    if (index === -1) {
+      throw new Error('Could not dispose an addon that has not been loaded');
+    }
+    loadedAddon.isDisposed = true;
+    loadedAddon.dispose.apply(loadedAddon.instance);
+    this._addons.splice(index, 1);
+  }
+}

src/public/Terminal.api.ts

@@ -0,0 +1,459 @@
+/**
+ * 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('API 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 });
+  });
+
+  after(() => {
+    browser.close();
+  });
+
+  beforeEach(async () => {
+    await page.goto(APP);
+  });
+
+  it('Default options', async function(): Promise<any> {
+    await openTerminal();
+    assert.equal(await page.evaluate(`window.term.cols`), 80);
+    assert.equal(await page.evaluate(`window.term.rows`), 24);
+  });
+
+  it('write', async function(): Promise<any> {
+    await openTerminal();
+    await page.evaluate(`
+      window.term.write('foo');
+      window.term.write('bar');
+      window.term.write('文');
+    `);
+    assert.equal(await page.evaluate(`window.term.buffer.getLine(0).translateToString(true)`), 'foobar文');
+  });
+
+  it('writeln', async function(): Promise<any> {
+    await openTerminal();
+    await page.evaluate(`
+      window.term.writeln('foo');
+      window.term.writeln('bar');
+      window.term.writeln('文');
+    `);
+    assert.equal(await page.evaluate(`window.term.buffer.getLine(0).translateToString(true)`), 'foo');
+    assert.equal(await page.evaluate(`window.term.buffer.getLine(1).translateToString(true)`), 'bar');
+    assert.equal(await page.evaluate(`window.term.buffer.getLine(2).translateToString(true)`), '文');
+  });
+
+  it('writeUtf8', async function(): Promise<any> {
+    await openTerminal();
+    await page.evaluate(`
+      // foo
+      window.term.writeUtf8(new Uint8Array([102, 111, 111]));
+      // bar
+      window.term.writeUtf8(new Uint8Array([98, 97, 114]));
+      // 文
+      window.term.writeUtf8(new Uint8Array([230, 150, 135]));
+    `);
+    assert.equal(await page.evaluate(`window.term.buffer.getLine(0).translateToString(true)`), 'foobar文');
+  });
+
+  it('clear', async function(): Promise<any> {
+    await openTerminal({ rows: 5 });
+    await page.evaluate(`
+      window.term.write('test0');
+      for (let i = 1; i < 10; i++) {
+        window.term.write('\\n\\rtest' + i);
+      }
+    `);
+    await page.evaluate(`window.term.clear()`);
+    assert.equal(await page.evaluate(`window.term.buffer.length`), '5');
+    assert.equal(await page.evaluate(`window.term.buffer.getLine(0).translateToString(true)`), 'test9');
+    for (let i = 1; i < 5; i++) {
+      assert.equal(await page.evaluate(`window.term.buffer.getLine(${i}).translateToString(true)`), '');
+    }
+  });
+
+  it('getOption, setOption', async function(): Promise<any> {
+    await openTerminal();
+    assert.equal(await page.evaluate(`window.term.getOption('rendererType')`), 'canvas');
+    await page.evaluate(`window.term.setOption('rendererType', 'dom')`);
+    assert.equal(await page.evaluate(`window.term.getOption('rendererType')`), 'dom');
+  });
+
+  describe('renderer', () => {
+    it('foreground', async function(): Promise<any> {
+      await openTerminal({ rendererType: 'dom' });
+      await page.evaluate(`window.term.write('\\x1b[30m0\\x1b[31m1\\x1b[32m2\\x1b[33m3\\x1b[34m4\\x1b[35m5\\x1b[36m6\\x1b[37m7')`);
+      assert.deepEqual(await page.evaluate(`
+        [
+          document.querySelector('.xterm-rows > :nth-child(1) > :nth-child(1)').className,
+          document.querySelector('.xterm-rows > :nth-child(1) > :nth-child(2)').className,
+          document.querySelector('.xterm-rows > :nth-child(1) > :nth-child(3)').className,
+          document.querySelector('.xterm-rows > :nth-child(1) > :nth-child(4)').className,
+          document.querySelector('.xterm-rows > :nth-child(1) > :nth-child(5)').className,
+          document.querySelector('.xterm-rows > :nth-child(1) > :nth-child(6)').className,
+          document.querySelector('.xterm-rows > :nth-child(1) > :nth-child(7)').className
+        ]
+      `), [
+        'xterm-fg-0',
+        'xterm-fg-1',
+        'xterm-fg-2',
+        'xterm-fg-3',
+        'xterm-fg-4',
+        'xterm-fg-5',
+        'xterm-fg-6'
+      ]);
+    });
+
+    it('background', async function(): Promise<any> {
+      await openTerminal({ rendererType: 'dom' });
+      await page.evaluate(`window.term.write('\\x1b[40m0\\x1b[41m1\\x1b[42m2\\x1b[43m3\\x1b[44m4\\x1b[45m5\\x1b[46m6\\x1b[47m7')`);
+      assert.deepEqual(await page.evaluate(`
+        [
+          document.querySelector('.xterm-rows > :nth-child(1) > :nth-child(1)').className,
+          document.querySelector('.xterm-rows > :nth-child(1) > :nth-child(2)').className,
+          document.querySelector('.xterm-rows > :nth-child(1) > :nth-child(3)').className,
+          document.querySelector('.xterm-rows > :nth-child(1) > :nth-child(4)').className,
+          document.querySelector('.xterm-rows > :nth-child(1) > :nth-child(5)').className,
+          document.querySelector('.xterm-rows > :nth-child(1) > :nth-child(6)').className,
+          document.querySelector('.xterm-rows > :nth-child(1) > :nth-child(7)').className
+        ]
+      `), [
+        'xterm-bg-0',
+        'xterm-bg-1',
+        'xterm-bg-2',
+        'xterm-bg-3',
+        'xterm-bg-4',
+        'xterm-bg-5',
+        'xterm-bg-6'
+      ]);
+    });
+  });
+
+  it('selection', async function(): Promise<any> {
+    await openTerminal({ rows: 5, cols: 5 });
+    await page.evaluate(`window.term.write('\\n\\nfoo\\n\\n\\rbar\\n\\n\\rbaz')`);
+    assert.equal(await page.evaluate(`window.term.hasSelection()`), false);
+    assert.equal(await page.evaluate(`window.term.getSelection()`), '');
+    assert.deepEqual(await page.evaluate(`window.term.getSelectionPosition()`), undefined);
+    await page.evaluate(`window.term.selectAll()`);
+    assert.equal(await page.evaluate(`window.term.hasSelection()`), true);
+    assert.equal(await page.evaluate(`window.term.getSelection()`), '\n\nfoo\n\nbar\n\nbaz');
+    assert.deepEqual(await page.evaluate(`window.term.getSelectionPosition()`), { startColumn: 0, startRow: 0, endColumn: 5, endRow: 6 });
+    await page.evaluate(`window.term.clearSelection()`);
+    assert.equal(await page.evaluate(`window.term.hasSelection()`), false);
+    assert.equal(await page.evaluate(`window.term.getSelection()`), '');
+    assert.deepEqual(await page.evaluate(`window.term.getSelectionPosition()`), undefined);
+    await page.evaluate(`window.term.select(1, 2, 2)`);
+    assert.equal(await page.evaluate(`window.term.hasSelection()`), true);
+    assert.equal(await page.evaluate(`window.term.getSelection()`), 'oo');
+    assert.deepEqual(await page.evaluate(`window.term.getSelectionPosition()`), { startColumn: 1, startRow: 2, endColumn: 3, endRow: 2 });
+  });
+
+  it('focus, blur', async function(): Promise<any> {
+    await openTerminal();
+    assert.equal(await page.evaluate(`document.activeElement.className`), '');
+    await page.evaluate(`window.term.focus()`);
+    assert.equal(await page.evaluate(`document.activeElement.className`), 'xterm-helper-textarea');
+    await page.evaluate(`window.term.blur()`);
+    assert.equal(await page.evaluate(`document.activeElement.className`), '');
+  });
+
+  describe('loadAddon', () => {
+    it('constructor', async function(): Promise<any> {
+      await openTerminal({ cols: 5 });
+      await page.evaluate(`
+        window.cols = 0;
+        window.term.loadAddon({
+          activate: (t) => window.cols = t.cols,
+          dispose: () => {}
+        });
+      `);
+      assert.equal(await page.evaluate(`window.cols`), 5);
+    });
+
+    it('dispose (addon)', async function(): Promise<any> {
+      await openTerminal();
+      await page.evaluate(`
+        window.disposeCalled = false
+        window.addon = {
+          activate: () => {},
+          dispose: () => window.disposeCalled = true
+        };
+        window.term.loadAddon(window.addon);
+      `);
+      assert.equal(await page.evaluate(`window.disposeCalled`), false);
+      await page.evaluate(`window.addon.dispose()`);
+      assert.equal(await page.evaluate(`window.disposeCalled`), true);
+    });
+
+    it('dispose (terminal)', async function(): Promise<any> {
+      await openTerminal();
+      await page.evaluate(`
+        window.disposeCalled = false
+        window.term.loadAddon({
+          activate: () => {},
+          dispose: () => window.disposeCalled = true
+        });
+      `);
+      assert.equal(await page.evaluate(`window.disposeCalled`), false);
+      await page.evaluate(`window.term.dispose()`);
+      assert.equal(await page.evaluate(`window.disposeCalled`), true);
+    });
+  });
+
+  describe('Events', () => {
+    it('onCursorMove', async function(): Promise<any> {
+      await openTerminal();
+      await page.evaluate(`
+        window.callCount = 0;
+        window.term.onCursorMove(e => window.callCount++);
+        window.term.write('foo');
+      `);
+      assert.equal(await page.evaluate(`window.callCount`), 1);
+      await page.evaluate(`window.term.write('bar')`);
+      assert.equal(await page.evaluate(`window.callCount`), 2);
+    });
+
+    it('onData', async function(): Promise<any> {
+      await openTerminal();
+      await page.evaluate(`
+        window.calls = [];
+        window.term.onData(e => calls.push(e));
+      `);
+      await page.type('.xterm-helper-textarea', 'foo');
+      assert.deepEqual(await page.evaluate(`window.calls`), ['f', 'o', 'o']);
+    });
+
+    it('onKey', async function(): Promise<any> {
+      await openTerminal();
+      await page.evaluate(`
+        window.calls = [];
+        window.term.onKey(e => calls.push(e.key));
+      `);
+      await page.type('.xterm-helper-textarea', 'foo');
+      assert.deepEqual(await page.evaluate(`window.calls`), ['f', 'o', 'o']);
+    });
+
+    it('onLineFeed', async function(): Promise<any> {
+      await openTerminal();
+      await page.evaluate(`
+        window.callCount = 0;
+        window.term.onLineFeed(() => callCount++);
+        window.term.writeln('foo');
+      `);
+      assert.equal(await page.evaluate(`window.callCount`), 1);
+      await page.evaluate(`window.term.writeln('bar')`);
+      assert.equal(await page.evaluate(`window.callCount`), 2);
+    });
+
+    it('onScroll', async function(): Promise<any> {
+      await openTerminal({ rows: 5 });
+      await page.evaluate(`
+        window.calls = [];
+        window.term.onScroll(e => window.calls.push(e));
+        for (let i = 0; i < 4; i++) {
+          window.term.writeln('foo');
+        }
+      `);
+      assert.deepEqual(await page.evaluate(`window.calls`), []);
+      await page.evaluate(`window.term.writeln('bar')`);
+      assert.deepEqual(await page.evaluate(`window.calls`), [1]);
+      await page.evaluate(`window.term.writeln('baz')`);
+      assert.deepEqual(await page.evaluate(`window.calls`), [1, 2]);
+    });
+
+    it('onSelectionChange', async function(): Promise<any> {
+      await openTerminal();
+      await page.evaluate(`
+        window.callCount = 0;
+        window.term.onSelectionChange(() => window.callCount++);
+      `);
+      assert.equal(await page.evaluate(`window.callCount`), 0);
+      await page.evaluate(`window.term.selectAll()`);
+      assert.equal(await page.evaluate(`window.callCount`), 1);
+      await page.evaluate(`window.term.clearSelection()`);
+      assert.equal(await page.evaluate(`window.callCount`), 2);
+    });
+
+    it('onRender', async function(): Promise<any> {
+      await openTerminal();
+      await page.evaluate(`
+        window.calls = [];
+        window.term.onRender(e => window.calls.push([e.start, e.end]));
+      `);
+      assert.deepEqual(await page.evaluate(`window.calls`), []);
+      await page.evaluate(`window.term.write('foo')`);
+      assert.deepEqual(await page.evaluate(`window.calls`), [[0, 0]]);
+      await page.evaluate(`window.term.write('bar\\n\\nbaz')`);
+      assert.deepEqual(await page.evaluate(`window.calls`), [[0, 0], [0, 2]]);
+    });
+
+    it('onResize', async function(): Promise<any> {
+      await openTerminal();
+      await page.evaluate(`
+        window.calls = [];
+        window.term.onResize(e => window.calls.push([e.cols, e.rows]));
+      `);
+      assert.deepEqual(await page.evaluate(`window.calls`), []);
+      await page.evaluate(`window.term.resize(10, 5)`);
+      assert.deepEqual(await page.evaluate(`window.calls`), [[10, 5]]);
+      await page.evaluate(`window.term.resize(20, 15)`);
+      assert.deepEqual(await page.evaluate(`window.calls`), [[10, 5], [20, 15]]);
+    });
+
+    it('onTitleChange', async function(): Promise<any> {
+      await openTerminal();
+      await page.evaluate(`
+        window.calls = [];
+        window.term.onTitleChange(e => window.calls.push(e));
+      `);
+      assert.deepEqual(await page.evaluate(`window.calls`), []);
+      await page.evaluate(`window.term.write('\\x1b]2;foo\\x9c')`);
+      assert.deepEqual(await page.evaluate(`window.calls`), ['foo']);
+    });
+  });
+
+  describe('buffer', () => {
+    it('cursorX, cursorY', async function(): Promise<any> {
+      await openTerminal({ rows: 5, cols: 5 });
+      assert.equal(await page.evaluate(`window.term.buffer.cursorX`), 0);
+      assert.equal(await page.evaluate(`window.term.buffer.cursorY`), 0);
+      await page.evaluate(`window.term.write('foo')`);
+      assert.equal(await page.evaluate(`window.term.buffer.cursorX`), 3);
+      assert.equal(await page.evaluate(`window.term.buffer.cursorY`), 0);
+      await page.evaluate(`window.term.write('\\n')`);
+      assert.equal(await page.evaluate(`window.term.buffer.cursorX`), 3);
+      assert.equal(await page.evaluate(`window.term.buffer.cursorY`), 1);
+      await page.evaluate(`window.term.write('\\r')`);
+      assert.equal(await page.evaluate(`window.term.buffer.cursorX`), 0);
+      assert.equal(await page.evaluate(`window.term.buffer.cursorY`), 1);
+      await page.evaluate(`window.term.write('abcde')`);
+      assert.equal(await page.evaluate(`window.term.buffer.cursorX`), 5);
+      assert.equal(await page.evaluate(`window.term.buffer.cursorY`), 1);
+      await page.evaluate(`window.term.write('\\n\\r\\n\\n\\n\\n\\n')`);
+      assert.equal(await page.evaluate(`window.term.buffer.cursorX`), 0);
+      assert.equal(await page.evaluate(`window.term.buffer.cursorY`), 4);
+    });
+
+    it('viewportY', async function(): Promise<any> {
+      await openTerminal({ rows: 5 });
+      assert.equal(await page.evaluate(`window.term.buffer.viewportY`), 0);
+      await page.evaluate(`window.term.write('\\n\\n\\n\\n')`);
+      assert.equal(await page.evaluate(`window.term.buffer.viewportY`), 0);
+      await page.evaluate(`window.term.write('\\n')`);
+      assert.equal(await page.evaluate(`window.term.buffer.viewportY`), 1);
+      await page.evaluate(`window.term.write('\\n\\n\\n\\n')`);
+      assert.equal(await page.evaluate(`window.term.buffer.viewportY`), 5);
+      await page.evaluate(`window.term.scrollLines(-1)`);
+      assert.equal(await page.evaluate(`window.term.buffer.viewportY`), 4);
+      await page.evaluate(`window.term.scrollToTop()`);
+      assert.equal(await page.evaluate(`window.term.buffer.viewportY`), 0);
+    });
+
+    it('baseY', async function(): Promise<any> {
+      await openTerminal({ rows: 5 });
+      assert.equal(await page.evaluate(`window.term.buffer.baseY`), 0);
+      await page.evaluate(`window.term.write('\\n\\n\\n\\n')`);
+      assert.equal(await page.evaluate(`window.term.buffer.baseY`), 0);
+      await page.evaluate(`window.term.write('\\n')`);
+      assert.equal(await page.evaluate(`window.term.buffer.baseY`), 1);
+      await page.evaluate(`window.term.write('\\n\\n\\n\\n')`);
+      assert.equal(await page.evaluate(`window.term.buffer.baseY`), 5);
+      await page.evaluate(`window.term.scrollLines(-1)`);
+      assert.equal(await page.evaluate(`window.term.buffer.baseY`), 5);
+      await page.evaluate(`window.term.scrollToTop()`);
+      assert.equal(await page.evaluate(`window.term.buffer.baseY`), 5);
+    });
+
+    it('length', async function(): Promise<any> {
+      await openTerminal({ rows: 5 });
+      assert.equal(await page.evaluate(`window.term.buffer.length`), 5);
+      await page.evaluate(`window.term.write('\\n\\n\\n\\n')`);
+      assert.equal(await page.evaluate(`window.term.buffer.length`), 5);
+      await page.evaluate(`window.term.write('\\n')`);
+      assert.equal(await page.evaluate(`window.term.buffer.length`), 6);
+      await page.evaluate(`window.term.write('\\n\\n\\n\\n')`);
+      assert.equal(await page.evaluate(`window.term.buffer.length`), 10);
+    });
+
+    describe('getLine', () => {
+      it('invalid index', async function(): Promise<any> {
+        await openTerminal({ rows: 5 });
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(-1)`), undefined);
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(5)`), undefined);
+      });
+
+      it('isWrapped', async function(): Promise<any> {
+        await openTerminal({ cols: 5 });
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).isWrapped`), false);
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(1).isWrapped`), false);
+        await page.evaluate(`window.term.write('abcde')`);
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).isWrapped`), false);
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(1).isWrapped`), false);
+        await page.evaluate(`window.term.write('f')`);
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).isWrapped`), false);
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(1).isWrapped`), true);
+      });
+
+      it('translateToString', async function(): Promise<any> {
+        await openTerminal({ cols: 5 });
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).translateToString()`), '     ');
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).translateToString(true)`), '');
+        await page.evaluate(`window.term.write('foo')`);
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).translateToString()`), 'foo  ');
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).translateToString(true)`), 'foo');
+        await page.evaluate(`window.term.write('bar')`);
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).translateToString()`), 'fooba');
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).translateToString(true)`), 'fooba');
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(1).translateToString(true)`), 'r');
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).translateToString(false, 1)`), 'ooba');
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).translateToString(false, 1, 3)`), 'oo');
+      });
+
+      it('getCell', async function(): Promise<any> {
+        await openTerminal({ cols: 5 });
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).getCell(-1)`), undefined);
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).getCell(5)`), undefined);
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).getCell(0).char`), '');
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).getCell(0).width`), 1);
+        await page.evaluate(`window.term.write('a文')`);
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).getCell(0).char`), 'a');
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).getCell(0).width`), 1);
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).getCell(1).char`), '文');
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).getCell(1).width`), 2);
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).getCell(2).char`), '');
+        assert.equal(await page.evaluate(`window.term.buffer.getLine(0).getCell(2).width`), 0);
+      });
+    });
+  });
+});
+
+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');
+  }
+}

src/public/Terminal.test.ts

@@ -7,7 +7,7 @@ import { assert } from 'chai';
 import { Terminal } from './Terminal';
 import * as attach from '../addons/attach/attach';
 
-describe('Terminal', () => {
+ describe('Terminal', () => {
   it('should apply addons with Terminal.applyAddon', () => {
     Terminal.applyAddon(attach);
     // Test that addon was applied successfully, adding attach to Terminal's

src/public/Terminal.ts

@@ -3,17 +3,21 @@
  * @license MIT
  */
 
-import { Terminal as ITerminalApi, ITerminalOptions, IMarker, IDisposable, ILinkMatcherOptions, ITheme, ILocalizableStrings } from 'xterm';
-import { ITerminal } from '../Types';
+import { Terminal as ITerminalApi, ITerminalOptions, IMarker, IDisposable, ILinkMatcherOptions, ITheme, ILocalizableStrings, ITerminalAddon, ISelectionPosition, IBuffer as IBufferApi, IBufferLine as IBufferLineApi, IBufferCell as IBufferCellApi } from 'xterm';
+import { ITerminal, IBuffer } from '../Types';
+import { IBufferLine } from '../core/Types';
 import { Terminal as TerminalCore } from '../Terminal';
 import * as Strings from '../Strings';
 import { IEvent } from '../common/EventEmitter2';
+import { AddonManager } from './AddonManager';
 
 export class Terminal implements ITerminalApi {
   private _core: ITerminal;
+  private _addonManager: AddonManager;
 
   constructor(options?: ITerminalOptions) {
     this._core = new TerminalCore(options);
+    this._addonManager = new AddonManager();
   }
 
   public get onCursorMove(): IEvent<void> { return this._core.onCursorMove; }
@@ -30,6 +34,7 @@ export class Terminal implements ITerminalApi {
   public get textarea(): HTMLTextAreaElement { return this._core.textarea; }
   public get rows(): number { return this._core.rows; }
   public get cols(): number { return this._core.cols; }
+  public get buffer(): IBufferApi { return new BufferApiView(this._core.buffer); }
   public get markers(): ReadonlyArray<IMarker> { return this._core.markers; }
   public blur(): void {
     this._core.blur();
@@ -94,9 +99,15 @@ export class Terminal implements ITerminalApi {
   public hasSelection(): boolean {
     return this._core.hasSelection();
   }
+  public select(column: number, row: number, length: number): void {
+    this._core.select(column, row, length);
+  }
   public getSelection(): string {
     return this._core.getSelection();
   }
+  public getSelectionPosition(): ISelectionPosition | undefined {
+    return this._core.getSelectionPosition();
+  }
   public clearSelection(): void {
     this._core.clearSelection();
   }
@@ -107,6 +118,7 @@ export class Terminal implements ITerminalApi {
     this._core.selectLines(start, end);
   }
   public dispose(): void {
+    this._addonManager.dispose();
     this._core.dispose();
   }
   public destroy(): void {
@@ -133,6 +145,9 @@ export class Terminal implements ITerminalApi {
   public write(data: string): void {
     this._core.write(data);
   }
+  public writeUtf8(data: Uint8Array): void {
+    this._core.writeUtf8(data);
+  }
   public getOption(key: 'bellSound' | 'bellStyle' | 'cursorStyle' | 'fontFamily' | 'fontWeight' | 'fontWeightBold' | 'rendererType' | 'termName'): string;
   public getOption(key: 'allowTransparency' | 'cancelEvents' | 'convertEol' | 'cursorBlink' | 'debug' | 'disableStdin' | 'enableBold' | 'macOptionIsMeta' | 'rightClickSelectsWord' | 'popOnBell' | 'screenKeys' | 'useFlowControl' | 'visualBell'): boolean;
   public getOption(key: 'colors'): string[];
@@ -165,7 +180,48 @@ export class Terminal implements ITerminalApi {
   public static applyAddon(addon: any): void {
     addon.apply(Terminal);
   }
+  public loadAddon(addon: ITerminalAddon): void {
+    return this._addonManager.loadAddon(this, addon);
+  }
   public static get strings(): ILocalizableStrings {
     return Strings;
   }
 }
+
+class BufferApiView implements IBufferApi {
+  constructor(private _buffer: IBuffer) {}
+
+  public get cursorY(): number { return this._buffer.y; }
+  public get cursorX(): number { return this._buffer.x; }
+  public get viewportY(): number { return this._buffer.ydisp; }
+  public get baseY(): number { return this._buffer.ybase; }
+  public get length(): number { return this._buffer.lines.length; }
+  public getLine(y: number): IBufferLineApi | undefined {
+    const line = this._buffer.lines.get(y);
+    if (!line) {
+      return undefined;
+    }
+    return new BufferLineApiView(line);
+  }
+}
+
+class BufferLineApiView implements IBufferLineApi {
+  constructor(private _line: IBufferLine) {}
+
+  public get isWrapped(): boolean { return this._line.isWrapped; }
+  public getCell(x: number): IBufferCellApi | undefined {
+    if (x < 0 || x >= this._line.length) {
+      return undefined;
+    }
+    return new BufferCellApiView(this._line, x);
+  }
+  public translateToString(trimRight?: boolean, startColumn?: number, endColumn?: number): string {
+    return this._line.translateToString(trimRight, startColumn, endColumn);
+  }
+}
+
+class BufferCellApiView implements IBufferCellApi {
+  constructor(private _line: IBufferLine, private _x: number) {}
+  public get char(): string { return this._line.getString(this._x); }
+  public get width(): number { return this._line.getWidth(this._x); }
+}

src/renderer/BaseRenderLayer.ts

@@ -3,14 +3,15 @@
  * @license MIT
  */
 
-import { IRenderLayer, IColorSet, IRenderDimensions } from './Types';
-import { ITerminal, ICellData } from '../Types';
-import { DIM_OPACITY, INVERTED_DEFAULT_COLOR, IGlyphIdentifier, DEFAULT_COLOR } from './atlas/Types';
+import { IRenderLayer, IRenderDimensions } from './Types';
+import { ITerminal } from '../Types';
+import { ICellData } from '../core/Types';
+import { DEFAULT_COLOR } from '../common/Types';
+import { DIM_OPACITY, INVERTED_DEFAULT_COLOR, IGlyphIdentifier } from './atlas/Types';
 import BaseCharAtlas from './atlas/BaseCharAtlas';
 import { acquireCharAtlas } from './atlas/CharAtlasCache';
-import { CellData, AttributeData } from '../BufferLine';
-import { WHITESPACE_CELL_CHAR, WHITESPACE_CELL_CODE } from '../Buffer';
-import { JoinedCellData } from './CharacterJoinerRegistry';
+import { CellData, AttributeData, WHITESPACE_CELL_CHAR, WHITESPACE_CELL_CODE } from '../core/buffer/BufferLine';
+import { IColorSet } from '../ui/Types';
 
 export abstract class BaseRenderLayer implements IRenderLayer {
   private _canvas: HTMLCanvasElement;
@@ -73,7 +74,7 @@ export abstract class BaseRenderLayer implements IRenderLayer {
   public onGridChanged(terminal: ITerminal, startRow: number, endRow: number): void {}
   public onSelectionChanged(terminal: ITerminal, start: [number, number], end: [number, number], columnSelectMode: boolean = false): void {}
 
-  public onThemeChanged(terminal: ITerminal, colorSet: IColorSet): void {
+  public setColors(terminal: ITerminal, colorSet: IColorSet): void {
     this._refreshCharAtlas(terminal, colorSet);
   }
 
@@ -263,9 +264,9 @@ export abstract class BaseRenderLayer implements IRenderLayer {
 
     // skip cache right away if we draw in RGB
     // Note: to avoid bad runtime JoinedCellData will be skipped
-    //       in the cache handler (atlasDidDraw == false) itself and
+    //       in the cache handler itself (atlasDidDraw == false) and
     //       fall through to uncached later down below
-    if (cell.isFgRGB() || cell.isBgRGB() || cell instanceof JoinedCellData) {
+    if (cell.isFgRGB() || cell.isBgRGB()) {
       this._drawUncachedChars(terminal, cell, x, y);
       return;
     }

src/renderer/CharacterJoinerRegistry.test.ts

@@ -1,3 +1,8 @@
+/**
+ * Copyright (c) 2018 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
 import { assert } from 'chai';
 
 import { MockTerminal, MockBuffer } from '../TestUtils.test';
@@ -5,8 +10,8 @@ import { CircularList } from '../common/CircularList';
 
 import { ICharacterJoinerRegistry } from './Types';
 import { CharacterJoinerRegistry } from './CharacterJoinerRegistry';
-import { BufferLine, CellData } from '../BufferLine';
-import { IBufferLine } from '../Types';
+import { BufferLine, CellData } from '../core/buffer/BufferLine';
+import { IBufferLine } from '../core/Types';
 
 describe('CharacterJoinerRegistry', () => {
   let registry: ICharacterJoinerRegistry;

src/renderer/CharacterJoinerRegistry.ts

@@ -1,7 +1,12 @@
-import { ITerminal, IBufferLine, ICellData, CharData } from '../Types';
+/**
+ * Copyright (c) 2018 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+import { ITerminal } from '../Types';
+import { IBufferLine, ICellData, CharData } from '../core/Types';
 import { ICharacterJoinerRegistry, ICharacterJoiner } from './Types';
-import { CellData, Content, AttributeData } from '../BufferLine';
-import { WHITESPACE_CELL_CHAR } from '../Buffer';
+import { CellData, Content, AttributeData, WHITESPACE_CELL_CHAR } from '../core/buffer/BufferLine';
 
 export class JoinedCellData extends AttributeData implements ICellData {
   private _width: number;

src/renderer/CursorRenderLayer.ts

@@ -3,10 +3,12 @@
  * @license MIT
  */
 
-import { IColorSet, IRenderDimensions } from './Types';
+import { IRenderDimensions } from './Types';
 import { BaseRenderLayer } from './BaseRenderLayer';
-import { ITerminal, ICellData } from '../Types';
-import { CellData } from '../BufferLine';
+import { ITerminal } from '../Types';
+import { ICellData } from '../core/Types';
+import { CellData } from '../core/buffer/BufferLine';
+import { IColorSet } from '../ui/Types';
 
 interface ICursorState {
   x: number;

src/renderer/LinkRenderLayer.ts

@@ -4,10 +4,11 @@
  */
 
 import { ILinkifierEvent, ITerminal, ILinkifierAccessor } from '../Types';
-import { IColorSet, IRenderDimensions } from './Types';
+import { IRenderDimensions } from './Types';
 import { BaseRenderLayer } from './BaseRenderLayer';
 import { INVERTED_DEFAULT_COLOR } from './atlas/Types';
 import { is256Color } from './atlas/CharAtlasUtils';
+import { IColorSet } from '../ui/Types';
 
 export class LinkRenderLayer extends BaseRenderLayer {
   private _state: ILinkifierEvent = null;

src/renderer/RenderCoordinator.ts

@@ -0,0 +1,162 @@
+/**
+ * Copyright (c) 2019 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+import { IRenderer, IRenderDimensions } from './Types';
+import { RenderDebouncer } from '../ui/RenderDebouncer';
+import { EventEmitter2, IEvent } from '../common/EventEmitter2';
+import { Disposable } from '../common/Lifecycle';
+import { ScreenDprMonitor } from '../ui/ScreenDprMonitor';
+import { addDisposableDomListener } from '../ui/Lifecycle';
+import { IColorSet } from '..//ui/Types';
+import { CharacterJoinerHandler } from '../Types';
+
+export class RenderCoordinator extends Disposable {
+  private _renderDebouncer: RenderDebouncer;
+  private _screenDprMonitor: ScreenDprMonitor;
+
+  private _isPaused: boolean = false;
+  private _needsFullRefresh: boolean = false;
+  private _canvasWidth: number = 0;
+  private _canvasHeight: number = 0;
+
+  private _onDimensionsChange = new EventEmitter2<IRenderDimensions>();
+  public get onDimensionsChange(): IEvent<IRenderDimensions> { return this._onDimensionsChange.event; }
+  private _onRender = new EventEmitter2<{ start: number, end: number }>();
+  public get onRender(): IEvent<{ start: number, end: number }> { return this._onRender.event; }
+  private _onRefreshRequest = new EventEmitter2<{ start: number, end: number }>();
+  public get onRefreshRequest(): IEvent<{ start: number, end: number }> { return this._onRefreshRequest.event; }
+
+  public get dimensions(): IRenderDimensions { return this._renderer.dimensions; }
+
+  constructor(
+    private _renderer: IRenderer,
+    private _rowCount: number,
+    screenElement: HTMLElement
+  ) {
+    super();
+    this._renderDebouncer = new RenderDebouncer((start, end) => this._renderRows(start, end));
+    this.register(this._renderDebouncer);
+
+    this._screenDprMonitor = new ScreenDprMonitor();
+    this._screenDprMonitor.setListener(() => this._renderer.onDevicePixelRatioChange());
+    this.register(this._screenDprMonitor);
+
+    // dprchange should handle this case, we need this as well for browsers that don't support the
+    // matchMedia query.
+    this.register(addDisposableDomListener(window, 'resize', () => this._renderer.onDevicePixelRatioChange()));
+
+    // Detect whether IntersectionObserver is detected and enable renderer pause
+    // and resume based on terminal visibility if so
+    if ('IntersectionObserver' in window) {
+      const observer = new IntersectionObserver(e => this._onIntersectionChange(e[e.length - 1]), { threshold: 0 });
+      observer.observe(screenElement);
+      this.register({ dispose: () => observer.disconnect() });
+    }
+  }
+
+  private _onIntersectionChange(entry: IntersectionObserverEntry): void {
+    this._isPaused = entry.intersectionRatio === 0;
+    if (!this._isPaused && this._needsFullRefresh) {
+      this.refreshRows(0, this._rowCount - 1);
+      this._needsFullRefresh = false;
+    }
+  }
+
+  public refreshRows(start: number, end: number): void {
+    if (this._isPaused) {
+      this._needsFullRefresh = true;
+      return;
+    }
+    this._renderDebouncer.refresh(start, end, this._rowCount);
+  }
+
+  private _renderRows(start: number, end: number): void {
+    this._renderer.renderRows(start, end);
+    this._onRender.fire({ start, end });
+  }
+
+  public resize(cols: number, rows: number): void {
+    this._rowCount = rows;
+    this._fireOnCanvasResize();
+  }
+
+  public changeOptions(): void {
+    this._renderer.onOptionsChanged();
+    this._fireOnCanvasResize();
+  }
+
+  private _fireOnCanvasResize(): void {
+    // Don't fire the event if the dimensions haven't changed
+    if (this._renderer.dimensions.canvasWidth === this._canvasWidth && this._renderer.dimensions.canvasHeight === this._canvasHeight) {
+      return;
+    }
+    this._onDimensionsChange.fire(this._renderer.dimensions);
+  }
+
+  public setRenderer(renderer: IRenderer): void {
+    // TODO: RenderCoordinator should be the only one to dispose the renderer
+    this._renderer.dispose();
+    this._renderer = renderer;
+  }
+
+  private _fullRefresh(): void {
+    if (this._isPaused) {
+      this._needsFullRefresh = true;
+    } else {
+      this.refreshRows(0, this._rowCount);
+    }
+  }
+
+  public setColors(colors: IColorSet): void {
+    this._renderer.setColors(colors);
+    this._fullRefresh();
+  }
+
+  public onDevicePixelRatioChange(): void {
+    this._renderer.onDevicePixelRatioChange();
+  }
+
+  public onResize(cols: number, rows: number): void {
+    this._renderer.onResize(cols, rows);
+    this._fullRefresh();
+  }
+
+  // TODO: Is this useful when we have onResize?
+  public onCharSizeChanged(): void {
+    this._renderer.onCharSizeChanged();
+  }
+
+  public onBlur(): void {
+    this._renderer.onBlur();
+  }
+
+  public onFocus(): void {
+    this._renderer.onFocus();
+  }
+
+  public onSelectionChanged(start: [number, number], end: [number, number], columnSelectMode: boolean): void {
+    this._renderer.onSelectionChanged(start, end, columnSelectMode);
+  }
+
+  public onCursorMove(): void {
+    this._renderer.onCursorMove();
+  }
+
+  public onOptionsChanged(): void {
+    this._renderer.onOptionsChanged();
+  }
+
+  public clear(): void {
+    this._renderer.clear();
+  }
+
+  public registerCharacterJoiner(handler: CharacterJoinerHandler): number {
+    return this._renderer.registerCharacterJoiner(handler);
+  }
+
+  public deregisterCharacterJoiner(joinerId: number): boolean {
+    return this._renderer.deregisterCharacterJoiner(joinerId);
+  }
+}

src/renderer/Renderer.ts

@@ -6,49 +6,33 @@
 import { TextRenderLayer } from './TextRenderLayer';
 import { SelectionRenderLayer } from './SelectionRenderLayer';
 import { CursorRenderLayer } from './CursorRenderLayer';
-import { ColorManager } from './ColorManager';
-import { IRenderLayer, IColorSet, IRenderer, IRenderDimensions, ICharacterJoinerRegistry } from './Types';
+import { IRenderLayer, IRenderer, IRenderDimensions, ICharacterJoinerRegistry } from './Types';
 import { ITerminal, CharacterJoinerHandler } from '../Types';
 import { LinkRenderLayer } from './LinkRenderLayer';
-import { RenderDebouncer } from '../ui/RenderDebouncer';
-import { ScreenDprMonitor } from '../ui/ScreenDprMonitor';
-import { ITheme } from 'xterm';
 import { CharacterJoinerRegistry } from '../renderer/CharacterJoinerRegistry';
-import { EventEmitter2, IEvent } from '../common/EventEmitter2';
 import { Disposable } from '../common/Lifecycle';
+import { IColorSet } from '../ui/Types';
 
 export class Renderer extends Disposable implements IRenderer {
-  private _renderDebouncer: RenderDebouncer;
-
   private _renderLayers: IRenderLayer[];
   private _devicePixelRatio: number;
-  private _screenDprMonitor: ScreenDprMonitor;
-  private _isPaused: boolean = false;
-  private _needsFullRefresh: boolean = false;
   private _characterJoinerRegistry: ICharacterJoinerRegistry;
 
-  public colorManager: ColorManager;
   public dimensions: IRenderDimensions;
 
-  private _onCanvasResize = new EventEmitter2<{ width: number, height: number }>();
-  public get onCanvasResize(): IEvent<{ width: number, height: number }> { return this._onCanvasResize.event; }
-  private _onRender = new EventEmitter2<{ start: number, end: number }>();
-  public get onRender(): IEvent<{ start: number, end: number }> { return this._onRender.event; }
-
-  constructor(private _terminal: ITerminal, theme: ITheme) {
+  constructor(
+    private _terminal: ITerminal,
+    private _colors: IColorSet
+  ) {
     super();
     const allowTransparency = this._terminal.options.allowTransparency;
-    this.colorManager = new ColorManager(document, allowTransparency);
     this._characterJoinerRegistry = new CharacterJoinerRegistry(_terminal);
-    if (theme) {
-      this.colorManager.setTheme(theme);
-    }
 
     this._renderLayers = [
-      new TextRenderLayer(this._terminal.screenElement, 0, this.colorManager.colors, this._characterJoinerRegistry, allowTransparency),
-      new SelectionRenderLayer(this._terminal.screenElement, 1, this.colorManager.colors),
-      new LinkRenderLayer(this._terminal.screenElement, 2, this.colorManager.colors, this._terminal),
-      new CursorRenderLayer(this._terminal.screenElement, 3, this.colorManager.colors)
+      new TextRenderLayer(this._terminal.screenElement, 0, this._colors, this._characterJoinerRegistry, allowTransparency),
+      new SelectionRenderLayer(this._terminal.screenElement, 1, this._colors),
+      new LinkRenderLayer(this._terminal.screenElement, 2, this._colors, this._terminal),
+      new CursorRenderLayer(this._terminal.screenElement, 3, this._colors)
     ];
     this.dimensions = {
       scaledCharWidth: null,
@@ -67,19 +51,6 @@ export class Renderer extends Disposable implements IRenderer {
     this._devicePixelRatio = window.devicePixelRatio;
     this._updateDimensions();
     this.onOptionsChanged();
-
-    this._renderDebouncer = new RenderDebouncer(this._renderRows.bind(this));
-    this._screenDprMonitor = new ScreenDprMonitor();
-    this._screenDprMonitor.setListener(() => this.onWindowResize(window.devicePixelRatio));
-    this.register(this._screenDprMonitor);
-
-    // Detect whether IntersectionObserver is detected and enable renderer pause
-    // and resume based on terminal visibility if so
-    if ('IntersectionObserver' in window) {
-      const observer = new IntersectionObserver(e => this.onIntersectionChange(e[e.length - 1]), { threshold: 0 });
-      observer.observe(this._terminal.element);
-      this.register({ dispose: () => observer.disconnect() });
-    }
   }
 
   public dispose(): void {
@@ -87,39 +58,23 @@ export class Renderer extends Disposable implements IRenderer {
     this._renderLayers.forEach(l => l.dispose());
   }
 
-  public onIntersectionChange(entry: IntersectionObserverEntry): void {
-    this._isPaused = entry.intersectionRatio === 0;
-    if (!this._isPaused && this._needsFullRefresh) {
-      this._terminal.refresh(0, this._terminal.rows - 1);
-      this._needsFullRefresh = false;
-    }
-  }
-
-  public onWindowResize(devicePixelRatio: number): void {
+  public onDevicePixelRatioChange(): void {
     // If the device pixel ratio changed, the char atlas needs to be regenerated
     // and the terminal needs to refreshed
-    if (this._devicePixelRatio !== devicePixelRatio) {
-      this._devicePixelRatio = devicePixelRatio;
+    if (this._devicePixelRatio !== window.devicePixelRatio) {
+      this._devicePixelRatio = window.devicePixelRatio;
       this.onResize(this._terminal.cols, this._terminal.rows);
     }
   }
 
-  public setTheme(theme: ITheme): IColorSet {
-    this.colorManager.setTheme(theme);
+  public setColors(colors: IColorSet): void {
+    this._colors = colors;
 
     // Clear layers and force a full render
     this._renderLayers.forEach(l => {
-      l.onThemeChanged(this._terminal, this.colorManager.colors);
+      l.setColors(this._terminal, this._colors);
       l.reset(this._terminal);
     });
-
-    if (this._isPaused) {
-      this._needsFullRefresh = true;
-    } else {
-      this._terminal.refresh(0, this._terminal.rows - 1);
-    }
-
-    return this.colorManager.colors;
   }
 
   public onResize(cols: number, rows: number): void {
@@ -129,21 +84,9 @@ export class Renderer extends Disposable implements IRenderer {
     // Resize all render layers
     this._renderLayers.forEach(l => l.resize(this._terminal, this.dimensions));
 
-    // Force a refresh
-    if (this._isPaused) {
-      this._needsFullRefresh = true;
-    } else {
-      this._terminal.refresh(0, this._terminal.rows - 1);
-    }
-
     // Resize the screen
     this._terminal.screenElement.style.width = `${this.dimensions.canvasWidth}px`;
     this._terminal.screenElement.style.height = `${this.dimensions.canvasHeight}px`;
-
-    this._onCanvasResize.fire({
-      width: this.dimensions.canvasWidth,
-      height: this.dimensions.canvasHeight
-    });
   }
 
   public onCharSizeChanged(): void {
@@ -167,7 +110,6 @@ export class Renderer extends Disposable implements IRenderer {
   }
 
   public onOptionsChanged(): void {
-    this.colorManager.allowTransparency = this._terminal.options.allowTransparency;
     this._runOperation(l => l.onOptionsChanged(this._terminal));
   }
 
@@ -176,34 +118,15 @@ export class Renderer extends Disposable implements IRenderer {
   }
 
   private _runOperation(operation: (layer: IRenderLayer) => void): void {
-    if (this._isPaused) {
-      this._needsFullRefresh = true;
-    } else {
-      this._renderLayers.forEach(l => operation(l));
-    }
-  }
-
-  /**
-   * Queues a refresh between two rows (inclusive), to be done on next animation
-   * frame.
-   * @param start The start row.
-   * @param end The end row.
-   */
-  public refreshRows(start: number, end: number): void {
-    if (this._isPaused) {
-      this._needsFullRefresh = true;
-      return;
-    }
-    this._renderDebouncer.refresh(start, end, this._terminal.rows);
+    this._renderLayers.forEach(l => operation(l));
   }
 
   /**
    * Performs the refresh loop callback, calling refresh only if a refresh is
    * necessary before queueing up the next one.
    */
-  private _renderRows(start: number, end: number): void {
+  public renderRows(start: number, end: number): void {
     this._renderLayers.forEach(l => l.onGridChanged(this._terminal, start, end));
-    this._onRender.fire({ start, end });
   }
 
   /**

src/renderer/SelectionRenderLayer.ts

@@ -4,8 +4,9 @@
  */
 
 import { ITerminal } from '../Types';
-import { IColorSet, IRenderDimensions } from './Types';
+import { IRenderDimensions } from './Types';
 import { BaseRenderLayer } from './BaseRenderLayer';
+import { IColorSet } from '../ui/Types';
 
 interface ISelectionState {
   start: [number, number];

src/renderer/TextRenderLayer.ts

@@ -3,13 +3,14 @@
  * @license MIT
  */
 
-import { NULL_CELL_CODE } from '../Buffer';
-import { IColorSet, IRenderDimensions, ICharacterJoinerRegistry } from './Types';
-import { CharData, ITerminal, ICellData } from '../Types';
+import { IRenderDimensions, ICharacterJoinerRegistry } from './Types';
+import { ITerminal } from '../Types';
+import { CharData, ICellData } from '../core/Types';
 import { GridCache } from './GridCache';
 import { BaseRenderLayer } from './BaseRenderLayer';
-import { CellData, AttributeData, Content } from '../BufferLine';
+import { CellData, AttributeData, Content, NULL_CELL_CODE } from '../core/buffer/BufferLine';
 import { JoinedCellData } from './CharacterJoinerRegistry';
+import { IColorSet } from '../ui/Types';
 
 /**
  * This CharData looks like a null character, which will forc a clear and render
@@ -204,6 +205,7 @@ export class TextRenderLayer extends BaseRenderLayer {
       if (cell.isInvisible()) {
         return;
       }
+      this.drawChars(terminal, cell, x, y);
       if (cell.isUnderline()) {
         this._ctx.save();
 
@@ -232,7 +234,6 @@ export class TextRenderLayer extends BaseRenderLayer {
         this.fillBottomLineAtCells(x, y, cell.getWidth());
         this._ctx.restore();
       }
-      this.drawChars(terminal, cell, x, y);
     });
   }
 

src/renderer/Types.ts

@@ -4,8 +4,8 @@
  */
 
 import { ITerminal, CharacterJoinerHandler } from '../Types';
-import { ITheme, IDisposable } from 'xterm';
-import { IEvent } from '../common/EventEmitter2';
+import { IDisposable } from 'xterm';
+import { IColorSet } from '../ui/Types';
 
 /**
  * Flags used to render terminal text properly.
@@ -25,15 +25,11 @@ export const enum FLAGS {
  * rendering rows to the screen.
  */
 export interface IRenderer extends IDisposable {
-  dimensions: IRenderDimensions;
-  colorManager: IColorManager;
-
-  onCanvasResize: IEvent<{ width: number, height: number }>;
-  onRender: IEvent<{ start: number, end: number }>;
+  readonly dimensions: IRenderDimensions;
 
   dispose(): void;
-  setTheme(theme: ITheme): IColorSet;
-  onWindowResize(devicePixelRatio: number): void;
+  setColors(colors: IColorSet): void;
+  onDevicePixelRatioChange(): void;
   onResize(cols: number, rows: number): void;
   onCharSizeChanged(): void;
   onBlur(): void;
@@ -42,15 +38,11 @@ export interface IRenderer extends IDisposable {
   onCursorMove(): void;
   onOptionsChanged(): void;
   clear(): void;
-  refreshRows(start: number, end: number): void;
+  renderRows(start: number, end: number): void;
   registerCharacterJoiner(handler: CharacterJoinerHandler): number;
   deregisterCharacterJoiner(joinerId: number): boolean;
 }
 
-export interface IColorManager {
-  colors: IColorSet;
-}
-
 export interface IRenderDimensions {
   scaledCharWidth: number;
   scaledCharHeight: number;
@@ -90,7 +82,7 @@ export interface IRenderLayer extends IDisposable {
   /**
    * Called when the theme changes.
    */
-  onThemeChanged(terminal: ITerminal, colorSet: IColorSet): void;
+  setColors(terminal: ITerminal, colorSet: IColorSet): void;
 
   /**
    * Called when the data in the grid has changed (or needs to be rendered
@@ -134,17 +126,3 @@ export interface ICharacterJoinerRegistry {
   deregisterCharacterJoiner(joinerId: number): boolean;
   getJoinedCharacters(row: number): [number, number][];
 }
-
-export interface IColor {
-  css: string;
-  rgba: number; // 32-bit int with rgba in each byte
-}
-
-export interface IColorSet {
-  foreground: IColor;
-  background: IColor;
-  cursor: IColor;
-  cursorAccent: IColor;
-  selection: IColor;
-  ansi: IColor[];
-}

src/renderer/atlas/CharAtlasCache.ts

@@ -4,13 +4,13 @@
  */
 
 import { ITerminal } from '../../Types';
-import { IColorSet } from '../Types';
 import { generateConfig, configEquals } from './CharAtlasUtils';
 import BaseCharAtlas from './BaseCharAtlas';
 import DynamicCharAtlas from './DynamicCharAtlas';
 import NoneCharAtlas from './NoneCharAtlas';
 import StaticCharAtlas from './StaticCharAtlas';
 import { ICharAtlasConfig } from './Types';
+import { IColorSet } from '../../ui/Types';
 
 const charAtlasImplementations = {
   'none': NoneCharAtlas,

src/renderer/atlas/CharAtlasGenerator.ts

@@ -5,8 +5,8 @@
 
 import { FontWeight } from 'xterm';
 import { isFirefox, isSafari } from '../../common/Platform';
-import { IColor } from '../Types';
 import { ICharAtlasConfig, CHAR_ATLAS_CELL_SPACING } from './Types';
+import { IColor } from '../../ui/Types';
 
 /**
  * Generates a char atlas.

src/renderer/atlas/CharAtlasUtils.ts

@@ -4,8 +4,9 @@
  */
 
 import { ITerminal } from '../../Types';
-import { IColorSet } from '../Types';
-import { DEFAULT_COLOR, ICharAtlasConfig } from './Types';
+import { ICharAtlasConfig } from './Types';
+import { DEFAULT_COLOR } from '../../common/Types';
+import { IColorSet } from '../../ui/Types';
 
 export function generateConfig(scaledCharWidth: number, scaledCharHeight: number, terminal: ITerminal, colors: IColorSet): ICharAtlasConfig {
   // null out some fields that don't matter

src/renderer/atlas/DynamicCharAtlas.ts

@@ -5,11 +5,11 @@
 
 import { DIM_OPACITY, IGlyphIdentifier, INVERTED_DEFAULT_COLOR, ICharAtlasConfig } from './Types';
 import BaseCharAtlas from './BaseCharAtlas';
-import { DEFAULT_ANSI_COLORS } from '../ColorManager';
+import { DEFAULT_ANSI_COLORS } from '../../ui/ColorManager';
 import { clearColor } from './CharAtlasGenerator';
 import LRUMap from './LRUMap';
 import { isFirefox, isSafari } from '../../common/Platform';
-import { IColor } from '../Types';
+import { IColor } from '../../ui/Types';
 
 // In practice we're probably never going to exhaust a texture this large. For debugging purposes,
 // however, it can be useful to set this to a really tiny value, to verify that LRU eviction works.

src/renderer/atlas/StaticCharAtlas.ts

@@ -3,10 +3,11 @@
  * @license MIT
  */
 
-import { DIM_OPACITY, IGlyphIdentifier, DEFAULT_COLOR, ICharAtlasConfig, CHAR_ATLAS_CELL_SPACING } from './Types';
+import { DIM_OPACITY, IGlyphIdentifier, ICharAtlasConfig, CHAR_ATLAS_CELL_SPACING } from './Types';
 import { generateStaticCharAtlasTexture } from './CharAtlasGenerator';
 import BaseCharAtlas from './BaseCharAtlas';
 import { is256Color } from './CharAtlasUtils';
+import { DEFAULT_COLOR } from '../../common/Types';
 
 export default class StaticCharAtlas extends BaseCharAtlas {
   private _texture: HTMLCanvasElement | ImageBitmap;

src/renderer/atlas/Types.ts

@@ -4,9 +4,8 @@
  */
 
 import { FontWeight } from 'xterm';
-import { IColorSet } from '../Types';
+import { IColorSet } from '../../ui/Types';
 
-export const DEFAULT_COLOR = 256;
 export const INVERTED_DEFAULT_COLOR = 257;
 export const DIM_OPACITY = 0.5;
 

src/renderer/dom/DomRenderer.ts

@@ -3,15 +3,12 @@
  * @license MIT
  */
 
-import { IRenderer, IRenderDimensions, IColorSet } from '../Types';
+import { IRenderer, IRenderDimensions } from '../Types';
 import { ILinkifierEvent, ITerminal, CharacterJoinerHandler } from '../../Types';
-import { ITheme } from 'xterm';
-import { ColorManager } from '../ColorManager';
-import { RenderDebouncer } from '../../ui/RenderDebouncer';
 import { BOLD_CLASS, ITALIC_CLASS, CURSOR_CLASS, CURSOR_STYLE_BLOCK_CLASS, CURSOR_BLINK_CLASS, CURSOR_STYLE_BAR_CLASS, CURSOR_STYLE_UNDERLINE_CLASS, DomRendererRowFactory } from './DomRendererRowFactory';
 import { INVERTED_DEFAULT_COLOR } from '../atlas/Types';
-import { EventEmitter2, IEvent } from '../../common/EventEmitter2';
 import { Disposable } from '../../common/Lifecycle';
+import { IColorSet } from '../../ui/Types';
 
 const TERMINAL_CLASS_PREFIX = 'xterm-dom-renderer-owner-';
 const ROW_CONTAINER_CLASS = 'xterm-rows';
@@ -31,7 +28,6 @@ let nextTerminalId = 1;
  * canvas is not an option.
  */
 export class DomRenderer extends Disposable implements IRenderer {
-  private _renderDebouncer: RenderDebouncer;
   private _rowFactory: DomRendererRowFactory;
   private _terminalClass: number = nextTerminalId++;
 
@@ -42,18 +38,12 @@ export class DomRenderer extends Disposable implements IRenderer {
   private _selectionContainer: HTMLElement;
 
   public dimensions: IRenderDimensions;
-  public colorManager: ColorManager;
 
-  private _onCanvasResize = new EventEmitter2<{ width: number, height: number }>();
-  public get onCanvasResize(): IEvent<{ width: number, height: number }> { return this._onCanvasResize.event; }
-  private _onRender = new EventEmitter2<{ start: number, end: number }>();
-  public get onRender(): IEvent<{ start: number, end: number }> { return this._onRender.event; }
-
-  constructor(private _terminal: ITerminal, theme: ITheme | undefined) {
+  constructor(
+    private _terminal: ITerminal,
+    private _colors: IColorSet
+  ) {
     super();
-    const allowTransparency = this._terminal.options.allowTransparency;
-    this.colorManager = new ColorManager(document, allowTransparency);
-    this.setTheme(theme);
 
     this._rowContainer = document.createElement('div');
     this._rowContainer.classList.add(ROW_CONTAINER_CLASS);
@@ -79,8 +69,8 @@ export class DomRenderer extends Disposable implements IRenderer {
       actualCellHeight: null
     };
     this._updateDimensions();
+    this._injectCss();
 
-    this._renderDebouncer = new RenderDebouncer(this._renderRows.bind(this));
     this._rowFactory = new DomRendererRowFactory(_terminal.options, document);
 
     this._terminal.element.classList.add(TERMINAL_CLASS_PREFIX + this._terminalClass);
@@ -101,7 +91,7 @@ export class DomRenderer extends Disposable implements IRenderer {
   }
 
   private _updateDimensions(): void {
-    this.dimensions.scaledCharWidth = Math.floor(this._terminal.charMeasure.width * window.devicePixelRatio);
+    this.dimensions.scaledCharWidth = this._terminal.charMeasure.width * window.devicePixelRatio;
     this.dimensions.scaledCharHeight = Math.ceil(this._terminal.charMeasure.height * window.devicePixelRatio);
     this.dimensions.scaledCellWidth = this.dimensions.scaledCharWidth + Math.round(this._terminal.options.letterSpacing);
     this.dimensions.scaledCellHeight = Math.floor(this.dimensions.scaledCharHeight * this._terminal.options.lineHeight);
@@ -142,11 +132,12 @@ export class DomRenderer extends Disposable implements IRenderer {
     this._terminal.screenElement.style.height = `${this.dimensions.canvasHeight}px`;
   }
 
-  public setTheme(theme: ITheme | undefined): IColorSet {
-    if (theme) {
-      this.colorManager.setTheme(theme);
-    }
+  public setColors(colors: IColorSet): void {
+    this._colors = colors;
+    this._injectCss();
+  }
 
+  private _injectCss(): void {
     if (!this._themeStyleElement) {
       this._themeStyleElement = document.createElement('style');
       this._terminal.screenElement.appendChild(this._themeStyleElement);
@@ -155,10 +146,10 @@ export class DomRenderer extends Disposable implements IRenderer {
     // Base CSS
     let styles =
         `${this._terminalSelector} .${ROW_CONTAINER_CLASS} {` +
-        ` color: ${this.colorManager.colors.foreground.css};` +
-        ` background-color: ${this.colorManager.colors.background.css};` +
-        ` font-family: ${this._terminal.getOption('fontFamily')};` +
-        ` font-size: ${this._terminal.getOption('fontSize')}px;` +
+        ` color: ${this._colors.foreground.css};` +
+        ` background-color: ${this._colors.background.css};` +
+        ` font-family: ${this._terminal.options.fontFamily};` +
+        ` font-size: ${this._terminal.options.fontSize}px;` +
         `}`;
     // Text styles
     styles +=
@@ -181,21 +172,21 @@ export class DomRenderer extends Disposable implements IRenderer {
     // Cursor
     styles +=
         `${this._terminalSelector} .${ROW_CONTAINER_CLASS}:not(.${FOCUS_CLASS}) .${CURSOR_CLASS} {` +
-        ` outline: 1px solid ${this.colorManager.colors.cursor.css};` +
+        ` outline: 1px solid ${this._colors.cursor.css};` +
         ` outline-offset: -1px;` +
         `}` +
         `${this._terminalSelector} .${ROW_CONTAINER_CLASS}.${FOCUS_CLASS} .${CURSOR_CLASS}.${CURSOR_BLINK_CLASS} {` +
         ` animation: blink 1s step-end infinite;` +
         `}` +
         `${this._terminalSelector} .${ROW_CONTAINER_CLASS}.${FOCUS_CLASS} .${CURSOR_CLASS}.${CURSOR_STYLE_BLOCK_CLASS} {` +
-        ` background-color: ${this.colorManager.colors.cursor.css};` +
-        ` color: ${this.colorManager.colors.cursorAccent.css};` +
+        ` background-color: ${this._colors.cursor.css};` +
+        ` color: ${this._colors.cursorAccent.css};` +
         `}` +
         `${this._terminalSelector} .${ROW_CONTAINER_CLASS}.${FOCUS_CLASS} .${CURSOR_CLASS}.${CURSOR_STYLE_BAR_CLASS} {` +
-        ` box-shadow: 1px 0 0 ${this.colorManager.colors.cursor.css} inset;` +
+        ` box-shadow: 1px 0 0 ${this._colors.cursor.css} inset;` +
         `}` +
         `${this._terminalSelector} .${ROW_CONTAINER_CLASS}.${FOCUS_CLASS} .${CURSOR_CLASS}.${CURSOR_STYLE_UNDERLINE_CLASS} {` +
-        ` box-shadow: 0 -1px 0 ${this.colorManager.colors.cursor.css} inset;` +
+        ` box-shadow: 0 -1px 0 ${this._colors.cursor.css} inset;` +
         `}`;
     // Selection
     styles +=
@@ -208,23 +199,22 @@ export class DomRenderer extends Disposable implements IRenderer {
         `}` +
         `${this._terminalSelector} .${SELECTION_CLASS} div {` +
         ` position: absolute;` +
-        ` background-color: ${this.colorManager.colors.selection.css};` +
+        ` background-color: ${this._colors.selection.css};` +
         `}`;
     // Colors
-    this.colorManager.colors.ansi.forEach((c, i) => {
+    this._colors.ansi.forEach((c, i) => {
       styles +=
           `${this._terminalSelector} .${FG_CLASS_PREFIX}${i} { color: ${c.css}; }` +
           `${this._terminalSelector} .${BG_CLASS_PREFIX}${i} { background-color: ${c.css}; }`;
     });
     styles +=
-        `${this._terminalSelector} .${FG_CLASS_PREFIX}${INVERTED_DEFAULT_COLOR} { color: ${this.colorManager.colors.background.css}; }` +
-        `${this._terminalSelector} .${BG_CLASS_PREFIX}${INVERTED_DEFAULT_COLOR} { background-color: ${this.colorManager.colors.foreground.css}; }`;
+        `${this._terminalSelector} .${FG_CLASS_PREFIX}${INVERTED_DEFAULT_COLOR} { color: ${this._colors.background.css}; }` +
+        `${this._terminalSelector} .${BG_CLASS_PREFIX}${INVERTED_DEFAULT_COLOR} { background-color: ${this._colors.foreground.css}; }`;
 
     this._themeStyleElement.innerHTML = styles;
-    return this.colorManager.colors;
   }
 
-  public onWindowResize(devicePixelRatio: number): void {
+  public onDevicePixelRatioChange(): void {
     this._updateDimensions();
   }
 
@@ -244,10 +234,6 @@ export class DomRenderer extends Disposable implements IRenderer {
   public onResize(cols: number, rows: number): void {
     this._refreshRowElements(cols, rows);
     this._updateDimensions();
-    this._onCanvasResize.fire({
-      width: this.dimensions.canvasWidth,
-      height: this.dimensions.canvasHeight
-    });
   }
 
   public onCharSizeChanged(): void {
@@ -331,7 +317,7 @@ export class DomRenderer extends Disposable implements IRenderer {
   public onOptionsChanged(): void {
     // Force a refresh
     this._updateDimensions();
-    this.setTheme(undefined);
+    this._injectCss();
     this._terminal.refresh(0, this._terminal.rows - 1);
   }
 
@@ -339,11 +325,7 @@ export class DomRenderer extends Disposable implements IRenderer {
     this._rowElements.forEach(e => e.innerHTML = '');
   }
 
-  public refreshRows(start: number, end: number): void {
-    this._renderDebouncer.refresh(start, end, this._terminal.rows);
-  }
-
-  private _renderRows(start: number, end: number): void {
+  public renderRows(start: number, end: number): void {
     const terminal = this._terminal;
 
     const cursorAbsoluteY = terminal.buffer.ybase + terminal.buffer.y;
@@ -359,8 +341,6 @@ export class DomRenderer extends Disposable implements IRenderer {
       const cursorStyle = terminal.options.cursorStyle;
       rowElement.appendChild(this._rowFactory.createRow(lineData, row === cursorAbsoluteY, cursorStyle, cursorX, cursorBlink, this.dimensions.actualCellWidth, terminal.cols));
     }
-
-    this._onRender.fire({ start, end });
   }
 
   private get _terminalSelector(): string {

src/renderer/dom/DomRendererRowFactory.test.ts

@@ -6,9 +6,9 @@
 import jsdom = require('jsdom');
 import { assert } from 'chai';
 import { DomRendererRowFactory } from './DomRendererRowFactory';
-import { DEFAULT_ATTR, NULL_CELL_CODE, NULL_CELL_WIDTH, NULL_CELL_CHAR, DEFAULT_ATTR_DATA } from '../../Buffer';
-import { BufferLine, CellData, FgFlags, BgFlags, Attributes } from '../../BufferLine';
-import { IBufferLine, ITerminalOptions } from '../../Types';
+import { BufferLine, CellData, FgFlags, BgFlags, Attributes, NULL_CELL_CODE, NULL_CELL_WIDTH, NULL_CELL_CHAR, DEFAULT_ATTR, DEFAULT_ATTR_DATA } from '../../core/buffer/BufferLine';
+import { ITerminalOptions } from '../../Types';
+import { IBufferLine } from '../../core/Types';
 
 describe('DomRendererRowFactory', () => {
   let dom: jsdom.JSDOM;

src/renderer/dom/DomRendererRowFactory.ts

@@ -3,10 +3,10 @@
  * @license MIT
  */
 
-import {  NULL_CELL_CODE, WHITESPACE_CELL_CHAR } from '../../Buffer';
-import { IBufferLine, ITerminalOptions } from '../../Types';
+import { ITerminalOptions } from '../../Types';
+import { IBufferLine } from '../../core/Types';
 import { INVERTED_DEFAULT_COLOR } from '../atlas/Types';
-import { CellData, AttributeData } from '../../BufferLine';
+import { CellData, AttributeData, NULL_CELL_CODE, WHITESPACE_CELL_CHAR } from '../../core/buffer/BufferLine';
 
 export const BOLD_CLASS = 'xterm-bold';
 export const DIM_CLASS = 'xterm-dim';

src/ui/ColorManager.ts

@@ -3,8 +3,7 @@
  * @license MIT
  */
 
-import { IColorManager, IColor, IColorSet } from './Types';
-import { ITheme } from 'xterm';
+import { IColorManager, IColor, IColorSet, ITheme } from './Types';
 
 const DEFAULT_FOREGROUND = fromHex('#ffffff');
 const DEFAULT_BACKGROUND = fromHex('#000000');
@@ -90,7 +89,11 @@ export class ColorManager implements IColorManager {
     const canvas = document.createElement('canvas');
     canvas.width = 1;
     canvas.height = 1;
-    this._ctx = canvas.getContext('2d');
+    const ctx = canvas.getContext('2d');
+    if (!ctx) {
+      throw new Error('Could not get rendering context');
+    }
+    this._ctx = ctx;
     this._ctx.globalCompositeOperation = 'copy';
     this._litmusColor = this._ctx.createLinearGradient(0, 0, 1, 1);
     this.colors = {
@@ -108,7 +111,7 @@ export class ColorManager implements IColorManager {
    * @param theme The  theme to use. If a partial theme is provided then default
    * colors will be used where colors are not defined.
    */
-  public setTheme(theme: ITheme): void {
+  public setTheme(theme: ITheme = {}): void {
     this.colors.foreground = this._parseColor(theme.foreground, DEFAULT_FOREGROUND);
     this.colors.background = this._parseColor(theme.background, DEFAULT_BACKGROUND);
     this.colors.cursor = this._parseColor(theme.cursor, DEFAULT_CURSOR, true);
@@ -133,11 +136,11 @@ export class ColorManager implements IColorManager {
   }
 
   private _parseColor(
-    css: string,
+    css: string | undefined,
     fallback: IColor,
     allowTransparency: boolean = this.allowTransparency
   ): IColor {
-    if (!css) {
+    if (css === undefined) {
       return fallback;
     }
 

src/ui/Types.ts

@@ -0,0 +1,46 @@
+/**
+ * Copyright (c) 2017 The xterm.js authors. All rights reserved.
+ * @license MIT
+ */
+
+export interface IColorManager {
+  colors: IColorSet;
+}
+
+export interface IColor {
+  css: string;
+  rgba: number; // 32-bit int with rgba in each byte
+}
+
+export interface IColorSet {
+  foreground: IColor;
+  background: IColor;
+  cursor: IColor;
+  cursorAccent: IColor;
+  selection: IColor;
+  ansi: IColor[];
+}
+
+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/ui/tsconfig.json

@@ -10,12 +10,8 @@
       "../../node_modules/@types/mocha"
     ]
   },
-  "include": [
-    "./Lifecycle.ts",
-    "./RenderDebouncer.ts",
-    "./ScreenDprMonitor.ts"
-  ],
+  "include": [ "./**/*" ],
   "references": [
     { "path": "../common" }
   ]
-}  
+}

typings/xterm.d.ts

@@ -275,7 +275,7 @@ declare module 'xterm' {
      * A callback that fires when the mouse leaves a link. Note that this can
      * happen even when tooltipCallback hasn't fired for the link yet.
      */
-    leaveCallback?: (event: MouseEvent, uri: string) => boolean | void;
+    leaveCallback?: () => void;
 
     /**
      * The priority of the link matcher, this defines the order in which the link
@@ -355,6 +355,13 @@ declare module 'xterm' {
      */
     readonly cols: number;
 
+    /**
+     * (EXPERIMENTAL) The terminal's current buffer, this might be either the
+     * normal buffer or the alt buffer depending on what's running in the
+     * terminal.
+     */
+    readonly buffer: IBuffer;
+
     /**
      * (EXPERIMENTAL) Get all markers registered against the buffer. If the alt
      * buffer is active this will always return [].
@@ -546,12 +553,6 @@ declare module 'xterm' {
      */
     resize(columns: number, rows: number): void;
 
-    /**
-     * Writes text to the terminal, followed by a break line character (\n).
-     * @param data The text to write to the terminal.
-     */
-    writeln(data: string): void;
-
     /**
      * Opens the terminal within an element.
      * @param parent The element to create the terminal within. This element
@@ -594,6 +595,7 @@ declare module 'xterm' {
      * @return An IDisposable you can call to remove this handler.
      */
     addOscHandler(ident: number, callback: (data: string) => boolean): IDisposable;
+
     /**
      * (EXPERIMENTAL) Registers a link matcher, allowing custom link patterns to
      * be matched and handled.
@@ -668,11 +670,24 @@ declare module 'xterm' {
      */
     getSelection(): string;
 
+    /**
+     * Gets the selection position or undefined if there is no selection.
+     */
+    getSelectionPosition(): ISelectionPosition | undefined;
+
     /**
      * Clears the current terminal selection.
      */
     clearSelection(): void;
 
+    /**
+     * Selects text within the terminal.
+     * @param column The column the selection starts at..
+     * @param row The row the selection starts at.
+     * @param length The length of the selection.
+     */
+    select(column: number, row: number, length: number): void;
+
     /**
      * Selects all text within the terminal.
      */
@@ -737,6 +752,20 @@ declare module 'xterm' {
      */
     write(data: string): void;
 
+    /**
+     * Writes text to the terminal, followed by a break line character (\n).
+     * @param data The text to write to the terminal.
+     */
+    writeln(data: string): void;
+
+    /**
+     * Writes UTF8 data to the terminal.
+     * This has a slight performance advantage over the string based write method
+     * due to lesser data conversions needed on the way from the pty to xterm.js.
+     * @param data The data to write to the terminal.
+     */
+    writeUtf8(data: Uint8Array): void;
+
     /**
      * Retrieves an option's value from the terminal.
      * @param key The option key.
@@ -746,7 +775,7 @@ declare module 'xterm' {
      * Retrieves an option's value from the terminal.
      * @param key The option key.
      */
-    getOption(key: 'allowTransparency' | 'cancelEvents' | 'convertEol' | 'cursorBlink' | 'debug' | 'disableStdin' | 'enableBold' | 'macOptionIsMeta' | 'rightClickSelectsWord' | 'popOnBell' | 'screenKeys' | 'useFlowControl' | 'visualBell'): boolean;
+    getOption(key: 'allowTransparency' | 'cancelEvents' | 'convertEol' | 'cursorBlink' | 'debug' | 'disableStdin' | 'enableBold' | 'macOptionIsMeta' | 'rightClickSelectsWord' | 'popOnBell' | 'screenKeys' | 'useFlowControl' | 'visualBell' | 'windowsMode'): boolean;
     /**
      * Retrieves an option's value from the terminal.
      * @param key The option key.
@@ -797,7 +826,7 @@ declare module 'xterm' {
      * @param key The option key.
      * @param value The option value.
      */
-    setOption(key: 'allowTransparency' | 'cancelEvents' | 'convertEol' | 'cursorBlink' | 'debug' | 'disableStdin' | 'enableBold' | 'macOptionIsMeta' | 'popOnBell' | 'rightClickSelectsWord' | 'screenKeys' | 'useFlowControl' | 'visualBell', value: boolean): void;
+    setOption(key: 'allowTransparency' | 'cancelEvents' | 'convertEol' | 'cursorBlink' | 'debug' | 'disableStdin' | 'enableBold' | 'macOptionIsMeta' | 'popOnBell' | 'rightClickSelectsWord' | 'screenKeys' | 'useFlowControl' | 'visualBell' | 'windowsMode', value: boolean): void;
     /**
      * Sets an option on the terminal.
      * @param key The option key.
@@ -852,7 +881,133 @@ declare module 'xterm' {
      * Applies an addon to the Terminal prototype, making it available to all
      * newly created Terminals.
      * @param addon The addon to apply.
+     * @deprecated Use the new loadAddon API/addon format.
      */
     static applyAddon(addon: any): void;
+
+    /**
+     * (EXPERIMENTAL) Loads an addon into this instance of xterm.js.
+     * @param addon The addon to load.
+     */
+    loadAddon(addon: ITerminalAddon): void;
+  }
+
+  /**
+   * An addon that can provide additional functionality to the terminal.
+   */
+  export interface ITerminalAddon extends IDisposable {
+    /**
+     * (EXPERIMENTAL) This is called when the addon is activated within xterm.js.
+     */
+    activate(terminal: Terminal): void;
+  }
+
+  /**
+   * An object representing a selecrtion within the terminal.
+   */
+  interface ISelectionPosition {
+    /**
+     * The start column of the selection.
+     */
+    startColumn: number;
+
+    /**
+     * The start row of the selection.
+     */
+    startRow: number;
+
+    /**
+     * The end column of the selection.
+     */
+    endColumn: number;
+
+    /**
+     * The end row of the selection.
+     */
+    endRow: number;
+  }
+
+  interface IBuffer {
+    /**
+     * The y position of the cursor. This ranges between `0` (when the
+     * cursor is at baseY) and `Terminal.rows - 1` (when the cursor is on the
+     * last row).
+     */
+    readonly cursorY: number;
+
+    /**
+     * The x position of the cursor. This ranges between `0` (left side) and
+     * `Terminal.cols - 1` (right side).
+     */
+    readonly cursorX: number;
+
+    /**
+     * The line within the buffer where the top of the viewport is.
+     */
+    readonly viewportY: number;
+
+    /**
+     * The line within the buffer where the top of the bottom page is (when
+     * fully scrolled down);
+     */
+    readonly baseY: number;
+
+    /**
+     * The amount of lines in the buffer.
+     */
+    readonly length: number;
+
+    /**
+     * Gets a line from the buffer, or undefined if the line index does not exist.
+     *
+     * Note that the result of this function should be used immediately after calling as when the
+     * terminal updates it could lead to unexpected behavior.
+     *
+     * @param y The line index to get.
+     */
+    getLine(y: number): IBufferLine | undefined;
+  }
+
+  interface IBufferLine {
+    /**
+     * Whether the line is wrapped from the previous line.
+     */
+    readonly isWrapped: boolean;
+
+    /**
+     * Gets a cell from the line, or undefined if the line index does not exist.
+     *
+     * Note that the result of this function should be used immediately after calling as when the
+     * terminal updates it could lead to unexpected behavior.
+     *
+     * @param x The character index to get.
+     */
+    getCell(x: number): IBufferCell;
+
+    /**
+     * Gets the line as a string. Note that this is gets only the string for the line, not taking
+     * isWrapped into account.
+     *
+     * @param trimRight Whether to trim any whitespace at the right of the line.
+     * @param startColumn The column to start from (inclusive).
+     * @param endColumn The column to end at (exclusive).
+     */
+    translateToString(trimRight?: boolean, startColumn?: number, endColumn?: number): string;
+  }
+
+  interface IBufferCell {
+    /**
+     * The character within the cell.
+     */
+    readonly char: string;
+
+    /**
+     * The width of the character. Some examples:
+     *
+     * - This is `1` for most cells.
+     * - This is `2` for wide character like CJK glyphs.
+     * - This is `0` for cells immediately following cells with a width of `2`.
+     */
+    readonly width: number;
   }
 }

yarn.lock

@@ -69,6 +69,13 @@
   resolved "https://registry.yarnpkg.com/@types/node/-/node-6.0.108.tgz#852e8496bcfc5e74cae83a5eb3b30e5661e9b7b9"
   integrity sha512-5q14jNJCPW+Iwk6Y1JxtA7T5ov1aVRS2VA2PvRgFMZtCjoIo8WT1WO56dSV0MSiHR7BEoe2QNuXigBQNqbWdAw==
 
+"@types/puppeteer@^1.12.4":
+  version "1.12.4"
+  resolved "https://registry.yarnpkg.com/@types/puppeteer/-/puppeteer-1.12.4.tgz#8388efdb0b30a54a7e7c4831ca0d709191d77ff1"
+  integrity sha512-aaGbJaJ9TuF9vZfTeoh876sBa+rYJWPwtsmHmYr28pGr42ewJnkDTq2aeSKEmS39SqUdkwLj73y/d7rBSp7mDQ==
+  dependencies:
+    "@types/node" "*"
+
 "@types/tapable@*":
   version "1.0.4"
   resolved "https://registry.yarnpkg.com/@types/tapable/-/tapable-1.0.4.tgz#b4ffc7dc97b498c969b360a41eee247f82616370"
@@ -86,6 +93,11 @@
   dependencies:
     source-map "^0.6.1"
 
+"@types/utf8@^2.1.6":
+  version "2.1.6"
+  resolved "https://registry.yarnpkg.com/@types/utf8/-/utf8-2.1.6.tgz#430cabb71a42d0a3613cce5621324fe4f5a25753"
+  integrity sha512-pRs2gYF5yoKYrgSaira0DJqVg2tFuF+Qjp838xS7K+mJyY2jJzjsrl6y17GbIa4uMRogMbxs+ghNCvKg6XyNrA==
+
 "@types/webpack@^4.4.11":
   version "4.4.11"
   resolved "https://registry.yarnpkg.com/@types/webpack/-/webpack-4.4.11.tgz#0ca832870d55c4e92498c01d22d00d02b0f62ae9"
@@ -314,6 +326,13 @@ acorn@^5.6.2:
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-5.7.2.tgz#91fa871883485d06708800318404e72bfb26dcc5"
   integrity sha512-cJrKCNcr2kv8dlDnbw+JPUGjHZzo4myaxOLmpOX8a+rgX94YeTcTMv/LFJUSByRpc+i4GgVnnhLxvMu/2Y+rqw==
 
+agent-base@^4.1.0:
+  version "4.2.1"
+  resolved "https://registry.yarnpkg.com/agent-base/-/agent-base-4.2.1.tgz#d89e5999f797875674c07d87f260fc41e83e8ca9"
+  integrity sha512-JVwXMr9nHYTUXsBFKUqhJwvlcYU/blreOEUkhNR2eXZIvwd+c+o5V4MgDPKWnMS/56awN3TRzIP+KoPn+roQtg==
+  dependencies:
+    es6-promisify "^5.0.0"
+
 ajv-keywords@^3.1.0:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/ajv-keywords/-/ajv-keywords-3.2.0.tgz#e86b819c602cf8821ad637413698f1dec021847a"
@@ -1307,7 +1326,7 @@ concat-map@0.0.1:
   resolved "https://registry.yarnpkg.com/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
   integrity sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=
 
-concat-stream@^1.5.0, concat-stream@^1.6.1:
+concat-stream@1.6.2, concat-stream@^1.5.0, concat-stream@^1.6.1:
   version "1.6.2"
   resolved "https://registry.yarnpkg.com/concat-stream/-/concat-stream-1.6.2.tgz#904bdf194cd3122fc675c77fc4ac3d4ff0fd1a34"
   integrity sha512-27HBghJxjiZtIk3Ycvn/4kbJk/1uZuJFfuPEns6LaEvpvG1f0hTea8lilrouyo9mVc2GWdcEZ8OLoGmSADlrCw==
@@ -1606,7 +1625,7 @@ debug@2.6.8:
   dependencies:
     ms "2.0.0"
 
-debug@2.X, debug@^2.1.2, debug@^2.2.0, debug@^2.3.3, debug@^2.6.8:
+debug@2.6.9, debug@2.X, debug@^2.1.2, debug@^2.2.0, debug@^2.3.3, debug@^2.6.8:
   version "2.6.9"
   resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f"
   integrity sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==
@@ -1620,6 +1639,13 @@ debug@^3.1.0:
   dependencies:
     ms "2.0.0"
 
+debug@^4.1.0:
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.1.tgz#3b72260255109c6b589cee050f1d516139664791"
+  integrity sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==
+  dependencies:
+    ms "^2.1.1"
+
 debug@~2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/debug/-/debug-2.2.0.tgz#f87057e995b1a1f6ae6a4960664137bc56f039da"
@@ -1938,6 +1964,18 @@ es6-promise@^3.0.2, es6-promise@^3.1.2:
   resolved "https://registry.yarnpkg.com/es6-promise/-/es6-promise-3.3.1.tgz#a08cdde84ccdbf34d027a1451bc91d4bcd28a613"
   integrity sha1-oIzd6EzNvzTQJ6FFG8kdS80ophM=
 
+es6-promise@^4.0.3:
+  version "4.2.6"
+  resolved "https://registry.yarnpkg.com/es6-promise/-/es6-promise-4.2.6.tgz#b685edd8258886365ea62b57d30de28fadcd974f"
+  integrity sha512-aRVgGdnmW2OiySVPUC9e6m+plolMAJKjZnQlCwNSuK5yQ0JN61DZSO1X1Ufd1foqWRAlig0rhduTCHe7sVtK5Q==
+
+es6-promisify@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/es6-promisify/-/es6-promisify-5.0.0.tgz#5109d62f3e56ea967c4b63505aef08291c8a5203"
+  integrity sha1-UQnWLz5W6pZ8S2NQWu8IKRyKUgM=
+  dependencies:
+    es6-promise "^4.0.3"
+
 es6-symbol@^3.1.1, es6-symbol@~3.1.1:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/es6-symbol/-/es6-symbol-3.1.1.tgz#bf00ef4fdab6ba1b46ecb7b629b4c7ed5715cc77"
@@ -2174,6 +2212,16 @@ extglob@^2.0.4:
     snapdragon "^0.8.1"
     to-regex "^3.0.1"
 
+extract-zip@^1.6.6:
+  version "1.6.7"
+  resolved "https://registry.yarnpkg.com/extract-zip/-/extract-zip-1.6.7.tgz#a840b4b8af6403264c8db57f4f1a74333ef81fe9"
+  integrity sha1-qEC0uK9kAyZMjbV/Txp0Mz74H+k=
+  dependencies:
+    concat-stream "1.6.2"
+    debug "2.6.9"
+    mkdirp "0.5.1"
+    yauzl "2.4.1"
+
 extsprintf@1.3.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/extsprintf/-/extsprintf-1.3.0.tgz#96918440e3041a7a414f8c52e3c574eb3c3e1e05"
@@ -2213,6 +2261,13 @@ fast-levenshtein@~2.0.4:
   resolved "https://registry.yarnpkg.com/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz#3d8a5c66883a16a30ca8643e851f19baa7797917"
   integrity sha1-PYpcZog6FqMMqGQ+hR8Zuqd5eRc=
 
+fd-slicer@~1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/fd-slicer/-/fd-slicer-1.0.1.tgz#8b5bcbd9ec327c5041bf9ab023fd6750f1177e65"
+  integrity sha1-i1vL2ewyfFBBv5qwI/1nUPEXfmU=
+  dependencies:
+    pend "~1.2.0"
+
 figures@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/figures/-/figures-2.0.0.tgz#3ab1a2d2a62c8bfb431a0c94cb797a2fce27c962"
@@ -3042,6 +3097,14 @@ https-browserify@~0.0.0:
   resolved "https://registry.yarnpkg.com/https-browserify/-/https-browserify-0.0.1.tgz#3f91365cabe60b77ed0ebba24b454e3e09d95a82"
   integrity sha1-P5E2XKvmC3ftDruiS0VOPgnZWoI=
 
+https-proxy-agent@^2.2.1:
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/https-proxy-agent/-/https-proxy-agent-2.2.1.tgz#51552970fa04d723e04c56d04178c3f92592bbc0"
+  integrity sha512-HPCTS1LW51bcyMYbxUIOO4HEOlQ1/1qRaFWcyxvwaqUS9TY88aoEuHUY33kuAh1YhVVaDQhLZsnPd+XNARWZlQ==
+  dependencies:
+    agent-base "^4.1.0"
+    debug "^3.1.0"
+
 iconv-lite@0.4.19:
   version "0.4.19"
   resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.19.tgz#f7468f60135f5e5dad3399c0a81be9a1603a082b"
@@ -4235,6 +4298,11 @@ mime@1.3.4:
   resolved "https://registry.yarnpkg.com/mime/-/mime-1.3.4.tgz#115f9e3b6b3daf2959983cb38f149a2d40eb5d53"
   integrity sha1-EV+eO2s9rylZmDyzjxSaLUDrXVM=
 
+mime@^2.0.3:
+  version "2.4.2"
+  resolved "https://registry.yarnpkg.com/mime/-/mime-2.4.2.tgz#ce5229a5e99ffc313abac806b482c10e7ba6ac78"
+  integrity sha512-zJBfZDkwRu+j3Pdd2aHsR5GfH2jIWhmL1ZzBoc+X+3JEti2hbArWcyJ+1laC1D2/U/W1a/+Cegj0/OnEU2ybjg==
+
 mimic-fn@^1.0.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/mimic-fn/-/mimic-fn-1.2.0.tgz#820c86a39334640e99516928bd03fca88057d022"
@@ -4394,6 +4462,11 @@ ms@2.0.0:
   resolved "https://registry.yarnpkg.com/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8"
   integrity sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=
 
+ms@^2.1.1:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.1.tgz#30a5864eb3ebb0a66f2ebe6d727af06a09d86e0a"
+  integrity sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg==
+
 multipipe@^0.1.2:
   version "0.1.2"
   resolved "https://registry.yarnpkg.com/multipipe/-/multipipe-0.1.2.tgz#2a8f2ddf70eed564dff2d57f1e1a137d9f05078b"
@@ -5067,6 +5140,11 @@ pbkdf2@^3.0.3:
     safe-buffer "^5.0.1"
     sha.js "^2.4.8"
 
+pend@~1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/pend/-/pend-1.2.0.tgz#7a57eb550a6783f9115331fcf4663d5c8e007a50"
+  integrity sha1-elfrVQpng/kRUzH89GY9XI4AelA=
+
 performance-now@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/performance-now/-/performance-now-2.1.0.tgz#6309f4e0e5fa913ec1c69307ae364b4b377c9e7b"
@@ -5165,6 +5243,11 @@ process@^0.11.10, process@~0.11.0:
   resolved "https://registry.yarnpkg.com/process/-/process-0.11.10.tgz#7332300e840161bda3e69a1d1d91a7d4bc16f182"
   integrity sha1-czIwDoQBYb2j5podHZGn1LwW8YI=
 
+progress@^2.0.1:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/progress/-/progress-2.0.3.tgz#7e8cf8d8f5b8f239c1bc68beb4eb78567d572ef8"
+  integrity sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==
+
 promise-inflight@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/promise-inflight/-/promise-inflight-1.0.1.tgz#98472870bf228132fcbdd868129bad12c3c029e3"
@@ -5178,6 +5261,11 @@ proxy-addr@~1.0.10:
     forwarded "~0.1.0"
     ipaddr.js "1.0.5"
 
+proxy-from-env@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/proxy-from-env/-/proxy-from-env-1.0.0.tgz#33c50398f70ea7eb96d21f7b817630a55791c7ee"
+  integrity sha1-M8UDmPcOp+uW0h97gXYwpVeRx+4=
+
 prr@~1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/prr/-/prr-1.0.1.tgz#d3fc114ba06995a45ec6893f484ceb1d78f5f476"
@@ -5243,6 +5331,20 @@ punycode@^2.1.0:
   resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.1.1.tgz#b58b010ac40c22c5657616c8d2c2c02c7bf479ec"
   integrity sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==
 
+puppeteer@^1.15.0:
+  version "1.15.0"
+  resolved "https://registry.yarnpkg.com/puppeteer/-/puppeteer-1.15.0.tgz#1680fac13e51f609143149a5b7fa99eec392b34f"
+  integrity sha512-D2y5kwA9SsYkNUmcBzu9WZ4V1SGHiQTmgvDZSx6sRYFsgV25IebL4V6FaHjF6MbwLK9C6f3G3pmck9qmwM8H3w==
+  dependencies:
+    debug "^4.1.0"
+    extract-zip "^1.6.6"
+    https-proxy-agent "^2.2.1"
+    mime "^2.0.3"
+    progress "^2.0.1"
+    proxy-from-env "^1.0.0"
+    rimraf "^2.6.1"
+    ws "^6.1.0"
+
 qs@4.0.0:
   version "4.0.0"
   resolved "https://registry.yarnpkg.com/qs/-/qs-4.0.0.tgz#c31d9b74ec27df75e543a86c78728ed8d4623607"
@@ -6554,10 +6656,10 @@ typedarray@^0.0.6, typedarray@~0.0.5:
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
   integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
 
-typescript@3.4:
-  version "3.4.1"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.4.1.tgz#b6691be11a881ffa9a05765a205cb7383f3b63c6"
-  integrity sha512-3NSMb2VzDQm8oBTLH6Nj55VVtUEpe/rgkIzMir0qVoLyjDZlnMBva0U6vDiV3IH+sl/Yu6oP5QwsAQtHPmDd2Q==
+typescript@3.5:
+  version "3.5.1"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.5.1.tgz#ba72a6a600b2158139c5dd8850f700e231464202"
+  integrity sha512-64HkdiRv1yYZsSe4xC1WVgamNigVYjlssIoaH2HcZF0+ijsk5YK2g0G34w9wJkze8+5ow4STd22AynfO6ZYYLw==
 
 uglify-es@^3.3.4:
   version "3.3.9"
@@ -6726,6 +6828,11 @@ user-home@^1.1.1:
   resolved "https://registry.yarnpkg.com/user-home/-/user-home-1.1.1.tgz#2b5be23a32b63a7c9deb8d0f28d485724a3df190"
   integrity sha1-K1viOjK2Onyd640PKNSFcko98ZA=
 
+utf8@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/utf8/-/utf8-3.0.0.tgz#f052eed1364d696e769ef058b183df88c87f69d1"
+  integrity sha512-E8VjFIQ/TyQgp+TZfS6l8yp/xWppSAHzidGiRrqe4bK4XP9pTRyKFgGJpO3SN7zdX4DeomTrwaseCHovfpFcqQ==
+
 util-deprecate@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
@@ -7100,6 +7207,13 @@ ws@^4.0.0:
     async-limiter "~1.0.0"
     safe-buffer "~5.1.0"
 
+ws@^6.1.0:
+  version "6.2.1"
+  resolved "https://registry.yarnpkg.com/ws/-/ws-6.2.1.tgz#442fdf0a47ed64f59b6a5d8ff130f4748ed524fb"
+  integrity sha512-GIyAXC2cB7LjvpgMt9EKS2ldqr0MTrORaleiOno6TweZ6r3TKtoFQWay/2PceJ3RuBasOHzXNn5Lrw1X0bEjqA==
+  dependencies:
+    async-limiter "~1.0.0"
+
 xdg-basedir@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/xdg-basedir/-/xdg-basedir-2.0.0.tgz#edbc903cc385fc04523d966a335504b5504d1bd2"
@@ -7122,6 +7236,21 @@ xregexp@4.0.0:
   resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.1.tgz#a5c6d532be656e23db820efb943a1f04998d63af"
   integrity sha1-pcbVMr5lbiPbgg77lDofBJmNY68=
 
+xterm-addon-attach@0.1.0-beta8:
+  version "0.1.0-beta8"
+  resolved "https://registry.yarnpkg.com/xterm-addon-attach/-/xterm-addon-attach-0.1.0-beta8.tgz#e469ed9d6ab7e535d0a9ffae23ef4f2efe58163b"
+  integrity sha512-HtQuwqnvcR+SwI9/JbBMd//Il+oEeo3rWrIucLLKHT8sB+OAOkdhmo5KIM/hhnovjI040WJ+tTHkDgPFwIJtmw==
+
+xterm-addon-search@0.1.0-beta4:
+  version "0.1.0-beta4"
+  resolved "https://registry.yarnpkg.com/xterm-addon-search/-/xterm-addon-search-0.1.0-beta4.tgz#c73fe058c87f07eaae31baaa92976e927438a396"
+  integrity sha512-tJgZ1VTRd/DOFUhSFZzybRF8SR1LCEXRYkw/mHzGV5Ba3zhqVdSkN/0J9sjOpX6u21buee2OmTiCMZxq80zfJg==
+
+xterm-addon-web-links@0.1.0-beta6:
+  version "0.1.0-beta6"
+  resolved "https://registry.yarnpkg.com/xterm-addon-web-links/-/xterm-addon-web-links-0.1.0-beta6.tgz#9b4e862be8928ef455a667745bea479665db6c6b"
+  integrity sha512-tkVU5wCfBFjXwfOvcbMHoLoMDANztkwSREiKyu2R059kEF+sP67Z33HzxVCXUWFuCmutcx40xR2O0BK68gXZlg==
+
 y18n@^3.2.0, y18n@^3.2.1:
   version "3.2.1"
   resolved "https://registry.yarnpkg.com/y18n/-/y18n-3.2.1.tgz#6d15fba884c08679c0d77e88e7759e811e07fa41"
@@ -7222,6 +7351,13 @@ yargs@~3.10.0:
     decamelize "^1.0.0"
     window-size "0.1.0"
 
+yauzl@2.4.1:
+  version "2.4.1"
+  resolved "https://registry.yarnpkg.com/yauzl/-/yauzl-2.4.1.tgz#9528f442dab1b2284e58b4379bb194e22e0c4005"
+  integrity sha1-lSj0QtqxsihOWLQ3m7GU4i4MQAU=
+  dependencies:
+    fd-slicer "~1.0.1"
+
 zmodem.js@^0.1.5:
   version "0.1.7"
   resolved "https://registry.yarnpkg.com/zmodem.js/-/zmodem.js-0.1.7.tgz#247affb76d2b1e3042b3fc8b4a087b9d5db8d1ed"