diff --git a/src/CompositionHelper.js b/src/CompositionHelper.js index 3ce3835f..3bf829e5 100644 --- a/src/CompositionHelper.js +++ b/src/CompositionHelper.js @@ -187,9 +187,14 @@ CompositionHelper.prototype.updateCompositionElements = function(dontRecurse) { this.compositionView.style.top = cursorTop + 'px'; this.compositionView.style.height = cursor.offsetHeight + 'px'; this.compositionView.style.lineHeight = cursor.offsetHeight + 'px'; + // Sync the textarea to the exact position of the composition view so the IME knows where the + // text is. var compositionViewBounds = this.compositionView.getBoundingClientRect(); - this.textarea.style.left = cursor.offsetLeft + compositionViewBounds.width + 'px'; - this.textarea.style.top = cursor.cursorTop + 'px'; + this.textarea.style.left = cursor.offsetLeft + 'px'; + this.textarea.style.top = cursorTop + 'px'; + this.textarea.style.width = compositionViewBounds.width + 'px'; + this.textarea.style.height = compositionViewBounds.height + 'px'; + this.textarea.style.lineHeight = compositionViewBounds.height + 'px'; } if (!dontRecurse) { setTimeout(this.updateCompositionElements.bind(this, true), 0); diff --git a/src/xterm.css b/src/xterm.css index bf1442de..55f006f7 100644 --- a/src/xterm.css +++ b/src/xterm.css @@ -65,6 +65,10 @@ width: 0; height: 0; z-index: -10; + /** Prevent wrapping so the IME appears against the textarea at the correct position */ + white-space: nowrap; + overflow: hidden; + resize: none; } .terminal .terminal-cursor {