From 3baa6b92371efcb86e689747ea89943d262bfe41 Mon Sep 17 00:00:00 2001
From: Daniel Imms <daimms@microsoft.com>
Date: Sun, 7 May 2017 16:08:01 -0700
Subject: [PATCH] Wrap all characters temporarily in spans to force fixed with

Fixes #467
---
 src/Renderer.ts | 11 +++++++++--
 src/xterm.css   |  3 ++-
 src/xterm.js    |  4 +++-
 3 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/src/Renderer.ts b/src/Renderer.ts
index 041fd67bb..25a04ffc4 100644
--- a/src/Renderer.ts
+++ b/src/Renderer.ts
@@ -283,8 +283,12 @@ export class Renderer {
           }
         }
 
+        // TODO: Consider performance implications of not pulling these from the pool
         if (ch_width === 2) {
-          out += '<span class="xterm-wide-char">';
+          innerHTML += '<span class="xterm-wide-char">';
+        } else {
+          // TODO: Only wrap unicode characters that may vary in width
+          innerHTML += '<span class="xterm-normal-char">';
         }
         switch (ch) {
           case '&':
@@ -310,7 +314,10 @@ export class Renderer {
             break;
         }
         if (ch_width === 2) {
-          out += '</span>';
+          innerHTML += '</span>';
+        } else {
+          // TODO: Only wrap unicode characters that may vary in width
+          innerHTML += '</span>';
         }
 
         attr = data;
diff --git a/src/xterm.css b/src/xterm.css
index a67485e5b..efdc01698 100644
--- a/src/xterm.css
+++ b/src/xterm.css
@@ -153,7 +153,8 @@
     overflow-y: scroll;
 }
 
-.terminal .xterm-wide-char {
+.terminal .xterm-wide-char,
+.terminal .xterm-normal-char {
     display: inline-block;
 }
 
diff --git a/src/xterm.js b/src/xterm.js
index 9e9f9ee9e..fb5301c3d 100644
--- a/src/xterm.js
+++ b/src/xterm.js
@@ -760,7 +760,9 @@ Terminal.loadAddon = function(addon, callback) {
  * character width has been changed.
  */
 Terminal.prototype.updateCharSizeCSS = function() {
-  this.charSizeStyleElement.textContent = '.xterm-wide-char{width:' + (this.charMeasure.width * 2) + 'px;}';
+  this.charSizeStyleElement.textContent =
+      '.xterm-wide-char{width:' + (this.charMeasure.width * 2) + 'px;}' +
+      '.xterm-normal-char{width:' + this.charMeasure.width + 'px;}'
 }
 
 /**