Support focus class on the .xterm element

diff --git a/src/xterm.css b/src/xterm.css
index 348fc097f67b72349fc34c8cde5a9689a148d64c..4f1f4796ec4b16d7cc0ef4c727d71bc09ce46a9c 100644 (file)
--- a/src/xterm.css
+++ b/src/xterm.css
@@ -43,7 +43,7 @@
     position: relative;
 }
 
-.terminal:focus {
+.terminal.focus {
     outline: none;
 }
 
@@ -57,11 +57,11 @@
      * HACK: to fix IE's blinking cursor
      * Move textarea out of the screen to the far left, so that the cursor is not visible.
      */
-    text-indent: -9999em;
+    /*text-indent: -9999em;
     opacity: 0;
     width: 0;
     height: 0;
-    z-index: -10;
+    z-index: -10;*/
 }
 
 .terminal .terminal-cursor {
@@ -69,13 +69,13 @@
     color: #000;
 }
 
-.terminal:not(:focus) .terminal-cursor {
+.terminal:not(.focus) .terminal-cursor {
     outline: 1px solid #fff;
     outline-offset: -1px;
     background-color: transparent;
 }
 
-.terminal:focus .terminal-cursor.blinking {
+.terminal.focus .terminal-cursor.blinking {
     animation: blink-cursor 1.2s infinite step-end;
 }
 

diff --git a/src/xterm.js b/src/xterm.js
index 30e6aee5feac8b61906cbeb9b172c7e3cdeddfcb..a33261c0288a3c3391c635e3065bb0ab0b4df5a4 100644 (file)
--- a/src/xterm.js
+++ b/src/xterm.js
@@ -442,6 +442,7 @@
         this.send('\x1b[I');
       }
 
+      this.element.classList.add('focus');
       this.showCursor();
       this.textarea.focus();
       Terminal.focus = this;
@@ -474,6 +475,7 @@
         return;
       }
 
+      this.element.classList.remove('focus');
       this.cursorState = 0;
       this.refresh(this.y, this.y);
       this.textarea.blur();