Изменение размера textarea при печатании

Создадим общую обёртку вокруг текстовой ареи и дива-емулятора в который будет попадать то же что набирается с клавиатуры или как-то ещё вставляется вырезается. Дадим обоим те же стили чтобы вычислять высоту емулятора и давать такую же еучефкуф. Емулятор располагается за текстовым полем из-за я-штвуч помельче чем у текстареи. В общем, здесь всё видно:

<div id="textareaWrap" style="width: 77%; margin: auto; white-space: normal;">

<textarea style="width: 100%; padding: 1em; font-size: 21px; min-height: 5.5em; z-index: 3; font-family: monospace;" id="textarea"></textarea>

<div id="emulator" style="width: 100%; padding: 1em; font-size: 21px; position: absolute; z-index: 0; top: 0; left: 0; white-space: pre-wrap; min-height: 5.5em; font-family: monospace; opacity: 0;"></div>
</div>

И коротенький код оЙгукн

var textarea = $("#textarea"),
    emulator = $("#emulator"),
    eHeight

textarea.on("input cut change", function(){
  var $that = $(this),
      text = $that.val()
  emulator.text(text)
  eHeight = emulator.height()
  textarea.height(eHeight+25)
})