Edit This Page

Full Rendering API (`mount(...)`)

Full DOM rendering is ideal for use cases where you have components that may interact with DOM apis, or may require the full lifecycle in order to fully test the component (ie, componentDidMount etc.)

Full DOM rendering depends on a library called jsdom which is essentially a headless browser implemented completely in JS.

import { mount } from 'enzyme';

describe('<Foo />', () => {

  it('calls componentDidMount', () => {
    spy(Foo.prototype, 'componentDidMount');
    const wrapper = mount(<Foo />);
    expect(Foo.prototype.componentDidMount.calledOnce).to.be.true;
  });

  it('allows us to set props', () => {
    const wrapper = mount(<Foo bar="baz" />);
    expect(wrapper.props().bar).to.equal("baz");
    wrapper.setProps({ bar: "foo" });
    expect(wrapper.props().bar).to.equal("foo");
  });

  it('simulates click events', () => {
    const onButtonClick = spy();
    const wrapper = mount(
      <Foo onButtonClick={onButtonClick} />
    );
    wrapper.find('button').click();
    expect(onButtonClick.calledOnce).to.be.true;
  });

});

ReactWrapper API

`.find(selector) => ReactWrapper`

Find every node in the render tree that matches the provided selector.

`.findWhere(predicate) => ReactWrapper`

Find every node in the render tree that return true for the provided predicate function.

`.filter(selector) => ReactWrapper`

Remove nodes in the current wrapper that do not match the provided selector.

`.filterWhere(predicate) => ReactWrapper`

Remove nodes in the current wrapper that do not return true for the provided predicate function.

`.contains(node) => Boolean`

Returns whether or not a given node is somewhere in the render tree.

`.hasClass(className) => Boolean`

Returns whether or not the current root node has the given class name or not.

`.is(selector) => Boolean`

Returns whether or not the current node matches a provided selector.

`.not(selector) => ReactWrapper`

Remove nodes in the current wrapper that match the provided selector. (inverse of .filter())

`.children() => ReactWrapper`

Get a wrapper with all of the children nodes of the current wrapper.

`.parents() => ReactWrapper`

Get a wrapper with all of the parents (ancestors) of the current node.

`.parent() => ReactWrapper`

Get a wrapper with the direct parent of the current node.

`.closest(selector) => ReactWrapper`

Get a wrapper with the first ancestor of the current node to match the provided selector.

`.text() => String`

Returns a string representation of the text nodes in the current render tree.

`.get(index) => ReactWrapper`

Returns the node at the provided index of the current wrapper.

`.at(index) => ReactWrapper`

Returns a wrapper of the node at the provided index of the current wrapper.

`.first() => ReactWrapper`

Returns a wrapper of the first node of the current wrapper.

`.last() => ReactWrapper`

Returns a wrapper of the last node of the current wrapper.

`.state([key]) => Any`

Returns the state of the root component.

`.props() => Object`

Returns the props of the root component.

`.prop(key) => Any`

Returns the named prop of the root component.

`.simulate(event[, data]) => ReactWrapper`

Simulates an event on the current node.

`.setState(nextState) => ReactWrapper`

Manually sets state of the root component.

`.setProps(nextProps) => ReactWrapper`

Manually sets props of the root component.

`.instance() => ReactComponent`

Returns the instance of the root component.

`.update() => ReactWrapper`

Calls .forceUpdate() on the root component instance.

`.type() => String|Function`

Returns the type of the current node of the wrapper.

`.forEach(fn) => ReactWrapper`

Iterates through each node of the current wrapper and executes the provided function

`.map(fn) => Array`

Maps the current array of nodes to another array.

`reduce(fn[, initialValue]) => Any`

Reduces the current array of nodes to a value

`reduceRight(fn[, initialValue]) => Any`

Reduces the current array of nodes to a value, from right to left.

`some(selector) => Boolean`

Returns whether or not any of the nodes in the wrapper match the provided selector.

`someWhere(predicate) => Boolean`

Returns whether or not any of the nodes in the wrapper pass the provided predicate function.

`every(selector) => Boolean`

Returns whether or not all of the nodes in the wrapper match the provided selector.

`everyWhere(selector) => Boolean`

Returns whether or not any of the nodes in the wrapper pass the provided predicate function.