Add PhantomJS test support and CharMeasure tests

Fixes #534
2026-08-05 13:43:48 -07:00 · 2017-02-08 19:53:32 -08:00
parent 639a2fd509
commit 1306431e7c
6 changed files with 102 additions and 0 deletions
@@ -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.
@@ -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",
@@ -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;
@@ -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);
+      });
+    });
+  });
+
+}
@@ -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.
 *
@@ -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>