enzymejs / enzyme

JavaScript Testing utilities for React
https://enzymejs.github.io/enzyme/
MIT License
19.95k stars 2.01k forks source link

React TS: getDOMNode is not a function #2515

Closed Devwulf closed 3 years ago

Devwulf commented 3 years ago

Current behavior

I have created a minimal, reproducible example here: Devwulf/enzyme-test

I have a class component that returns a simple div with some inner text. This is how the component's test script looks like:

import { shallow } from "enzyme";
import React from "react";
import TestComponent from "./TestComponent";

test("getDOMNode", () => {
    const wrapper = shallow(<TestComponent />);
    const elem = wrapper.find({children: "test"});

    elem.getDOMNode();
});

Whenever I run the test, the error I get is: TypeError: elem.getDOMNode is not a function. However, the Intellisense recognizes it as a function, as well as the type definition.

This is currently on React 17.0.2 with the @wojtekmaj/enzyme-adapter-react-17 adapter. But this also happens on React 16.13.1 with the official enzyme-adapter-react-16 adapter.

Weirdly enough, the test runs properly when mount is used instead of shallow. Is this a limitation of shallow rendering?

Expected behavior

When running the test, the getDOMNode() function should be recognized as a function.

Your environment

API

Version

library version
enzyme 3.11.0
react 17.0.2
react-dom 17.0.2
react-test-renderer 17.0.2
adapter (below)

Adapter

ljharb commented 3 years ago

getDOMNode is not a function on a shallow wrapper, only a mount wrapper. Shallow rendering doesn't involve a DOM at all.