Render Helper for React

createRenderer.js

import React from 'react';
import { renderIntoDocument } from 'react-addons-test-utils';
import { findDOMNode } from 'react-dom';

/**
 * This is a higher order function, which creates a renderer
 * for a specified component. You call the resulting function with `props`,
 * and in return get an object containing the rendered component as
 * well as the props that were passed in initially.
 */

export default Component => props => {
  const component = renderIntoDocument(
    <Component {...props} />
  );

  return {
    output: findDOMNode(component),
    component,
    props
  }
}

IconSpec.js

import Icon from './';
import createRenderer from 'utilities/createRenderer';

const render = createRenderer(Icon);

describe('Component: Icon', () => {

  it('has the correct attributes', () => {
    const { output } = render({
      lowResSrc,
      highResSrc,
      placeholderSrc,
      initialSrc
    });

    const subject = output.getAttribute('class');
    const expectation = 'icon';

    expect(subject).to.equal(expectation);
  });
});