[Async] Enable async/await and update UIExplorer and tests

Summary:
- Enables async/await in .babelrc and transformer.js
- Adds regenerator to package.json. Users still need to explicitly require the regenerator runtime -- this is so that you only pay for what you use.
- Update AsyncStorage examples in UIExplorer to use async/await
- Update promise tests in UIExplorer to use async/await in addition to the promise API

Closes https://github.com/facebook/react-native/pull/1765
Github Author: James Ide <ide@jameside.com>

Examples/UIExplorer/AsyncStorageExample.js

@@ -29,18 +29,23 @@ var COLORS = ['red', 'orange', 'yellow', 'green', 'blue'];
 
 var BasicStorageExample = React.createClass({
   componentDidMount() {
-    AsyncStorage.getItem(STORAGE_KEY)
+    this._loadInitialState().done();
-      .then((value) => {
-        if (value !== null){
-          this.setState({selectedValue: value});
-          this._appendMessage('Recovered selection from disk: ' + value);
-        } else {
-          this._appendMessage('Initialized with no selection on disk.');
-        }
-      })
-      .catch((error) => this._appendMessage('AsyncStorage error: ' + error.message))
-      .done();
   },
+
+  async _loadInitialState() {
+    try {
+      var value = await AsyncStorage.getItem(STORAGE_KEY);
+      if (value !== null){
+        this.setState({selectedValue: value});
+        this._appendMessage('Recovered selection from disk: ' + value);
+      } else {
+        this._appendMessage('Initialized with no selection on disk.');
+      }
+    } catch (error) {
+      this._appendMessage('AsyncStorage error: ' + error.message);
+    }
+  },
+
   getInitialState() {
     return {
       selectedValue: COLORS[0],
@@ -80,19 +85,23 @@ var BasicStorageExample = React.createClass({
     );
   },
 
-  _onValueChange(selectedValue) {
+  async _onValueChange(selectedValue) {
     this.setState({selectedValue});
-    AsyncStorage.setItem(STORAGE_KEY, selectedValue)
+    try {
-      .then(() => this._appendMessage('Saved selection to disk: ' + selectedValue))
+      await AsyncStorage.setItem(STORAGE_KEY, selectedValue);
-      .catch((error) => this._appendMessage('AsyncStorage error: ' + error.message))
+      this._appendMessage('Saved selection to disk: ' + selectedValue);
-      .done();
+    } catch (error) {
+      this._appendMessage('AsyncStorage error: ' + error.message);
+    }
   },
 
-  _removeStorage() {
+  async _removeStorage() {
-    AsyncStorage.removeItem(STORAGE_KEY)
+    try {
-      .then(() => this._appendMessage('Selection removed from disk.'))
+      await AsyncStorage.removeItem(STORAGE_KEY);
-      .catch((error) => { this._appendMessage('AsyncStorage error: ' + error.message) })
+      this._appendMessage('Selection removed from disk.');
-      .done();
+    } catch (error) {
+      this._appendMessage('AsyncStorage error: ' + error.message);
+    }
   },
 
   _appendMessage(message) {

Examples/UIExplorer/UIExplorerIntegrationTests/js/IntegrationTestsApp.js

@@ -10,6 +10,8 @@
  */
 'use strict';
 
+require('regenerator/runtime');
+
 var React = require('react-native');
 
 var {

Examples/UIExplorer/UIExplorerIntegrationTests/js/PromiseTest.js

@@ -17,13 +17,18 @@ var PromiseTest = React.createClass({
 
   shouldResolve: false,
   shouldReject: false,
+  shouldSucceedAsync: false,
+  shouldThrowAsync: false,
 
   componentDidMount() {
     Promise.all([
       this.testShouldResolve(),
       this.testShouldReject(),
+      this.testShouldSucceedAsync(),
+      this.testShouldThrowAsync(),
     ]).then(() => RCTTestModule.markTestPassed(
-      this.shouldResolve && this.shouldReject
+      this.shouldResolve && this.shouldReject &&
+      this.shouldSucceedAsync && this.shouldThrowAsync
     ));
   },
 
@@ -41,6 +46,24 @@ var PromiseTest = React.createClass({
       .catch(() => this.shouldReject = true);
   },
 
+  async testShouldSucceedAsync() {
+    try {
+      await RCTTestModule.shouldResolve();
+      this.shouldSucceedAsync = true;
+    } catch (e) {
+      this.shouldSucceedAsync = false;
+    }
+  },
+
+  async testShouldThrowAsync() {
+    try {
+      await RCTTestModule.shouldReject();
+      this.shouldThrowAsync = false;
+    } catch (e) {
+      this.shouldThrowAsync = true;
+    }
+  },
+
   render() {
     return <React.View />;
   }

Libraries/JavaScriptAppEngine/Initialization/InitializeJavaScriptAppEngine.js

@@ -26,6 +26,7 @@
 require('RCTDebugComponentOwnership');
 require('RCTDeviceEventEmitter');
 require('PerformanceLogger');
+require('regenerator/runtime');
 
 if (typeof GLOBAL === 'undefined') {
   GLOBAL = this;

package.json

@@ -49,13 +49,13 @@
     "absolute-path": "0.0.0",
     "babel": "5.4.3",
     "babel-core": "5.6.4",
-    "chalk": "^1.0.0",
+    "chalk": "1.0.0",
     "connect": "2.8.3",
-    "debug": "~2.1.0",
+    "debug": "2.1.0",
-    "graceful-fs": "^3.0.6",
+    "graceful-fs": "3.0.6",
     "image-size": "0.3.5",
     "immutable": "^3.7.4",
-    "joi": "~5.1.0",
+    "joi": "5.1.0",
     "jstransform": "11.0.1",
     "module-deps": "3.5.6",
     "optimist": "0.6.1",
@@ -63,11 +63,12 @@
     "react-timer-mixin": "^0.13.1",
     "react-tools": "git://github.com/facebook/react#b4e74e38e43ac53af8acd62c78c9213be0194245",
     "rebound": "^0.0.12",
+    "regenerator": "0.8.31",
     "sane": "^1.1.2",
     "semver": "^4.3.6",
     "source-map": "0.1.31",
     "stacktrace-parser": "frantic/stacktrace-parser#493c5e5638",
-    "uglify-js": "~2.4.16",
+    "uglify-js": "2.4.16",
     "underscore": "1.7.0",
     "wordwrap": "^1.0.0",
     "worker-farm": "^1.3.1",

packager/react-packager/.babelrc

@@ -15,10 +15,12 @@
     "es6.properties.shorthand",
     "es6.spread",
     "es6.templateLiterals",
+    "es7.asyncFunctions",
     "es7.trailingFunctionCommas",
     "es7.objectRestSpread",
     "flow",
-    "react"
+    "react",
+    "regenerator"
   ],
   "sourceMaps": false
 }

packager/transformer.js

@@ -28,10 +28,12 @@ function transform(srcTxt, filename, options) {
       'es6.properties.shorthand',
       'es6.spread',
       'es6.templateLiterals',
+      'es7.asyncFunctions',
       'es7.trailingFunctionCommas',
       'es7.objectRestSpread',
       'flow',
       'react',
+      'regenerator',
     ],
     sourceFileName: filename,
     sourceMaps: false,