Move cursor blink style to class on .terminal

src/xterm.css

@@ -82,11 +82,11 @@
     background-color: transparent;
 }
 
-.terminal.focus .terminal-cursor.blinking {
-    animation: blink-cursor 1.2s infinite step-end;
+.terminal.focus.xterm-cursor-blink .terminal-cursor {
+    animation: cursor-blink 1.2s infinite step-end;
 }
 
-@keyframes blink-cursor {
+@keyframes cursor-blink {
     0% {
         background-color: #fff;
         color: #000;

src/xterm.js

@@ -408,7 +408,7 @@ Terminal.prototype.setOption = function(key, value) {
   this[key] = value;
   this.options[key] = value;
   switch (key) {
-    case 'cursorBlink': this.refresh(this.y, this.y); break;
+    case 'cursorBlink': this.element.classList.toggle('xterm-cursor-blink', value); break;
   }
 };
 
@@ -566,6 +566,7 @@ Terminal.prototype.open = function(parent) {
   this.element.classList.add('terminal');
   this.element.classList.add('xterm');
   this.element.classList.add('xterm-theme-' + this.theme);
+  this.element.classList.toggle('xterm-cursor-blink', this.options.cursorBlink);
 
   this.element.style.height
   this.element.setAttribute('tabindex', 0);
@@ -1170,11 +1171,7 @@ Terminal.prototype.refresh = function(start, end) {
         }
         if (data !== this.defAttr) {
           if (data === -1) {
-            out += '<span class="reverse-video terminal-cursor';
-            if (this.cursorBlink) {
-              out += ' blinking';
-            }
-            out += '">';
+            out += '<span class="reverse-video terminal-cursor">';
           } else {
             var classNames = [];