requestOnIdle.js

requestOnIdle.js

const isRequestIdleCallbackSupported =
  'requestIdleCallback' in window &&
  typeof window.requestIdleCallback === 'function';

/**
 * A higher order function that wraps passed function to run
 * inside of a requestIdleCallback or "onload" event
 * depending on what is supported in the browser.
 *
 * This is useful for running low priority app level bootstrapping events.
 *
 * @param {Function} fn - Function to requestIdleCallback when called
 * @return {Function<Promise>} - Returns a function that returns a Promise of the return value.
 */
export default function requestOnIdle(fn) {
  return (...args) => {
    return new Promise(resolve => {
      const loadFn = () => {
        // Call passed function with same args
        // and Resolve Promise
        resolve(fn(...args));

        // Remove listener if requestIdleCallback is not supported
        if (isRequestIdleCallbackSupported === false) {
          window.removeEventListener('load', loadFn);
        }
      };

      if (isRequestIdleCallbackSupported) {
        window.requestIdleCallback(loadFn);
        return;
      }

      // Add load eventListener
      window.addEventListener('load', loadFn);
    });
  };
}

requestOnIdle.test.js

afterEach(() => {
  // Clean up
  delete window.requestIdleCallback;
  jest.resetModules();
});

it('should use requestIdleCallback if supported', () => {
  const load = jest.fn();
  window.requestIdleCallback = jest.fn();
  const requestOnIdle = require('../requestOnIdle').default;
  requestOnIdle(load)();
  expect(window.requestIdleCallback).toHaveBeenCalledTimes(1);
});

it('should use eventListeners if requestIdleCallback is not supported', done => {
  const load = jest.fn();
  window.addEventListener = jest.fn((event, eventListener) => {
    expect(event).toBe('load');

    window.removeEventListener = jest.fn((event, removeListener) => {
      expect(event).toBe('load');
      expect(eventListener).toBe(removeListener);
      delete window.removeEventListener;
      done();
    });
    // Call Listener
    eventListener();
  });
  const requestOnIdle = require('../requestOnIdle').default;
  requestOnIdle(load)();
  expect(window.addEventListener).toHaveBeenCalled();
});