Expo SDK 21.0.0 is now available

I am happy to announce the release of Expo SDK 21.0.0! It is based on React Native 0.48 “August”. Our previous SDK, 20.0.0, is based on React Native 0.47 “July”.

AppLoading Improvements: Easier to use, better error handling

AppLoading has been extended with new props that make it easier to use and also better able to display errors in development mode. See the documentation for details. These changes are backwards-compatible, and the old API will continue to work. We do recommend updating sooner rather than later — see this commit from our template projects for an example of how to update.

When developing, using the new API lets us show an error screen if an error is hit during the first render of your app, instead of hanging or restarting:

Note that in production mode the behavior of AppLoading is the same as it was previously — this API is intended to help you diagnose problems during debugging but should not affect users of your app.

Loading screen progress in development

In the SDK 20 release, we supported a progress bar for building the JavaScript bundle for your app when in development mode. In SDK 21, that progress bar has been extended to also display progress of downloading the bundle. This should make it significantly easier to tell the difference between an error loading your app and a slow network connection.

If you are experiencing slow loading times when developing your app, check to see if you have the “tunnel” mode enabled in XDE/exp and try using LAN connections if your phone and computer are on the same network.

Splash Screen Improvements

The new splash API will continue to be marked as experimental while we keep working on stability and polish, but several important issues have been fixed:

• The transitions between various stages of app loading are smoother, and flashes of white should be eliminated in almost all scenarios.
• Unspecified background colors will correctly fall back to the default of white.
• Miscellaneous bugs from edge cases in the build process have been fixed.

Geocoding improvements

Several improvements to the Geocoding API are being released with SDK 21:

• iOS and Android return more consistent results when a lookup fails
• Error messages for missing permissions are clearer
• Several native crashes are prevented by performing input validation in JavaScript
• The result of the reverse geocode call now includes isoCountryCode (many thanks to justinmcp for contributing a fix!)

Camera: Video Recording and EXIF metadata

The Camera API now supports video recording! See the documentation for details about starting and stopping recording.

The Camera API also returns Exif metadata about pictures taken. This does involve a small breaking change in the API (see below for details).

SecureStore

The SecureStore API now works on Android L and below. We’ve tested on the versions of Android we support (4.4 and up) but Android device manufacturers may customize the cryptographic algorithms they include with devices. Since we can’t test on every type of Android device, please let us know if you encounter issues with SecureStore on specific types of Android devices.

SecureStore allows you to write any string value, while previously it was more conservative about the values it accepted. The performance of this API on Android is also better and supports storing larger values (previously Android had a limit of about 200 bytes per value).

New APIs

AuthSession

AuthSession is the easiest way to add browser-based authentication to your app. This API is designed to drastically reduce the boilerplate needed for browser redirect-based authentication flows (common with OAuth-based systems), and makes it much easier to manage redirect URL whitelists for development and when working in teams. We recommend checking out the documentation for more details.

For an example of how to use the new AuthSession API, check out the with-facebook-auth example project (source).

react-native-gesture-handler

We now support using react-native-gesture-handler as part of our experimental DangerZone APIs. If you’re not familiar with Krzysztof Magiera’s library, definitely check it out! There is an example in the Native Component List, and Brent has also published a couple of example projects using the new API:

• https://github.com/brentvatne/swipe-action-gesture-handler-experiment
• https://github.com/brentvatne/map-gesture-handler-example

We do have a documentation page for this API, although for the time being it just points to the GitHub repository.

Google AdMob

SDK 21 now supports displaying ads through Google Admob in addition to our previous support for Facebook Ads.

Payments on Android

The Payments API is now supported on Android! Check out the documentation.

Breaking Changes

Camera

The takePicture function is now called takePictureAsync and now returns an object with many keys, instead of just returning the URI. The URI is available under the uri key of the returned object.

Previously this function would return a value like:

"file://path/to/your/file.jpg

And will now return an object like:

{ "uri": "file://path/to/your/file.jpg" }

SecureStore

Several methods have been renamed:

• setValueWithKeyAsync →setItemAsync: The order of the arguments has been reversed to match typical key-value store APIs. This function used to expect (value, key) and now expects (key, value).
• getValueWithKeyAsync →getItemAsync: Trying to retrieve an entry that doesn’t exist returns null instead of throwing an error.
• deleteValueWithKeyAsync →deleteItemAsync

Payments on iOS

We’d previously announced Stripe support on iOS as part of our experimental DangerZone APIs. The Payments API was using the Stripe SDK on iOS. We learned that Apple sometimes rejects apps which contain the Stripe SDK but don’t offer anything for sale. To help your App Review process go more smoothly, we’ve decided to remove the Stripe SDK and experimental Payments API from apps built with the Expo standalone builder. We’re still excited to give developers a way to let users pay for goods when they need to and we’ll announce more ways to do so shortly.

Bugfixes

• Camera now generates blank images in emulators/simulators instead of erroring
• Text-to-speech is initialized lazily, which prevents native crashes that occurred in some situations on Android
• Google sign-in has received several fixes for standalone apps; the “system” behavior should now work as expected

Library Updates

• Lottie has been updated to version 2.2.0.

XDE & exp Developer Tools

Improved error logging with stack traces

Unhandled promise rejections should now print a stack trace in XDE and exp!

Stack traces are now included on console.warn and console.error . These stack traces are collapsable in XDE, and are truncated to a subset of stack frames in exp. If you console.log an error object, the stack trace is included there as well.

Better error messages when using Node APIs

It’s pretty common for an app to hit an error when adding libraries that are intended to be used in Node rather than React Native. Our developer tools will now attempt to print a specific error message if the error was caused by a missing Node API.

LAN IP works correctly with Node 8+

In some situations, the “LAN” setting was failing with Node 8. This was a problem with a dependency we used for detecting the machine IP address, and has been fixed.

Upgrading Your App

Here’s how to upgrade your app to Expo SDK 21.0.0 from 20.0.0:

• Close XDE or your exp CLI server
• In app.json, change sdkVersion to "21.0.0"
• In package.json, change these dependencies:
  - react-native to "https://github.com/expo/react-native/archive/sdk-21.0.2.tar.gz"
  - expo to "^21.0.0"
- react did not change from SDK 20("16.0.0-alpha.12")
  - jest-expo to "^21.0.0" (if you use it)
  - sentry-expo did not change from SDK 20("~1.6.0")
• Delete your project’s node_modules directory and run npm installagain (or use yarn, we love yarn)
• Reopen your project in XDE and press “Restart” to clear the packager cache, or run exp start -c if you use use exp.
• Update the Expo app on your phones from the App Store / Play Store. XDE and exp will automatically update your apps in simulators.
• Make sure to check the breaking changes section of this post!