Html2canvas почему текст в textarea не переходит на новую строчку?

Question

[Огуречик]

Нужно сделать возможность сохранения блока как картинку, планируется эдакий генератор заполненного документа на печать.
Начал искать простые варианты - наткнулся на "Html2canvas". Полностью подходит, но возникла проблема.
Сейчас на тестовой (локально) странице только textarea и кнопка, стили никакие кроме фона не прописаны.
На скриншоте сверху textarea, потом кнопка и собственно сам canvas с результатом.



Код страницы:

<div id="box"><textarea></textarea></div>
<button id="btnSave">btnSave</button>
<div id="img-out"></div>

Код обработки клика кнопки:

$("#btnSave").click(function() { 
				html2canvas(
					$("#box")[0], 
					{
						allowTaint: true,
						backgroundColor: null
					}
				).then(function(canvas) {
					$("#img-out").append(canvas);
				});
			});

Знаю про свойство foreignObjectRendering: true - с ним всё ок, но пропадают фоновые элементы различных блоков (сейчас для примера убрал всё лишее, но предполагается наличия "декоративных" элементов в виде рамок и печатей)

На https://html2canvas.hertzen.com/ внизу справа есть демонстрация работы, можно сделать скрин всей страницы и посмотреть результат. Попробовал на https://html2canvas.hertzen.com/ в контент (через F12) добавить textarea и посмотреть результат - таких проблем там нет.

И я не понимаю что не так делаю, пробовал задавать для textarea разные CSS свойства, например overflow-wrap, но это не дало результата.

Comments

[Stranger in the Q]

html2canvas штука не надежная, бог его знает что еще из спецификации там реализовано не до конца, эта библиотека сама рендерит Html/css

Answer 1

[Skip85]

Была такая же проблема.
Попробуй предыдущую версию.
Она рендерит textarea правильно.
https://cdnjs.cloudflare.com/ajax/libs/html2canvas...

Comments

[Огуречик]

Спасибо за ответ, обязательно попробую.