Отображение содержимого объекта DOM

Question

В одном из моих тестовых модулей мне нужно построить объект DOM

describe('client/blog', () => {
  let htmlDoc;

  beforeEach(() => {
    htmlDoc = window.document;
  });

  it('set the DeletePostHandler', function () {
      var x = htmlDoc.createElement('p'); // Create a <p> element
      var t = htmlDoc.createTextNode('This is a paragraph.'); // Create a text node
      x.appendChild(t); // Append the text to <p>
      htmlDoc.body.appendChild(x);  
      console.log('DOM body: ', JSON.stringify(htmlDoc.body));
      ...
   });
   ...
});

но я не могу отобразить тело DOM в консоли ... в чем подвох? ...

спасибо за отзыв

UPDATE

Я пытался:

console.log('DOM body: ', htmlDoc.body);

Но я получаю только:

console.log tests/client/blog.spec.js:30
DOM body:  {}

Answer 1

Re your update: Похоже, вам нужно сделать специальную функцию для ваших собственных целей. JSON.stringify имеет только собственные , перечисляемые свойства, возможно, поэтому вы не видите то, что хотите видеть (многие свойства элементов DOM не являются собственными, перечисляемыми свойства, например, innerHTML отсутствует в Chrome).

Один из вариантов - записать innerHTML или outerHTML, который покажет вам содержимое элемента или элемента вместе с его содержимым, как HTML:

console.log('DOM body: ', htmlDoc.body.innerHTML);
// or
console.log('DOM body: ', htmlDoc.body.outerHTML);

Если вы хотите сделать что-то более индивидуальное, у вас (предположительно) есть полная доступная вам DOM ...

Answer 2

Чтобы просмотреть узел DOM в консоли, не пытайтесь его структурировать. Просто зарегистрируйте саму переменную.

console.log('DOM body: ', htmlDoc.body);