From 1306431e7c3883e80f29707eeb327693ccf5e306 Mon Sep 17 00:00:00 2001
From: Daniel Imms <daimms@microsoft.com>
Date: Wed, 8 Feb 2017 19:53:32 -0800
Subject: [PATCH] Add PhantomJS test support and CharMeasure tests

Fixes #534
---
 gulpfile.js                      |  5 +++
 package.json                     |  1 +
 src/Interfaces.ts                |  6 +++
 src/utils/CharMeasure.phantom.ts | 65 ++++++++++++++++++++++++++++++++
 src/xterm.js                     |  3 ++
 test-harness.html                | 22 +++++++++++
 6 files changed, 102 insertions(+)
 create mode 100644 src/utils/CharMeasure.phantom.ts
 create mode 100644 test-harness.html

diff --git a/gulpfile.js b/gulpfile.js
index 144b8831..2aaf21ac 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -3,6 +3,7 @@ const buffer = require('vinyl-buffer');
 const fs = require('fs-extra');
 const gulp = require('gulp');
 const merge = require('merge-stream');
+const mochaPhantom = require('gulp-mocha-phantomjs');
 const sorcery = require('sorcery');
 const source = require('vinyl-source-stream');
 const sourcemaps = require('gulp-sourcemaps');
@@ -70,6 +71,10 @@ gulp.task('browserify', ['tsc'], function() {
   return merge(bundleStream, copyAddons, copyStylesheets);
 });
 
+gulp.task('test-phantom', function () {
+  return gulp.src('test-harness.html')
+      .pipe(mochaPhantom());
+});
 
 /**
  * Use `sorcery` to resolve the source map chain and point back to the TypeScript files.
diff --git a/package.json b/package.json
index 3e8a8d55..8e766d2f 100644
--- a/package.json
+++ b/package.json
@@ -47,6 +47,7 @@
     "glob": "^7.0.5",
     "gulp": "^3.9.1",
     "gulp-cli": "^1.2.2",
+    "gulp-mocha-phantomjs": "^0.12.0",
     "gulp-sourcemaps": "1.9.1",
     "gulp-typescript": "^3.1.3",
     "jsdoc": "3.4.3",
diff --git a/src/Interfaces.ts b/src/Interfaces.ts
index c876d256..92094c95 100644
--- a/src/Interfaces.ts
+++ b/src/Interfaces.ts
@@ -44,6 +44,12 @@ export interface ITerminal {
   emit(event: string, data: any);
 }
 
+export interface ICharMeasure {
+  width: number;
+  height: number;
+  measure(): void;
+}
+
 interface ICircularList<T> {
   length: number;
   maxLength: number;
diff --git a/src/utils/CharMeasure.phantom.ts b/src/utils/CharMeasure.phantom.ts
new file mode 100644
index 00000000..f8173dc6
--- /dev/null
+++ b/src/utils/CharMeasure.phantom.ts
@@ -0,0 +1,65 @@
+/**
+ * @license MIT
+ */
+import { ICharMeasure, ITerminal } from '../Interfaces';
+
+declare var assert: Chai.Assert;
+declare var Terminal: ITerminal;
+
+// Do not describe tests unless in PhantomJS environment
+if (typeof Terminal !== 'undefined') {
+
+  const CharMeasure = (<any>Terminal).CharMeasure;
+
+  describe('CharMeasure', () => {
+    const parentElement = document.createElement('div');
+    let charMeasure: ICharMeasure;
+
+    beforeEach(() => {
+      charMeasure = new CharMeasure(parentElement);
+      document.querySelector('#xterm').appendChild(parentElement);
+    });
+
+    afterEach(() => {
+      if (parentElement && parentElement.parentElement) {
+        parentElement.parentElement.removeChild(parentElement);
+      }
+    });
+
+    describe('measure', () => {
+      it('should be performed async on first call', done => {
+        assert.equal(charMeasure.width, null);
+        charMeasure.measure();
+        assert.equal(charMeasure.width, null);
+        setTimeout(() => {
+          assert.isTrue(charMeasure.width > 0);
+          done();
+        }, 0);
+      });
+
+      it('should be performed sync on successive calls', done => {
+        charMeasure.measure();
+        setTimeout(() => {
+          const firstWidth = charMeasure.width;
+          parentElement.style.fontSize = '2em';
+          charMeasure.measure();
+          assert.equal(charMeasure.width, firstWidth * 2);
+          done();
+        }, 0);
+      });
+
+      it('should NOT do a measure when the parent is hidden', done => {
+        charMeasure.measure();
+        setTimeout(() => {
+          const firstWidth = charMeasure.width;
+          parentElement.style.display = 'none';
+          parentElement.style.fontSize = '2em';
+          charMeasure.measure();
+          assert.equal(charMeasure.width, firstWidth);
+          done();
+        }, 0);
+      });
+    });
+  });
+
+}
diff --git a/src/xterm.js b/src/xterm.js
index 314a76d0..f76c01b5 100644
--- a/src/xterm.js
+++ b/src/xterm.js
@@ -2237,6 +2237,9 @@ function keys(obj) {
 Terminal.EventEmitter = EventEmitter;
 Terminal.inherits = inherits;
 
+// Expose for Phantom.JS tests
+Terminal.CharMeasure = CharMeasure;
+
 /**
  * Adds an event listener to the terminal.
  *
diff --git a/test-harness.html b/test-harness.html
new file mode 100644
index 00000000..8c5f0b30
--- /dev/null
+++ b/test-harness.html
@@ -0,0 +1,22 @@
+<html>
+  <head>
+    <meta charset="utf-8">
+    <!-- encoding must be set for mocha's special characters to render properly -->
+    <link rel="stylesheet" href="node_modules/mocha/mocha.css" />
+  </head>
+  <body>
+    <div id="mocha"></div>
+    <div id="xterm"></div>
+    <script src="node_modules/mocha/mocha.js"></script>
+    <script src="node_modules/chai/chai.js"></script>
+    <script>
+      mocha.ui('bdd')
+      assert = chai.assert
+    </script>
+    <script src="build/xterm.js"></script>
+    <script src="lib/utils/CharMeasure.phantom.js"></script>
+    <script>
+      mocha.run()
+    </script>
+  </body>
+</html>