Permalink
Browse files

make Modal pass rootTag to AppContainer

Summary:
Following up on fb7fe2d: when <Modal> is used in dev mode, it renders `<AppContainer>` to wrap the children so that the element inspector can show up correctly. In that scenario, we need pass the `rootTag` over the `<AppContainer>` so that the children can read the rootTag correctly. Otherwise, the children of <Modal> will see it as undefined.

With this, AppContainer can then declare `rootTag` as a required prop, as it should have been.

Note that this only affects DEV build because there's no AppContainer wrapping otherwise.

Reviewed By: jingc

Differential Revision: D4204011

fbshipit-source-id: 80edbc8d351d983786e6fc3c68dfa65a71b1ed3c
  • Loading branch information...
1 parent ba19897 commit 4530da87e296a3043c9176a7f2b1bfa0f42489ee @fkgozali fkgozali committed with Facebook Github Bot Nov 18, 2016
Showing with 7 additions and 4 deletions.
  1. +5 −1 Libraries/Modal/Modal.js
  2. +2 −3 Libraries/ReactNative/AppContainer.js
@@ -128,6 +128,10 @@ class Modal extends React.Component {
visible: true,
};
+ static contextTypes = {
+ rootTag: React.PropTypes.number,
+ };
+
render(): ?React.Element<any> {
if (this.props.visible === false) {
return null;
@@ -147,7 +151,7 @@ class Modal extends React.Component {
}
const innerChildren = __DEV__ ?
- ( <AppContainer>
+ ( <AppContainer rootTag={this.context.rootTag}>
{this.props.children}
</AppContainer>) :
this.props.children;
@@ -19,13 +19,12 @@ const ReactNative = require('ReactNative');
const StyleSheet = require('StyleSheet');
const View = require('View');
-// TODO (fkg): make rootTag required
type Context = {
- rootTag: ?number,
+ rootTag: number,
};
type Props = {
children?: React.Children,
- rootTag?: number,
+ rootTag: number,
};
type State = {
inspector: ?React.Element<*>,

0 comments on commit 4530da8

Please sign in to comment.