refactoring and fixes

integration/SingleScreen.test.js

@@ -0,0 +1,20 @@
+describe('single screen integration', () => {
+  let Navigation;
+  let mockNativeNavigation;
+
+  beforeEach(() => {
+    mockNativeNavigation = {};
+    require('react-native').NativeModules.NativeNavigation = mockNativeNavigation;
+    Navigation = require('../../src/index').default;
+  });
+
+  xit('startApp directs to native with constructed hirarchy for single screens', () => {
+    mockNativeNavigation.startApp = jest.fn();
+    Navigation.startApp({
+      container: {
+        key: 'com.integration.MyFirstScreen'
+      }
+    });
+    expect(mockNativeNavigation.startApp).toHaveBeenCalledTimes(1);
+  });
+});

integration/remx-support.test.js → integration/remx/remx.test.js

@@ -7,8 +7,8 @@ describe('remx support', () => {
   let store;
 
   beforeEach(() => {
-    MyConnectedContainer = require('./remx-support-component').default;
-    store = require('./remx-support-store');
+    MyConnectedContainer = require('./remxComponent').default;
+    store = require('./remxStore');
   });
 
   it('renders normally', () => {

integration/remx-support-component.js → integration/remx/remxComponent.js

@@ -3,7 +3,7 @@ import React, {Component} from 'react';
 
 import {connect} from 'remx/react-native';
 
-import {selectors} from './remx-support-store';
+import {selectors} from './remxStore';
 
 class MyContainer extends Component {
   constructor(props) {

playground/.gitignore

@@ -1,3 +1,174 @@
+############
+# Node
+############
+# Logs
+logs
+*.log
+npm-debug.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (http://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules
+jspm_packages
+
+# Optional npm cache directory
+.npm
+
+# Optional REPL history
+.node_repl_history
+
+################
+# JetBrains
+################
+.idea
+
+## File-based project format:
+*.iws
+
+## Plugin-specific files:
+
+# IntelliJ
+/out/
+
+# mpeltonen/sbt-idea plugin
+.idea_modules/
+
+# JIRA plugin
+atlassian-ide-plugin.xml
+
+# Crashlytics plugin (for Android Studio and IntelliJ)
+com_crashlytics_export_strings.xml
+crashlytics.properties
+crashlytics-build.properties
+fabric.properties
+
+
+############
+# iOS
+############
+# Xcode
+#
+# gitignore contributors: remember to update Global/Xcode.gitignore, Objective-C.gitignore & Swift.gitignore
+
+## Build generated
+ios/build/
+ios/DerivedData/
+
+## Various settings
+*.pbxuser
+!default.pbxuser
+*.mode1v3
+!default.mode1v3
+*.mode2v3
+!default.mode2v3
+*.perspectivev3
+!default.perspectivev3
+ios/xcuserdata/
+
+## Other
+*.moved-aside
+*.xcuserstate
+
+## Obj-C/Swift specific
+*.hmap
+*.ipa
+*.dSYM.zip
+*.dSYM
+
+# CocoaPods
+#
+# We recommend against adding the Pods directory to your .gitignore. However
+# you should judge for yourself, the pros and cons are mentioned at:
+# https://guides.cocoapods.org/using/using-cocoapods.html#should-i-check-the-pods-directory-into-source-control
+#
+ios/Pods/
+
+# Carthage
+#
+# Add this line if you want to avoid checking in source code from Carthage dependencies.
+# Carthage/Checkouts
+
+Carthage/Build
+
+# fastlane
+#
+# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the
+# screenshots whenever they are needed.
+# For more information about the recommended setup visit:
+# https://github.com/fastlane/fastlane/blob/master/fastlane/docs/Gitignore.md
+
+fastlane/report.xml
+fastlane/screenshots
+
+
+############
+# Android
+############
+# Built application files
+*.apk
+*.ap_
+
+# Files for the Dalvik VM
+*.dex
+
+# Java class files
+*.class
+
+# Generated files
+android/bin/
+android/gen/
+android/out/
+
+# Gradle files
+android/.gradle/
+android/build/
+
+# Local configuration file (sdk path, etc)
+local.properties
+
+# Proguard folder generated by Eclipse
+android/proguard/
+
+# Log Files
+*.log
+
+# Android Studio Navigation editor temp files
+android/.navigation/
+
+# Android Studio captures folder
+android/captures/
+
+# Intellij
+*.iml
+
+# Keystore files
+*.jks
+
+##################
+# React-Native
+##################
 # OSX
 #
 .DS_Store
@@ -32,3 +203,9 @@ local.properties
 #
 node_modules/
 npm-debug.log
+
+# BUCK
+buck-out/
+\.buckd/
+android/app/libs
+android/keystores/debug.keystore

playground/package.json

@@ -5,7 +5,7 @@
   "scripts": {
     "postinstall": "rm -rf node_modules/react-native-navigation/node_modules && rm -rf node_modules/react-native-navigation/playground",
     "start": "watchman watch-del-all && (adb reverse tcp:8081 tcp:8081 || true) && node node_modules/react-native/local-cli/cli.js start --reset-cache",
-    "xcode": "open ios/example.xcodeproj",
+    "xcode": "open ios/playground.xcodeproj",
     "android": "cd android && ./gradlew installDebug",
     "e2e": "node ./scripts/e2e.ios.js"
   },
@@ -21,10 +21,10 @@
   "detox": {
     "session": {
       "server": "ws://localhost:8099",
-      "sessionId": "example"
+      "sessionId": "playground"
     },
     "ios-simulator": {
-      "app": "ios/DerivedData/example/Build/Products/Debug_Detox-iphonesimulator/example.app",
+      "app": "ios/DerivedData/playground/Build/Products/Debug_Detox-iphonesimulator/playground.app",
       "device": "iPhone 7, iOS 10.1"
     }
   }

src/Navigation.test.js

@@ -2,14 +2,12 @@ import _ from 'lodash';
 
 describe('Navigation', () => {
   let Navigation;
-  let Commands;
   let ContainerRegistry;
 
   beforeEach(() => {
     jest.mock('./containers/ContainerRegistry');
-    Navigation = require('./Navigation');
-    Commands = require('./commands/Commands');
     ContainerRegistry = require('./containers/ContainerRegistry');
+    Navigation = require('./Navigation');
   });
 
   it('exposes static commands', () => {

src/commands/valid-commands.js → src/commands/ValidCommands.test.js

@@ -1,10 +1,16 @@
-export const singleContainerApp = {
+describe('valid commands', () => {
+  it('just works', () => {
+    //
+  });
+});
+
+const singleContainerApp = {
   container: {
     key: 'com.example.FirstTabContainer'
   }
 };
 
-export const tabBasedApp = {
+const tabBasedApp = {
   tabs: [
     {
       container: {
@@ -24,7 +30,7 @@ export const tabBasedApp = {
   ]
 };
 
-export const singleWithSideMenu = {
+const singleWithSideMenu = {
   container: {
     key: 'com.example.MyContainer'
   },
@@ -35,7 +41,7 @@ export const singleWithSideMenu = {
   }
 };
 
-export const singleWithRightSideMenu = {
+const singleWithRightSideMenu = {
   container: {
     key: 'com.example.MyContainer'
   },
@@ -46,7 +52,7 @@ export const singleWithRightSideMenu = {
   }
 };
 
-export const singleWithBothMenus = {
+const singleWithBothMenus = {
   container: {
     key: 'com.example.MyContainer'
   },
@@ -60,7 +66,7 @@ export const singleWithBothMenus = {
   }
 };
 
-export const tabBasedWithSideMenu = {
+const tabBasedWithSideMenu = {
   tabs: [
     {
       container: {

src/containers/ContainerRegistry.js

@@ -1,17 +1,14 @@
 import React, {Component} from 'react';
 import {AppRegistry} from 'react-native';
-import * as PropsStore from './PropsStore';
-import * as ContainerStore from './ContainerStore';
+import * as Store from './Store';
 
 export function registerContainer(containerKey, getContainerFunc) {
   const OriginalContainer = getContainerFunc();
   const NavigationContainer = wrapContainer(containerKey, OriginalContainer);
-  ContainerStore.setContainerClass(containerKey, NavigationContainer);
+  Store.setContainerClass(containerKey, NavigationContainer);
   AppRegistry.registerComponent(containerKey, () => NavigationContainer);
 }
 
-export const bla = {};
-
 function wrapContainer(containerKey, OriginalContainer) {
   return class extends Component {
     constructor(props) {
@@ -21,20 +18,19 @@ function wrapContainer(containerKey, OriginalContainer) {
       }
       this.state = {
         containerId: props.containerId,
-        allProps: {...props, ...PropsStore.getPropsForContainerId(props.containerId)}
+        allProps: {...props, ...Store.getPropsForContainerId(props.containerId)}
       };
     }
 
     componentWillReceiveProps(nextProps) {
       this.setState({
-        allProps: {...nextProps, ...PropsStore.getPropsForContainerId(this.state.containerId)}
+        allProps: {...nextProps, ...Store.getPropsForContainerId(this.state.containerId)}
       });
     }
 
     render() {
       return (
         <OriginalContainer
-          ref={(r) => bla.ref = r}
           {...this.state.allProps}
           containerId={this.state.containerId}
         />

src/containers/ContainerRegistry.test.js

@@ -2,11 +2,11 @@ import React, {Component} from 'react';
 import {AppRegistry, Text} from 'react-native';
 import renderer from 'react-test-renderer';
 
-describe('ComponentRegistry', () => {
+describe('ContainerRegistry', () => {
   let uut;
+  let store;
   let myContainerRef;
   let testParentRef;
-  let containerStore;
 
   class MyContainer extends Component {
     constructor(props) {
@@ -37,12 +37,7 @@ describe('ComponentRegistry', () => {
 
   beforeEach(() => {
     uut = require('./ContainerRegistry');
-    containerStore = require('./ContainerStore');
-  });
-
-  afterEach(() => {
-    myContainerRef = null;
-    testParentRef = null;
+    store = require('./Store');
   });
 
   describe('registerContainer', () => {
@@ -65,7 +60,7 @@ describe('ComponentRegistry', () => {
     });
   });
 
-  describe('NavigationContainer wrapping', () => {
+  describe('NavigationContainer wrapping passed container', () => {
     const containerKey = 'example.MyContainer';
 
     beforeEach(() => {
@@ -73,14 +68,14 @@ describe('ComponentRegistry', () => {
     });
 
     it('must have containerId as prop', () => {
-      const NavigationContainer = containerStore.getContainerClass(containerKey);
+      const NavigationContainer = store.getContainerClass(containerKey);
       expect(() => {
         renderer.create(<NavigationContainer/>);
       }).toThrow(new Error('Container example.MyContainer does not have a containerId!'));
     });
 
     it('wraps the container and saves to store', () => {
-      const NavigationContainer = containerStore.getContainerClass(containerKey);
+      const NavigationContainer = store.getContainerClass(containerKey);
       expect(NavigationContainer).not.toBeInstanceOf(MyContainer);
       const tree = renderer.create(<NavigationContainer containerId={'container1'}/>);
       expect(tree.toJSON().children).toEqual(['Hello, World!']);
@@ -88,13 +83,13 @@ describe('ComponentRegistry', () => {
     });
 
     it('injects props from wrapper into original container', () => {
-      const NavigationContainer = containerStore.getContainerClass(containerKey);
+      const NavigationContainer = store.getContainerClass(containerKey);
       renderer.create(<NavigationContainer containerId={'container1'} myProp={'yo'}/>);
       expect(myContainerRef.props.myProp).toEqual('yo');
     });
 
     it('updates props from wrapper into original container', () => {
-      const NavigationContainer = containerStore.getContainerClass(containerKey);
+      const NavigationContainer = store.getContainerClass(containerKey);
       renderer.create(<TestParent ChildClass={NavigationContainer}/>);
       expect(myContainerRef.props.foo).toEqual(undefined);
       testParentRef.setState({propsFromState: {foo: 'yo'}});
@@ -102,16 +97,16 @@ describe('ComponentRegistry', () => {
     });
 
     it('pulls props from the PropsStore and injects them into the inner container', () => {
-      require('./PropsStore').setPropsForContainerId('container123', {numberProp: 1, stringProp: 'hello', objectProp: {a: 2}});
-      const NavigationContainer = containerStore.getContainerClass(containerKey);
+      store.setPropsForContainerId('container123', {numberProp: 1, stringProp: 'hello', objectProp: {a: 2}});
+      const NavigationContainer = store.getContainerClass(containerKey);
       renderer.create(<NavigationContainer containerId={'container123'}/>);
       expect(myContainerRef.props).toEqual({containerId: 'container123', numberProp: 1, stringProp: 'hello', objectProp: {a: 2}});
     });
 
     it('updates props from PropsStore into inner container', () => {
-      const NavigationContainer = containerStore.getContainerClass(containerKey);
+      const NavigationContainer = store.getContainerClass(containerKey);
       renderer.create(<TestParent ChildClass={NavigationContainer}/>);
-      require('./PropsStore').setPropsForContainerId('container1', {myProp: 'hello'});
+      store.setPropsForContainerId('container1', {myProp: 'hello'});
       expect(myContainerRef.props.foo).toEqual(undefined);
       expect(myContainerRef.props.myProp).toEqual(undefined);
       testParentRef.setState({propsFromState: {foo: 'yo'}});
@@ -120,7 +115,7 @@ describe('ComponentRegistry', () => {
     });
 
     it('protects containerId from change', () => {
-      const NavigationContainer = containerStore.getContainerClass(containerKey);
+      const NavigationContainer = store.getContainerClass(containerKey);
       renderer.create(<TestParent ChildClass={NavigationContainer}/>);
       expect(myContainerRef.props.containerId).toEqual('container1');
       testParentRef.setState({propsFromState: {containerId: 'ERROR'}});

src/containers/ContainerStore.js

@@ -1,11 +0,0 @@
-const state = {
-  containersByKey: {}
-};
-
-export function setContainerClass(containerKey, ContainerClass) {
-  state.containersByKey[containerKey] = ContainerClass;
-}
-
-export function getContainerClass(containerKey) {
-  return state.containersByKey[containerKey];
-}

src/containers/ContainerStore.test.js

@@ -1,19 +0,0 @@
-describe('ContainerStore', () => {
-  let uut;
-
-  beforeEach(() => {
-    uut = require('./ContainerStore');
-  });
-
-  class Component {
-    //
-  }
-  class MyComponent extends Component {
-    //
-  }
-
-  it('holds containers classes by containerKey', () => {
-    uut.setContainerClass('example.mykey', MyComponent);
-    expect(uut.getContainerClass('example.mykey')).toEqual(MyComponent);
-  });
-});

src/containers/PropsStore.js

@@ -1,11 +0,0 @@
-import _ from 'lodash';
-
-const propsByContainerId = {};
-
-export function setPropsForContainerId(containerId, props) {
-  _.set(propsByContainerId, containerId, props);
-}
-
-export function getPropsForContainerId(containerId) {
-  return _.get(propsByContainerId, containerId, {});
-}

src/containers/Store.js

@@ -0,0 +1,22 @@
+import _ from 'lodash';
+
+const state = {
+  propsByContainerId: {},
+  containersByKey: {}
+};
+
+export function setPropsForContainerId(containerId, props) {
+  _.set(state.propsByContainerId, containerId, props);
+}
+
+export function getPropsForContainerId(containerId) {
+  return _.get(state.propsByContainerId, containerId, {});
+}
+
+export function setContainerClass(containerKey, ContainerClass) {
+  state.containersByKey[containerKey] = ContainerClass;
+}
+
+export function getContainerClass(containerKey) {
+  return state.containersByKey[containerKey];
+}

src/containers/PropsStore.test.js → src/containers/Store.test.js

@@ -1,8 +1,8 @@
-describe('PropsStore', () => {
+describe('Store', () => {
   let uut;
 
   beforeEach(() => {
-    uut = require('./PropsStore');
+    uut = require('./Store');
   });
 
   it('initial state', () => {
@@ -19,4 +19,13 @@ describe('PropsStore', () => {
     uut.setPropsForContainerId(undefined, undefined);
     expect(uut.getPropsForContainerId('container1')).toEqual({});
   });
+
+  it('holds containers classes by containerKey', () => {
+    const MyComponent = class {
+      //
+    };
+    uut.setContainerClass('example.mykey', MyComponent);
+    expect(uut.getContainerClass('example.mykey')).toEqual(MyComponent);
+  });
 });
+

src/index.js

@@ -1,4 +1,3 @@
-import * as NavigationInner from './Navigation';
+import * as Navigation from './Navigation';
 
-export default NavigationInner;
-export const Navigation = NavigationInner;
+export default Navigation;

src/index.test.js

@@ -1,14 +1,14 @@
+import Navigation from './index';
+
 describe('index', () => {
   let uut;
 
   beforeEach(() => {
-    uut = require('./index');
+    uut = require('./index').default;
   });
 
-  it('exposes Navigation as default or as Object', () => {
-    expect(uut.Navigation).toBeDefined();
-    expect(uut.Navigation).toEqual(uut.default);
-    expect(uut.Navigation.startApp).toBeInstanceOf(Function);
-    expect(uut.default.startApp).toBeInstanceOf(Function);
+  it('exposes Navigation as default', () => {
+    expect(uut.startApp).toBeInstanceOf(Function);
+    expect(Navigation.startApp).toBeInstanceOf(Function);
   });
 });