Skip to content

Commit

Permalink
Bump docs to v0.59
Browse files Browse the repository at this point in the history
  • Loading branch information
charpeni committed Mar 12, 2019
1 parent ccdf248 commit 8f2c417
Show file tree
Hide file tree
Showing 26 changed files with 4,199 additions and 73 deletions.
3 changes: 1 addition & 2 deletions docs/appregistry.md
Original file line number Diff line number Diff line change
Expand Up @@ -166,8 +166,7 @@ Register a headless task. A headless task is a bit of code that runs without a U
static registerCancellableHeadlessTask(taskKey, taskProvider, taskCancelProvider)
```
Register a headless task which can be cancelled. A headless task is a bit of code that runs without a UI. @param taskKey the key associated with this task @param taskProvider a promise returning function that takes some data passed from the native side as the only argument; when the promise is resolved or rejected the native side is notified of this event and it may decide to destroy the JS context. @param taskCancelProvider a void returning function that takes no arguments; when a cancellation is requested, the function being executed by taskProvider should wrap up and return ASAP.
---
## Register a headless task which can be cancelled. A headless task is a bit of code that runs without a UI. @param taskKey the key associated with this task @param taskProvider a promise returning function that takes some data passed from the native side as the only argument; when the promise is resolved or rejected the native side is notified of this event and it may decide to destroy the JS context. @param taskCancelProvider a void returning function that takes no arguments; when a cancellation is requested, the function being executed by taskProvider should wrap up and return ASAP.
### `startHeadlessTask()`
Expand Down
6 changes: 3 additions & 3 deletions docs/textinput.md
Original file line number Diff line number Diff line change
Expand Up @@ -350,9 +350,9 @@ Say the system whether the individual fields in your app should be included in a
* `yes`: This view is important for autofill.
* `yesExcludeDescendants`: This view is important for autofill, but its children aren't important for autofill.

| Type | Required | Platform |
| -------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | -------- |
| enum('auto', 'no', 'noExcludeDescendants', 'yes', 'yesExcludeDescendants') | No | Android |
| Type | Required | Platform |
| -------------------------------------------------------------------------- | -------- | -------- |
| enum('auto', 'no', 'noExcludeDescendants', 'yes', 'yesExcludeDescendants') | No | Android |

---

Expand Down
6 changes: 3 additions & 3 deletions docs/upgrading.md
Original file line number Diff line number Diff line change
Expand Up @@ -115,9 +115,9 @@ $ react-native upgrade

This will check your files against the latest template and perform the following:

- If there is a new file in the template, it is simply created.
- If a file in the template is identical to your file, it is skipped.
- If a file is different in your project than the template, you will be prompted; you have options to keep your file or overwrite it with the template version.
* If there is a new file in the template, it is simply created.
* If a file in the template is identical to your file, it is skipped.
* If a file is different in your project than the template, you will be prompted; you have options to keep your file or overwrite it with the template version.

## Manual Upgrades

Expand Down
1 change: 1 addition & 0 deletions website/i18n/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -95,6 +95,7 @@
"progressbarandroid": "ProgressBarAndroid",
"progressviewios": "ProgressViewIOS",
"props": "Props",
"publishing-forks": "Publish your own version of react native",
"pushnotificationios": "PushNotificationIOS",
"refreshcontrol": "RefreshControl",
"removing-default-permissions": "Removing Default Permissions",
Expand Down
2 changes: 1 addition & 1 deletion website/siteConfig.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
const RemarkablePlugins = require('./core/RemarkablePlugins');

const users = require('./showcase.json');
const defaultVersionShown = '0.58';
const defaultVersionShown = '0.59';
const baseUrl = '/react-native/';
const repoUrl = 'https://github.com/facebook/react-native';
const siteConfig = {
Expand Down
4 changes: 4 additions & 0 deletions website/versioned_docs/version-0.5/accessibility.md
Original file line number Diff line number Diff line change
Expand Up @@ -149,6 +149,10 @@ Use this property to assign a custom function to be called when someone activate

Assign this property to a custom function which will be called when someone performs the "magic tap" gesture, which is a double-tap with two fingers. A magic tap function should perform the most relevant action a user could take on a component. In the Phone app on iPhone, a magic tap answers a phone call, or ends the current one. If the selected element does not have an `onMagicTap` function, the system will traverse up the view hierarchy until it finds a view that does.

#### onAccessibilityEscape (iOS)

Assign this property to a custom function which will be called when someone performs the "escape" gesture, which is a two finger Z shaped gesture. An escape function should move back hierarchically in the user interface. This can mean moving up or back in a navigation hierarchy or dismissing a modal user interface. If the selected element does not have an `onAccessibilityEscape` function, the system will attempt to traverse up the view hierarchy until it finds a view that does or bonk to indicate it was unable to find one.

#### accessibilityComponentType (Android)

> **Note:** > `accessibilityComponentType` will soon be deprecated. When possible, use `accessibilityRole` and `accessibilityStates` instead of `accessibilityTraits` and `accessibilityComponentType`.
Expand Down
2 changes: 1 addition & 1 deletion website/versioned_docs/version-0.5/communication-ios.md
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ class ImageBrowserApp extends React.Component {
}
}
AppRegistry.registerComponent('AwesomeProject', () => ImageBrowserApp);
AppRegistry.registerComponent('ImageBrowserApp', () => ImageBrowserApp);
```

