@hanbi/web-utils

A small collection of test helpers for the web

Usage no npm install needed!

<script type="module">
  import hanbiWebUtils from 'https://cdn.skypack.dev/@hanbi/web-utils';
</script>

README

npm

@hanbi/web-utils

@hanbi/web-utils is a small collection of utilities for reducing boilerplate in tests of primarily web-based projects.

Install

$ npm i -D @hanbi/web-utils

Usage

waitForFrame()

Uses requestAnimationFrame to wait for a single animation frame before continuing.

test('my test', async () => {
  // dom setup here
  await utils.waitForFrame();
});

waitForSelector(node, selector[, attempts])

Waits for a CSS selector to match an element in a specified node.

test('my test', async () => {
  // dom setup here
  await utils.waitForSelector(document.body, 'my-element');
});

waitForEvent(node, event)

Waits for a particular event to have been emitted by the specified node.

NOTE this should usually be called and awaited separately as you'll see in the example. This is to ensure any internal event handlers have been setup before continuing.

test('my test', async () => {
  // dom setup here
  const eventPromise = utils.waitforEvent(node, 'load');
  // do whatever should cause the 'load' event to be emitted
  const event = await eventPromise;
  // `event` is now the event which was emitted
});

License

MIT