Firefox ошибочно обрезает конечные пробелы при редактировании
ОС: Linux Mint 18.3, Firefox 72.
Я исследовал это явление и обнаружил, что он существует только в FF, а не в Chrome (например).
Эта проблема, в общем, относится к элементам (возможно, DIV
или TD
), когда для их глобального атрибута contentEditable установлено значениеtrue
.
Вы можете сами увидеть проблему, если зайдете сюда, получите этот HTML + JS и запустите его в своих браузерах.
Конкретную проблему при загрузке этого файла можно увидеть, если вы поместите курсор после "ipsum", а затем нажмите Ctrl-Backspace, чтобы удалить слово "ipsum". Результат кажется нормальным: когда вы видите, что курсор мигает после этого, кажется, что после "Lorem" стоит конечный пробел. Но когда я затем набираю какую-нибудь букву после этого, она застревает на "Lorem"... например, я набираю "m" и вижу "Loremm".
Это не то, как это работает с тем же файлом HTML в Chrome: там, когда я набираю "m", я вижу "Lorem m".
Еще более странно, когда я набираю больше слов в Firefox после "Lorem ipsum" ... а затем использую Ctrl-Backspace и начинаю печатать, проблема не возникает: конечные пробелы сохраняются должным образом.
Есть еще одна вещь, которую я наблюдал в FF: если вместо Ctrl-Backspace я несколько раз использую Backspace, то есть букву за буквой, пока я не удалю "ipsum", оставив конечный пробел. И если я затем начну печатать... конечные пробелы сохранятся.
Я дошел до того, что написал MutationObserver, чтобы посмотреть, что здесь происходит, и есть ли возможное обходное решение. Проблема в том, что браузер FF фактически выполняет эту обрезку доMutationObserver
запускает любое событие.
Существует возможное обходное решение, над которым я работаю: перехват ключевого события, и если это "Ctrl + Backspace", чтобы сделать event.preventDefault()
. Это действительно останавливает удаление слова. Затем мне пришлось бы реализовать заменяющее решение, включая, возможно, удаление буквы за буквой, пока я не найду пробел.
Мне это кажется ошибкой.
Вот возможный ключ к разгадке того, о чем это может быть: когда я впервые перехватываю это событие (например, на Ctrl-Backspace) и исследуюevent.target
, Я считаю, что innerHTML
правильный, т.е. имеет конечный пробел, но что innerText
неверно, т.е. конечный пробел был обрезан. Я немного прочитал об этом, и, похоже,innerText
как они говорят, в первую очередь касается того, "как какой-то текст представлен на странице".