docbrown/app/javascript/utilities/__tests__/billboardInteractivity.test.js

// Import the function to test and any necessary parts
import { setupBillboardInteractivity } from '@utilities/billboardInteractivity';

describe('billboard close functionality', () => {
  beforeEach(() => {
    // Setup a simple DOM structure that includes only the elements needed for the close functionality
    document.body.innerHTML = `
      <div class="another-element"></div>
      <div class="js-billboard" style="display: block;">
        <button id="sponsorship-close-trigger-1"></button>
      </div>
    `;
  });

  it('hides billboard on close button click', () => {
    setupBillboardInteractivity();

    // Simulate clicking the close button
    const closeButton = document.querySelector('#sponsorship-close-trigger-1');
    closeButton.click();

    // Assert the billboard is hidden
    const billboard = document.querySelector('.js-billboard');
    expect(billboard.style.display).toBe('none');
  });

  it('hides billboard when clicking outside of it', () => {
    setupBillboardInteractivity();

    // Simulate a click outside the billboard
    const anotherElement = document.querySelector('.another-element');
    anotherElement.click();

    // Assert the billboard is hidden
    const billboard = document.querySelector('.js-billboard');
    expect(billboard.style.display).toBe('none');
  });
});