RubyLouvre/anu

View on GitHub
packages/render/dom/__tests__/findDOMNode-test.js

Summary

Maintainability
A
35 mins
Test Coverage
"use strict";

const React = require("react");
const ReactDOM = require("react-dom");
const ReactTestUtils = require("test-utils");

describe("findDOMNode", () => {
    it("findDOMNode should return null if passed null", () => {
        expect(ReactDOM.findDOMNode(null)).toBe(null);
    });
    it("findDOMNode should return null if passed undefined", () => {
        expect(ReactDOM.findDOMNode(void 666)).toBe(null);
    });

    it("findDOMNode should find dom element", () => {
        class MyNode extends React.Component {
            render() {
                return (
                    <div>
                        <span>Noise</span>
                    </div>
                );
            }
        }

        const myNode = ReactTestUtils.renderIntoDocument(<MyNode />);
        const myDiv = ReactDOM.findDOMNode(myNode);
        const mySameDiv = ReactDOM.findDOMNode(myDiv);
        expect(myDiv.tagName).toBe("DIV");
        expect(mySameDiv).toBe(myDiv);
    });

    it("findDOMNode should find dom element after an update from null", () => {
        function Bar({flag}) {
            if (flag) {
                return <span>A</span>;
            }
            return null;
        }
        class MyNode extends React.Component {
            render() {
                return <Bar flag={this.props.flag} />;
            }
        }

        const container = document.createElement("div");

        const myNodeA = ReactDOM.render(<MyNode />, container);
        const a = ReactDOM.findDOMNode(myNodeA);
        expect(a).toBe(null);

        const myNodeB = ReactDOM.render(<MyNode flag={true} />, container);
        expect(myNodeA === myNodeB).toBe(true);

        const b = ReactDOM.findDOMNode(myNodeB);
        expect(b.tagName).toBe("SPAN");
    });

    it("findDOMNode should reject random objects", () => {
        expect(function() {
            ReactDOM.findDOMNode({foo: "bar"});
        }).toThrowError(
            // 'Element appears to be neither ReactComponent nor DOMNode. Keys: foo',
        );
    });

    it("findDOMNode should reject unmounted objects with render func", () => {
        class Foo extends React.Component {
            render() {
                return <div />;
            }
        }

        const container = document.createElement("div");
        const inst = ReactDOM.render(<Foo />, container);
        ReactDOM.unmountComponentAtNode(container);
        //这里与官方不一致
        expect(() => ReactDOM.findDOMNode(inst)).not.toThrowError(
     
        );
    });

    it("findDOMNode should not throw an error when called within a component that is not mounted", () => {
        class Bar extends React.Component {
            UNSAFE_componentWillMount() {
                expect(ReactDOM.findDOMNode(this)).toBeNull();
            }

            render() {
                return <div />;
            }
        }

        expect(() => ReactTestUtils.renderIntoDocument(<Bar />)).not.toThrow();
    });
});