fix: maximum call stack size, create-react-context ref setting (#317)

Author: piecyk

.size-snapshot.json

@@ -1,25 +1,25 @@
 {
   "dist/index.umd.js": {
-    "bundled": 67000,
-    "minified": 23875,
-    "gzipped": 7202
+    "bundled": 67296,
+    "minified": 23836,
+    "gzipped": 7176
   },
   "dist/index.umd.min.js": {
-    "bundled": 31451,
-    "minified": 12925,
-    "gzipped": 4201
+    "bundled": 31932,
+    "minified": 12958,
+    "gzipped": 4186
   },
   "dist/index.esm.js": {
-    "bundled": 12172,
-    "minified": 7049,
-    "gzipped": 2064,
+    "bundled": 12751,
+    "minified": 7575,
+    "gzipped": 2077,
     "treeshaked": {
       "rollup": {
-        "code": 3742,
+        "code": 3790,
         "import_statements": 137
       },
       "webpack": {
-        "code": 4872
+        "code": 4900
       }
     }
   }

src/Manager.js

@@ -3,7 +3,9 @@ import * as React from 'react';
 import createContext, { type Context } from 'create-react-context';
 
 export const ManagerReferenceNodeContext: Context<?HTMLElement> = createContext();
-export const ManagerReferenceNodeSetterContext: Context<void | (?HTMLElement) => void> = createContext();
+export const ManagerReferenceNodeSetterContext: Context<
+  void | ((?HTMLElement) => void)
+> = createContext();
 
 export type ManagerProps = {
   children: React.Node,
@@ -13,12 +15,16 @@ export default class Manager extends React.Component<ManagerProps> {
   referenceNode: ?HTMLElement;
 
   setReferenceNode = (newReferenceNode: ?HTMLElement) => {
-    if (this.referenceNode !== newReferenceNode) {
+    if (newReferenceNode && this.referenceNode !== newReferenceNode) {
       this.referenceNode = newReferenceNode;
       this.forceUpdate();
     }
   };
 
+  componentWillUnmount() {
+    this.referenceNode = null;
+  }
+
   render() {
     return (
       <ManagerReferenceNodeContext.Provider value={this.referenceNode}>

src/Manager.test.js

@@ -65,8 +65,6 @@ describe('Managed Reference', () => {
     let ReferenceComp = ({ innerRef }) => (
       <div
         ref={node => {
-          // We just want to invoke this once so that we have access to the referenceElement in the upper scope.
-          if (referenceElement) return;
           innerRef(node);
           referenceElement = node;
         }}
@@ -89,8 +87,6 @@ describe('Managed Reference', () => {
     let ReferenceComp = ({ innerRef }) => (
       <div
         ref={node => {
-          // We just want to invoke this once so that we have access to the referenceElement in the upper scope.
-          if (referenceElement) return;
           innerRef(node);
           referenceElement = node;
         }}
@@ -106,7 +102,7 @@ describe('Managed Reference', () => {
     );
 
     expect(wrapper.instance().referenceNode).toBe(referenceElement);
-    wrapper.instance().setReferenceNode(null);
+    wrapper.instance().componentWillUnmount()
     expect(wrapper.instance().referenceNode).toBeNull();
   });
 });