ClientHeight w testach.

Question

Cześć. Piszę testy dla klasy javascriptu. Najpierw sztucznie wstrzykuję potrzebne elementy do document.body, pobieram je do obiektu i przekazuję konstruktorowi. Potem event podpięty do jednego z elementów (w konstruktorze) wywołuje metodę klasy, która korzysta z wartości clientHeight.

Problem polega na tym, że cały czas zwraca ona 0, nieważne że przed tym przypiszę jakąś wysokość do elementu za pomocą style.height. Jak obejść takie zachowanie, gdy kod js nie jest odpalany w przeglądarce a w test runnerze (używam Jest)?

Comments

Znalazłem narzędzie o nazwie JSDOM, ale nie wiem czy kod ma tak wyglądać, bo dalej zwraca to samo:

import { JSDOM } from 'jsdom';

const dom = new JSDOM('<div class="some-div"></div>');

const window = dom.window;
const document = window.document;

it('Sets height', () => {
  const someDiv = document.querySelector('.some-div');
  someDiv.style.height = "20px";

  expect(someDiv.clientHeight).toBe(20); // Zwraca 0
});

Może niejasno opisałem o co mi chodzi, myślę że w powyższym teście wszystko ładnie widać :)

Trudno znaleźć jakiekolwiek informacje na ten temat.

Answer 1

Jeśli możesz to pokaż część skryptów

Comments

Po prostu mam element któremu przypisuję style.height na np. "20px". I potem gdy chcę pobrać z niego wysokość za pomocą clientHeight to zwraca 0, gdy pobieram za pomocą style.height działa zwracając "20px".

---

https://stackoverflow.com/questions/32438642/clientwidth-and-clientheight-report-zero-while-getboundingclientrect-is-correct

---

Nie o to chodzi.