html2canvas плохо переносит текст в Safari - PullRequest
0 голосов
/ 11 марта 2020

html2canvas, похоже, неправильно обрабатывает перенос текста для Safari (по крайней мере, и Catalina, и iOS 13.3.1), тогда как он отлично работает при Chrome и Firefox.

$('#capture').css('color', 'blue');
html2canvas($('#capture')[0], {}).then(function(canvas) {
    $('#capture').css('color', 'red');
     $('#capture').append(canvas);
   });

Вот jsFiddle , который показывает проблему. Я попытался указать большие размеры холста, масштабирование, отступы и поля, установить нулевые значения scrollX и scrollY и, по слухам, LetterRendering, но мне не повезло. Я делаю что-то не так, это ошибка с обходным решением или я просто застрял?

(Возможно, это тот же вопрос, что и Слова перекрываются при рендеринге canvas , но я у меня недостаточно репутации, чтобы комментировать вопрос, и, похоже, мне не следует добавлять свою информацию в качестве ответа, так как это не ответ. Как мне действительно справиться с этим?)

1 Ответ

1 голос
/ 13 марта 2020

В соответствии с моим комментарием выше, это похоже на ошибку в обработке Safari getClientBoundingRect, которая исправлена ​​в "Safari Technology Preview Release 102 WebKit 15610.1.5.2".

Мне кажется, что html2canvas Функция testRangeBounds предназначена для обнаружения некоторых других ошибок в реализации getClientBoundingRect, и если она содержит ошибки, установите для SUPPORT_RANGE_BOUNDS значение false, что заставляет parseTextBounds обрабатывать перенос текста, не полагаясь на getClientBoundingRect. В качестве обходного пути я изменил testRangeBounds, чтобы всегда возвращать false. Это исправило проблему для меня как в Catalina Safari, так и в iOS Safari, и оно продолжает нормально работать в Chrome. Я подозреваю, что недостатком является то, что он медленнее, но я жду ответа на сайте html2canvas на github.

...