offsetHeight равен нулю при использовании document.write для создания документа - PullRequest
Новая
       11

offsetHeight равен нулю при использовании document.write для создания документа

0 голосов
/ 17 мая 2018

Я пишу модульный тест для проверки директивы Angular 5, которая использует document.querySelectorAll для выбора некоторых элементов.Я создаю приведенную ниже службу-макет, которая возвращает элементы div, соответствующие критериям selector.

class MockDocumentService {
  querySelectorAll(selector: string) {
    const doc = document.implementation.createHTMLDocument('');
    doc.open();
    doc.write(`<html><body><div>
    <div MaxHeight="testMaxHeight">some text</div>
    <div style="height:100px" MaxHeight="testMaxHeight">a taller div</div>
    <div MaxHeight="testMaxHeight">some text</div>
    </div></body></html>`);
    doc.close();
    return doc.querySelectorAll(selector);
  }
}

Он успешно возвращает элементы, однако в моей директиве есть следующее: 

const elements = documentService.querySelectorAll(selector);
let maxHeight = 0;

for (let i = 0; i < elements.length; i++) {
  maxHeight = (<HTMLElement>elements[i]).offsetHeight > maxHeight ? (<HTMLElement>elements[i]).offsetHeight : maxHeight;
}

Наконец, проблема, offsetHeight всегда равна нулю (обратите внимание, что один из элементов divимеет атрибут style, устанавливающий высоту 100px).Как мне получить offsetHeight, чтобы сообщалось правильно.Еще одно замечание: код директивы отлично работает при реальном использовании.

1 Ответ

0 голосов
/ 17 мая 2018

offsetHeight вернет ноль, если элемент не отображается в DOM.

Как правило, offsetHeight элемента представляет собой измерение в пикселях высоты CSS элемента, включая границы, отступы и горизонтальную полосу прокрутки элемента (, если присутствует, если отображается ). Он не включает высоту псевдоэлементов, таких как: before или: after.

Источник: https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/offsetHeight

Вы можете попробовать что-то вроде этого: 

for (let i = 0; i < elements.length; i++) {
  document.body.appendChild(elements[i]);
  maxHeight = elements[i].offsetHeight > maxHeight ? elements[i].offsetHeight : maxHeight;
  document.body.removeChild(elements[i]);
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...