From 63349a727dedd9913f2bf28812b2cb84087fcfef Mon Sep 17 00:00:00 2001 From: Julian Hundeloh Date: Wed, 6 Jun 2018 13:10:33 +0200 Subject: [PATCH] fix: ref set to null on updates (#410) ### Motivation The ref function is called twice on updates (see https://reactjs.org/docs/refs-and-the-dom.html#caveats-with-callback-refs). This behaviour causes the variable `this._manager` sometimes to be null during rendering and in that case actions are pushed to the queue again. Since the queue is only processed once (during componentDidMount), somes changes will never be visible. The simple solution is to bind the ref-function as mentioned in the link above. ### Test plan Dynamically change `visible` parameter of Modal. The Modal won't be visible on the second time. --- example/yarn.lock | 10 +++++++--- src/components/Portal/PortalHost.js | 10 +++++----- 2 files changed, 12 insertions(+), 8 deletions(-) diff --git a/example/yarn.lock b/example/yarn.lock index 0e3ba13..8c6d671 100644 --- a/example/yarn.lock +++ b/example/yarn.lock @@ -2120,7 +2120,11 @@ deep-is@~0.1.3: version "0.1.3" resolved "https://registry.yarnpkg.com/deep-is/-/deep-is-0.1.3.tgz#b369d6fb5dbc13eecf524f91b070feedc357cf34" -deepmerge@2.1.0, deepmerge@^1.3.0, deepmerge@^1.5.1, deepmerge@^2.1.0: +deepmerge@^1.3.0, deepmerge@^1.5.1: + version "1.5.2" + resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-1.5.2.tgz#10499d868844cdad4fee0842df8c7f6f0c95a753" + +deepmerge@^2.1.0: version "2.1.0" resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-2.1.0.tgz#511a54fff405fc346f0240bb270a3e9533a31102" @@ -3012,7 +3016,7 @@ hoek@4.x.x: version "4.2.1" resolved "https://registry.yarnpkg.com/hoek/-/hoek-4.2.1.tgz#9634502aa12c445dd5a7c5734b572bb8738aacbb" -hoist-non-react-statics@2.5.0, hoist-non-react-statics@^2.2.0, hoist-non-react-statics@^2.3.1, hoist-non-react-statics@^2.5.0: +hoist-non-react-statics@^2.2.0, hoist-non-react-statics@^2.3.1, hoist-non-react-statics@^2.5.0: version "2.5.0" resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-2.5.0.tgz#d2ca2dfc19c5a91c5a6615ce8e564ef0347e2a40" @@ -4870,7 +4874,7 @@ react-google-maps@^7.3.0: scriptjs "2.5.8" warning "3.0.0" -react-lifecycles-compat@3.0.4, react-lifecycles-compat@^3, react-lifecycles-compat@^3.0.4: +react-lifecycles-compat@^3, react-lifecycles-compat@^3.0.4: version "3.0.4" resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362" diff --git a/src/components/Portal/PortalHost.js b/src/components/Portal/PortalHost.js index 8b4f4f0..c0a3140 100644 --- a/src/components/Portal/PortalHost.js +++ b/src/components/Portal/PortalHost.js @@ -49,6 +49,10 @@ export default class PortalHost extends React.Component { } } + _setManager = (manager: ?Object) => { + this._manager = manager; + }; + _mount = (children: React.Node) => { const key = this._nextKey++; @@ -101,11 +105,7 @@ export default class PortalHost extends React.Component { }} > {this.props.children} - { - this._manager = c; - }} - /> + ); }