JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/qunit/qunit-2.3.2.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-2.3.2.css">
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<div id="qunit"></div>
<div id="qunit-fixture"></div>

JavaScript

QUnit.test('the modal is open by default', (assert) => {
  // Arrange (compile)
  // Act (to open by default when compiled)
  const compiledModal = compileComponent('<modal></modal>');

  // Assert (that is open)
  const actual = compiledModal.find('.modal').is(':visible');
  const expected = true;
  assert.strictEqual(actual, expected, 'Modal should be visible in the screen');
});

function compileComponent(template) {
  const component = $(template);
  component.html(`
    <div class="modal">
      <h1>My Modal</h1>
    </div>
  `);
  return component.appendTo('#qunit-fixture');
}