текстовое преобразование: прописные буквы и chrome

Question

У меня есть ситуация в Google Chrome, когда innerText элемента напрямую изменяется моим css s text-transform: uppercase. Событие мутации запускается переключением на contenteditable в родительском div.

innerText изначально имеет значение «xyz», но после переключения element.innerText возвращает «XYZ» (по-прежнему xyz в внутренний HTML).

let doct = document.getElementById("docTitle");

var changeDocumentTitle = function(e) {
  console.log('changeDocumentTitle: ' + document.getElementById("docTitle").innerText);
};

//  TODO: code for using mutation observer. Works in Firefox, ends up capitalizing the title in google
var observer = new MutationObserver(changeDocumentTitle);
var config = {
  attributes: true,
  childList: true,
  subtree: true
};
observer.observe(doct, config);

#docTitle {
  display: block;
  font-size: 32px;
  font-weight: 900;
  color: inherit;
  margin: 0.67em 0;
  page-break-after: avoid font-family: Arial, sans-serif;
  text-align: center;
  text-transform: uppercase;
}

<h1 id="docTitle">xyz</h1>

Я вижу это в Chrome, но не в Firefox. Это ошибка в chrome? Есть ли обходной путь? Я подумал о том, чтобы просто попытаться удалить части тега html из .inner HTML ... Это лучший вариант?

Answer 1

Гай Инкогнито ответил на этот вопрос в своем первом комментарии, отметив, что я неправильно использовал .innerText и что я должен использовать (и теперь использую) .textContent для получения содержимого элемента -er- text.