`RCTRootView` also provides a read-write property `appProperties`. After `appProperties` is set, the React Native app is re-rendered with new properties. The update is only performed when the new updated properties differ from the previous ones.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ Exposing a view is simple:

@implementation RNTMapManager

RCT_EXPORT_MODULE()
RCT_EXPORT_MODULE(RNTMap)

- (UIView *)view
{
Expand Down
32 changes: 8 additions & 24 deletions website/versioned_docs/version-0.5/running-on-device.md
Original file line number Diff line number Diff line change
Expand Up @@ -349,42 +349,26 @@ To configure your app to be built using the `Release` scheme, go to **Product**

![](/react-native/docs/assets/ConfigureReleaseScheme.png)

### 3. Configure app to use static bundle
#### Pro Tips

During the development process, React Native has loaded your JavaScript code dynamically at runtime. For a production build, you want to pre-package the JavaScript bundle and distribute it inside your application. Doing this requires a code change in your code so that it knows to load the static bundle.

In `AppDelegate.m`, change `jsCodeLocation` to point to the static bundle if you're not in debug mode.
As your App Bundle grows in size, you may start to see a white screen flash between your splash screen and the display of your root application view. If this is the case, you can add the following code to `AppDelegate.m` in order to keep your splash screen displayed during the transition.

```objc
#ifdef DEBUG
jsCodeLocation = [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index" fallbackResource:nil];
#else
jsCodeLocation = [[NSBundle mainBundle] URLForResource:@"main" withExtension:@"jsbundle"];
#endif
// Place this code after "[self.window makeKeyAndVisible]" and before "return YES;"
UIView* launchScreenView = [[[NSBundle mainBundle] loadNibNamed:@"LaunchScreen" owner:self options:nil] objectAtIndex:0];
launchScreenView.frame = self.window.bounds;
rootView.loadingView = launchScreenView;
```
This will now reference the `main.jsbundle` resource file that is created during the `Bundle React Native code and images` Build Phase in Xcode.

> Note: The static bundle is built every time you target a physical device, even in Debug. If you want to save time, turn off bundle generation in Debug by adding the following to your shell script in the Xcode Build Phase `Bundle React Native code and images`:
The static bundle is built every time you target a physical device, even in Debug. If you want to save time, turn off bundle generation in Debug by adding the following to your shell script in the Xcode Build Phase `Bundle React Native code and images`:
```shell
if [ "${CONFIGURATION}" == "Debug" ]; then
export SKIP_BUNDLING=true
fi
```

#### Pro Tip

As your App Bundle grows in size, you may start to see a white screen flash between your splash screen and the display of your root application view. If this is the case, you can add the following code to `AppDelegate.m` in order to keep your splash screen displayed during the transition.

```objc
// Place this code after "[self.window makeKeyAndVisible]" and before "return YES;"
UIView* launchScreenView = [[[NSBundle mainBundle] loadNibNamed:@"LaunchScreen" owner:self options:nil] objectAtIndex:0];
launchScreenView.frame = self.window.bounds;
rootView.loadingView = launchScreenView;
```
### 4. Build app for release
### 3. Build app for release

You can now build your app for release by tapping `⌘B` or selecting **Product****Build** from the menu bar. Once built for release, you'll be able to distribute the app to beta testers and submit the app to the App Store.

Expand Down
2 changes: 1 addition & 1 deletion website/versioned_docs/version-0.5/signed-apk-android.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ Android requires that all apps be digitally signed with a certificate before the

You can generate a private signing key using `keytool`. On Windows `keytool` must be run from `C:\Program Files\Java\jdkx.x.x_x\bin`.

$ keytool -genkey -v -keystore my-release-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000
$ keytool -genkeypair -v -keystore my-release-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000

This command prompts you for passwords for the keystore and key and for the Distinguished Name fields for your key. It then generates the keystore as a file called `my-release-key.keystore`.

Expand Down
18 changes: 15 additions & 3 deletions website/versioned_docs/version-0.5/testing.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ Whenever you are fixing a bug or adding new functionality to React Native, you s
* [Android](testing.md#android)
* [iOS](testing.md#ios)
* [Apple TV](testing.md#apple-tv)
* [End-to-end tests](testing.md#end-to-end-tests)
* [Manual end-to-end tests](testing.md#manual-end-to-end-tests)
* [Updating the Documentation](testing.md#updating-the-documentation)

## JavaScript
Expand Down Expand Up @@ -108,6 +108,18 @@ A common type of integration test is the snapshot test. These tests render a com

If you make a change that affects a snapshot test in a PR, such as adding a new example case to one of the examples that is snapshotted, you'll need to re-record the snapshot reference image. To do this, simply change to `_runner.recordMode = YES;` in [RNTester/RNTesterSnapshotTests.m](https://github.com/facebook/react-native/blob/master/RNTester/RNTesterIntegrationTests/RNTesterSnapshotTests.m#L42), re-run the failing tests, then flip record back to `NO` and submit/update your PR and wait to see if the Circle build passes.

### Automated End-to-End Tests

End-to-end tests written in [Detox](https://github.com/wix/Detox) confirm that React Native components and APIs function correctly in the context of a running app. They run the RNTester app in the simulator and simulate a user interacting with the app.

You can run Detox end-to-end tests locally by [installing the Detox CLI](https://github.com/wix/Detox/blob/master/docs/Introduction.GettingStarted.md#step-1-install-dependencies) on macOS, then running the following in the command line:

$ cd react-native
$ npm run build-ios-e2e
$ npm run test-ios-e2e

If you work on a component or API that isn't convered by a Detox test, please consider adding one. Detox tests are stored under [`RNTester/e2e/__tests__`](https://github.com/facebook/react-native/tree/master/RNTester/e2e/__tests__).

## Apple TV

The same tests discussed above for iOS will also run on tvOS. In the RNTester Xcode project, select the RNTester-tvOS target, and you can follow the same steps above to run the tests in Xcode.
Expand All @@ -117,9 +129,9 @@ You can run Apple TV unit and integration tests locally by running the following
$ cd react-native
$ ./scripts/objc-test-tvos.sh (make sure the line `TEST="test"` is uncommented)

## End-to-end tests
## Manual end-to-end tests

Finally, make sure end-to-end tests run successfully by executing the following script:
Finally, make sure manual end-to-end tests run successfully by executing the following script:

$ cd react-native
$ ./scripts/test-manual-e2e.sh
Expand Down
4 changes: 2 additions & 2 deletions website/versioned_docs/version-0.5/tutorial.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ Let's do this thing.

## Hello World

In accordance with the ancient traditions of our people, we must first build an app that does nothing except say "Hello world". Here it is:
In accordance with the ancient traditions of our people, we must first build an app that does nothing except say "Hello, world!". Here it is:

```ReactNativeWebPlayer
import React, { Component } from 'react';
Expand All @@ -20,7 +20,7 @@ export default class HelloWorldApp extends Component {
render() {
return (
<View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
<Text>Hello world!</Text>
<Text>Hello, world!</Text>
</View>
);
}
Expand Down
50 changes: 18 additions & 32 deletions website/versioned_docs/version-0.5/upgrading.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,65 +4,51 @@ title: Upgrading to new React Native versions
original_id: upgrading
---

Upgrading to new versions of React Native will give you access to more APIs, views, developer tools and other goodies. Upgrading requires a small amount of effort, but we try to make it easy for you. The instructions are a bit different depending on whether you used `create-react-native-app` or `react-native init` to create your project.
Upgrading to new versions of React Native will give you access to more APIs, views, developer tools and other goodies. Upgrading requires a small amount of effort, but we try to make it easy for you.

## Expo projects

Upgrading your Expo project to a new version of React Native requires updating the `react-native`, `react`, and `expo` package versions in your `package.json` file. Please refer to [this list](https://docs.expo.io/versions/latest/sdk/#sdk-version) to find out what versions are supported. You will also need to set the correct `sdkVersion` in your `app.json` file.

See the [Upgrading Expo SDK Walkthrough](https://docs.expo.io/versions/latest/workflow/upgrading-expo-sdk-walkthrough) for up-to-date information about upgrading your project.

## Projects built with native code
## React Native projects

<div class="banner-crna-ejected">
<h3>Projects with Native Code Only</h3>
<p>
This section only applies to projects made with <code>react-native init</code> or to those made with <code>expo init</code> or Create React Native App which have since ejected. For more information about ejecting, please see the <a href="https://github.com/react-community/create-react-native-app/blob/master/EJECTING.md" target="_blank">guide</a> on the Create React Native App repository.
</p>
</div>

Because React Native projects built with native code are essentially made up of an Android project, an iOS project, and a JavaScript project, upgrading can be rather tricky. Here's what you need to do to upgrade from an older version of React Native.
Because typical React Native projects are essentially made up of an Android project, an iOS project, and a JavaScript project, upgrading can be rather tricky. Here's what you need to do to upgrade from an older version of React Native.

### Upgrade based on Git

The module `react-native-git-upgrade` provides a one-step operation to upgrade the source files with a minimum of conflicts. Under the hood, it consists in 2 phases:

* First, it computes a Git patch between both old and new template files,
* Then, the patch is applied on the user's sources.

> **IMPORTANT:** You don't have to install the new version of the `react-native` package, it will be installed automatically.
The [React Native CLI](https://github.com/react-native-community/react-native-cli) comes with `upgrade` command that provides a one-step operation to upgrade the source files with a minimum of conflicts, thanks to the [rn-diff-purge](https://github.com/react-native-community/rn-diff-purge) project.

#### 1. Install Git
#### 1. Make sure your project uses Git

While your project does not have to be handled by the Git versioning system -- you can use Mercurial, SVN, or nothing -- you will still need to [install Git](https://git-scm.com/downloads) on your system in order to use `react-native-git-upgrade`. Git will also need to be available in the `PATH`.
> This step applies only to projects that don't use Git. Skip it if yours use it.
#### 2. Install the `react-native-git-upgrade` module

The `react-native-git-upgrade` module provides a CLI and must be installed globally:
While your project does not have to be handled by the Git versioning system -- you can use Mercurial, SVN, or nothing -- you will still need to [install Git](https://git-scm.com/downloads) on your system in order to use `react-native upgrade`. Git will also need to be available in the `PATH`. If your project doesn't use Git, initialize it and commit:

```sh
$ npm install -g react-native-git-upgrade
git init
git add .
git commit -m "upgrade RN"
```

#### 3. Run the command
After the upgrade is done and conflicts resolved, you can remove the `.git` directory.

#### 2. Run the `upgrade` command

Run the following command to start the process of upgrading to the latest version:

```sh
$ react-native-git-upgrade
react-native upgrade
```

> You may specify a React Native version by passing an argument: `react-native-git-upgrade X.Y.Z`
You may specify a React Native version by passing an argument, e.g. to upgrade to `0.59.0-rc.0` run:

Upon completion, run the following command to find your corresponding git patch file.

```
$ ls $TMPDIR/react-native-git-upgrade
```sh
react-native upgrade 0.59.0-rc.0
```

To apply the git patch, run `git apply <path to patch>` inside your project folder.

The templates are upgraded in a optimized way. You still may encounter conflicts but only where the Git 3-way merge have failed, depending on the version and how you modified your sources.
The project is upgraded using `git apply` with 3-way merge. That's why it may happen you'll need to resolve some conflicts.

#### 4. Resolve the conflicts

Expand Down
Loading

0 comments on commit 8f2c417

Please sign in to comment.