如何使用Jest测试Vanilla JS Dom操作

Question

我尝试使用类似于文档的代码，但我不明白如何模拟 如果这是我必须要做的，而本质上不复制整个功能，则会发生什么情况。

export const toggleModal = () => {
  const body = document.body;
  const modal = document.querySelector('.modal');
  modal.classList.add('modal-active');
  console.log(modal.classList)
}
const toggleFormBtn = () => {
  const toggleFormBtn = document.querySelector('.toggle-form-btn');
  toggleFormBtn.addEventListener('click', e => {
    toggleModal()
  });
};
export default toggleFormBtn;

<button class="toggle-form-btn">Add Contact</button>
  <div class="modal">
  </div>

'use strict';
import { toggleModal } from './toggleFormBtn';
// toggleModal.mockImplementation(() => {

// });

describe('toggleFormBtn', () => {
  document.body.innerHTML = `
  <button class="toggle-form-btn">Add Contact</button>
  <div class="modal">
  </div>
  `;
  const toggleFormBtn = document.querySelector('.toggle-form-btn');
  const modal = document.querySelector('.modal');
  beforeEach(() => {
    toggleFormBtn.click();
  });
  it('should add modal-active to the  modal on click', () => {
    expect(modal.classList.value).toEqual('modal modal-active');
  });
});