[Tests] add createRef tests

Closes #1704
enzymejs · Aug 15, 2018 · d8a45b9 · d8a45b9
1 parent 1b0c212
commit d8a45b9
Show file tree

Hide file tree

Showing 3 changed files with 84 additions and 4 deletions.
diff --git a/packages/enzyme-test-suite/test/ReactWrapper-spec.jsx b/packages/enzyme-test-suite/test/ReactWrapper-spec.jsx
@@ -21,6 +21,7 @@ import {
   createClass,
   createContext,
   createPortal,
+  createRef,
   Fragment,
 } from './_helpers/react-compat';
 import {
@@ -4505,7 +4506,7 @@ describeWithDOM('mount', () => {
   });
 
   describe('.getElement()', () => {
-    it('returns nodes with refs as well as well', () => {
+    it('returns nodes with refs as well', () => {
       class Foo extends React.Component {
         constructor(props) {
           super(props);
@@ -4531,6 +4532,26 @@ describeWithDOM('mount', () => {
       expect(wrapper.instance().node).to.equal(mockNode);
     });
 
+    itIf(is('>= 16.3'), 'returns nodes with createRefs as well', () => {
+      class Foo extends React.Component {
+        constructor(props) {
+          super(props);
+          this.setRef = createRef();
+        }
+
+        render() {
+          return (
+            <div>
+              <div ref={this.setRef} className="foo" />
+            </div>
+          );
+        }
+      }
+      const wrapper = mount(<Foo />);
+      const element = wrapper.find('.foo').instance();
+      expect(wrapper.instance().setRef).to.have.property('current', element);
+    });
+
     it('does not add a "null" key to elements with a ref and no key', () => {
       class Foo extends React.Component {
         constructor(props) {
@@ -4549,7 +4570,24 @@ describeWithDOM('mount', () => {
         }
       }
       const wrapper = mount(<Foo />);
-      expect(wrapper.getElement().key).to.equal(null);
+      expect(wrapper.getElement()).to.have.property('key', null);
+    });
+
+    itIf(is('>= 16.3'), 'does not add a "null" key to elements with a createRef and no key', () => {
+      class Foo extends React.Component {
+        constructor(props) {
+          super(props);
+          this.setRef = createRef();
+        }
+
+        render() {
+          return (
+            <div ref={this.setRef} className="foo" />
+          );
+        }
+      }
+      const wrapper = mount(<Foo />);
+      expect(wrapper.getElement()).to.have.property('key', null);
     });
   });
 

diff --git a/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx b/packages/enzyme-test-suite/test/ShallowWrapper-spec.jsx
@@ -20,6 +20,7 @@ import './_helpers/setupAdapters';
 import {
   createClass,
   createContext,
+  createRef,
   Fragment,
 } from './_helpers/react-compat';
 import {
@@ -5611,7 +5612,7 @@ describe('shallow', () => {
   });
 
   describe('.getElement()', () => {
-    it('returns nodes with refs as well as well', () => {
+    it('returns nodes with refs as well', () => {
       class Foo extends React.Component {
         constructor(props) {
           super(props);
@@ -5637,6 +5638,26 @@ describe('shallow', () => {
       expect(wrapper.instance().node).to.equal(mockNode);
     });
 
+    itIf(is('>= 16.3'), 'returns nodes with createRefs as well', () => {
+      class Foo extends React.Component {
+        constructor(props) {
+          super(props);
+          this.setRef = createRef();
+        }
+
+        render() {
+          return (
+            <div>
+              <div ref={this.setRef} className="foo" />
+            </div>
+          );
+        }
+      }
+      const wrapper = shallow(<Foo />);
+      // shallow rendering does not invoke refs
+      expect(wrapper.instance().setRef).to.have.property('current', null);
+    });
+
     it('does not add a "null" key to elements with a ref and no key', () => {
       class Foo extends React.Component {
         constructor(props) {
@@ -5655,7 +5676,24 @@ describe('shallow', () => {
         }
       }
       const wrapper = shallow(<Foo />);
-      expect(wrapper.getElement().key).to.equal(null);
+      expect(wrapper.getElement()).to.have.property('key', null);
+    });
+
+    itIf(is('>= 16.3'), 'does not add a "null" key to elements with a createRef and no key', () => {
+      class Foo extends React.Component {
+        constructor(props) {
+          super(props);
+          this.setRef = createRef();
+        }
+
+        render() {
+          return (
+            <div ref={this.setRef} className="foo" />
+          );
+        }
+      }
+      const wrapper = shallow(<Foo />);
+      expect(wrapper.getElement()).to.have.property('key', null);
     });
   });
 

diff --git a/packages/enzyme-test-suite/test/_helpers/react-compat.js b/packages/enzyme-test-suite/test/_helpers/react-compat.js
@@ -10,6 +10,7 @@ let createClass;
 let renderToString;
 let createPortal;
 let createContext;
+let createRef;
 let forwardRef;
 let Fragment;
 let StrictMode;
@@ -45,12 +46,14 @@ if (is('^16.2.0-0')) {
 if (is('^16.3.0-0')) {
   ({
     createContext,
+    createRef,
     forwardRef,
     StrictMode,
     unstable_AsyncMode: AsyncMode,
   } = require('react'));
 } else {
   createContext = null;
+  createRef = null;
   forwardRef = null;
   StrictMode = null;
   AsyncMode = null;
@@ -69,6 +72,7 @@ export {
   renderToString,
   createPortal,
   createContext,
+  createRef,
   forwardRef,
   Fragment,
   StrictMode,