Given the React component:
class Component extends React.Component {
render() {
return <div>text</div>;
}
}
Is it possible to get the root DOM node with enzyme?
Ever since 2.7.0, you can do it with getDOMNode:
import { mount } from 'enzyme';
const wrapper = mount(<Component />);
const node = wrapper.getDOMNode();
// now you can access node properties
console.log(node.innerText); // 'text'
But getDOMNode
doesn’t work for functional components:
function FunctionalComponent() {
return <div>text</div>;
}
const wrapper = mount(<FunctionalComponent />);
wrapper.getDOMNode(); // throws an error
You’ll need to use findDOMNode on the wrapper’s node:
import { findDOMNode } from 'react-dom';
const wrapper = mount(<FunctionalComponent />);
const node = findDOMNode(wrapper.node);
// works
console.log(node.innerHTML); // 'text'