Summary:
Simple API takes structured `sections` prop instead of `data` array. `sections` is an array of
`Section` objects, each of which has a `key` and an `itemData` array which is analogous to a
`FlatList` `data` prop, plus optional props like `ItemComponent` that can be overridden on a
per-section level, allowing heterogeneous section item rendering via clean composition.
Flattens the sections data and renders with VirtualizedList under the hood. Doesn't support
sticky headers yet.
Reviewed By: yungsters
Differential Revision: D4519354
fbshipit-source-id: 58de959dadb6f55f681245ecd99a5dc356a48f36
Summary:
What existing problem does the pull request solve?
It fixes some formatting issues that appear in the React Native documentation.
**Test plan**
Run the documentation extraction and verify the content appears correctly as `code` formatted sections.
Closes https://github.com/facebook/react-native/pull/12346
Differential Revision: D4553340
Pulled By: hramos
fbshipit-source-id: b8307b3c3e1c3451f740c46222e10ec3c45e3008
Summary:
Simple cleanup for AppRegistry.
Also added `registerSection()` helper to mark registered components as app-specific sections. Sections can be treated in many custom ways, e.g. they could just indicate the top level tabs, or something else. A bunch of helpers are also added.
Reviewed By: yungsters
Differential Revision: D4542788
fbshipit-source-id: 07addecb78a7514e973335bca24414fd8db40997
Summary:
iOS return all 0 metrics for <Text> inside <Text>, which results immediate `onPressOut` event on press in. These kind of response should be ignored
this solved issue #11462
Closes https://github.com/facebook/react-native/pull/11530
Differential Revision: D4541452
Pulled By: ericvicenti
fbshipit-source-id: efd7bf1b380b1aecf7301b23f1fbd5a77a9e9095
Summary:
Flow was complaining about an interpolated value I created in a class constructor, and I realized there was no way to properly import the `AnimatedInterpolation` class type. This allows for using `Animated.Interpolation` as a type to match `Animated.Value`
Closes https://github.com/facebook/react-native/pull/9360
Differential Revision: D4538770
Pulled By: lacker
fbshipit-source-id: 49da2374f2d73ad3d667dafaa6338b77b9aec8a8
Summary:
I discovered this while trying to pinpoint why Nuclide Inspector integration with RN is so flaky. It turns out that, for some reason, if I create a `WebSocket` instance early enough (which I need to when setting up DevTools integration), and the connection is fast enough (which it is on localhost), the `websocketOpen` message may arrive earlier than an `onopen` event handler is registered, causing the `onopen` handler to never fire.
```
mkdir ~/my-server
cd ~/my-server
npm i ws
nano index.js
```
Paste this code:
```js
const ws = require('ws');
const wss = new ws.Server({
port: 8099
});
```
Run the server:
```js
node index.js
```
Now, inside React Native, paste right after [these lines](57010d63b6/Libraries/Core/InitializeCore.js (L193-L194)):
```js
const ws = new window.WebSocket('ws://localhost:8099');
ws.onopen = function() {
alert('open!');
};
```
Closes https://github.com/facebook/react-native/pull/12305
Differential Revision: D4536554
Pulled By: gaearon
fbshipit-source-id: 3021fa26b3bf275cba3704a7f3a30c77db69a1f8
Summary:
added context for easier understanding as 'ellipsizeMode' appears before 'numberOfLines' in https://facebook.github.io/react-native/docs/text.html
Explain the **motivation** for making this change. What existing problem does the pull request solve?
Upon first reading the Text docs, the ellipsizeMode function is confusing. This update aims to remove the confusion.
Closes https://github.com/facebook/react-native/pull/11881
Differential Revision: D4533700
Pulled By: lacker
fbshipit-source-id: 948df16235a0ba02c14e630518bbd7261bc2b802
Summary:
findNodeHandle is considered an internal module. The one to use is ReactNative.findNodeHandle. We need to rely on this because we will have two different renderers and we need the renderers to inject themselves with findNodeHandle before it is used.
I use ReactNative.findNodeHandle from inside the module because I think this leads to a cycle somewhere or might not play well with inline require otherwise.
There is also one in UIManager but that is definitely a cycle so I'm going to try to avoid that one.
Reviewed By: spicyj, bvaughn
Differential Revision: D4533911
fbshipit-source-id: f771641ea5c5366ccbaff68c42202fa6f8c18cb3
Summary:
Looks like a recent change in Yoga causes the height of an absolutely positioned fullscreen view to break.
This works around the issue by using the newly introduced percentage `height` instead.
Reviewed By: jingc
Differential Revision: D4530240
fbshipit-source-id: 86d758576c6984686f30d7504e11f9ec3ce469bd
Summary:
React Native 0.39 introduced a breaking change through a new C-based implementation of css-layout. Developers were encouraged to remove unnecessary flex: 1 styles where no longer required to address any resulting layout issues.
The SwipeableListView has not yet been updated to reflect this change. Specifically, SwipeableRow still sets flex: 1 even though it shouldn't.
This was resulting in a rendering issue for folks when they upgraded to React Native 0.39 and used SwipeableListView that caused significant initial flickering when rendering a SwipeableListView. The solution was simply to remove flex: 1 from the SwipeableRow implementation.
This small change removes flex: 1 to resolve this issue.
Suggested reviewer (initial SwipeableListView contributor): fred2028
See this issue for more details: https://github.com/facebook/react-native/issues/11441
Closes https://github.com/facebook/react-native/pull/11521
Differential Revision: D4532562
Pulled By: lacker
fbshipit-source-id: 5c2907186d00481a731bd81794947a019465a031
Summary: We deprecated `transformMatrix` and `decomposedMatrix` in D3239960 10 months ago. This revision finally removes remains of this functionality from native code.
Reviewed By: mmmulani
Differential Revision: D4515760
fbshipit-source-id: b4d5b7e834ac4a775f4992b28270b4ff961889a6
Summary: Now layout direction (LTR or LTR) can be specified not only for whole app but also for view subtree via `direction` style property.
Reviewed By: mmmulani
Differential Revision: D4510206
fbshipit-source-id: 4e56c5886b6e42f2343165eb76be897e681c5ba4
Summary:
The stall watchdog is handy to detect stalls, but it doesn't really tell us what was
happening. This diff makes it easy to track React perf and bridge traffic during any stall, and
prints it out if the stall exceeds the threshold.
Reviewed By: yungsters
Differential Revision: D4479439
fbshipit-source-id: 87f94913ec341a648d7744249597dc30b29759ab
Summary:
Corresponding iOS PR: https://github.com/facebook/react-native/pull/11002
This adds an onScroll event to TextInput which is useful when a multiline TextInput has so much content that it is scrollable.
**Test plan (required)**
Verified the event works properly in a test app. Also, my team uses this event in our app.
Adam Comella
Microsoft Corp.
Closes https://github.com/facebook/react-native/pull/11001
Differential Revision: D4220941
Pulled By: mkonicek
fbshipit-source-id: 7e420579946f2ae840c9e1fcdc8afab68007da17
Summary:
We really need a better list view - so here it is!
Main changes from existing `ListView`:
* Items are "virtualized" to limit memory - that is, items outside of the render window are unmounted and their memory is reclaimed. This means that instance state is not preserved when items scroll out of the render window.
* No `DataSource` - just a simple `data` prop of shape `Array<any>`. By default, they are expected to be of the shape `{key: string}` but a custom `rowExtractor` function can be provided for different shapes, e.g. graphql data where you want to map `id` to `key`. Note the underlying `VirtualizedList` is much more flexible.
* Fancy `scrollTo` functionality: `scrollToEnd`, `scrollToIndex`, and `scrollToItem` in addition to the normal `scrollToOffset`.
* Built-in pull to refresh support - set set the `onRefresh` and `refreshing` props.
* Rendering additional rows is usually done with low priority, after any interactions/animations complete, unless we're about to run out of rendered content. This should help apps feel more responsive.
* Component props replace render functions, e.g. `ItemComponent: ReactClass<{item: Item, index: number}>` replaces `renderRow: (...) => React.Element<*>`
* Supports dynamic items automatically by using `onLayout`, or `getItemLayout` can be provided for a perf boost and smoother `scrollToIndex` and scroll bar behavior.
* Visibility callback replaced with more powerful viewability callback and works in vertical and horizontal mode on at least Android and iOS, but probably other platforms as well. Extra power comes from the `viewablePercentThreshold` that lets the client decide when an item should be considered viewable.
Demo:
https://www.facebook.com/groups/576288835853049/permalink/753923058089625/
Reviewed By: yungsters
Differential Revision: D4412469
fbshipit-source-id: e2d891490bf76fe14df49294ecddf78a58adcf23
Summary:
The back view in <SwipeableRow /> should not be rendered unless the front view has been
rendered and its layout has been measured.
Reviewed By: fred2028
Differential Revision: D4509584
fbshipit-source-id: 72ad0c8e7dec258ae3a1ba88c0adeb9ad0bfdf6d
Summary:
Added a note to the `refreshControl` prop on ScrollView to call out that the prop only works for vertical ScrollViews.
Fixes#12139
Closes https://github.com/facebook/react-native/pull/12150
Differential Revision: D4508796
Pulled By: mkonicek
fbshipit-source-id: 8e71692f29ee175e32177c3a26a4ed2e8d14f139
Summary:
The `extractOffset` method is previously implemented on `Animated.Value`, along with `setOffset` and `flattenOffset`. Both of the latter methods are proxied on `Animated.ValueXY`, but `extractOffset` is not. This commit adds the missing method.
When creating draggable elements in XY space, in order to compensate for previous gestures' offsets, we currently need to do something like the following at the beginning or end of each gesture:
```
xy.setOffset(xy.__getValue());
xy.setValue({x: 0, y: 0});
```
After this commit, the API is equivalent to using a plain `Animated.Value`:
```
xy.extractOffset();
```
Closes https://github.com/facebook/react-native/pull/12193
Differential Revision: D4508717
Pulled By: mkonicek
fbshipit-source-id: 0976cf1ab68538e59023ffaa2539eb62779ad874
Summary: Exports Flow types for the props related to accessibility.
Reviewed By: fkgozali
Differential Revision: D4498562
fbshipit-source-id: 2fb6e78d4ceaf9f26b6ea88d515b7b28f570de52
Summary: Fixes the prop type of `accessibilityLabel` in `<Image>` so that it matches that of `<View>`.
Reviewed By: fkgozali
Differential Revision: D4499103
fbshipit-source-id: 66bf3dce60bd79857849e0c46c989e7866d83d81
Summary:
This improves JS validations of the transform object and makes it a bit stricter (hence the breaking change). When moving transform objects parsing to native (#10658) the validations got out of sync a bit, this makes sure JS validations are the same or stricter than the native ones to make sure we get consistent errors across platforms.
See #12110 for an example of an error that now gets caught by JS validations.
Also added snapshot tests for the errors to make sure `processTransform` throws when passing invalid values. It only tests the validation since the object parsing is now done natively for iOS and Android.
**Test plan**
Test that there are no errors in UIExplorer
Run new unit tests
Closes https://github.com/facebook/react-native/pull/12115
Differential Revision: D4488933
Pulled By: mkonicek
fbshipit-source-id: a714e6175b2892284a44c870506165099efec1ed
Summary:
This moves the `src` directory one level up and removes the `react-packager` folder. Personally, I always disliked this indirection. I'm reorganizing some things in RNP, so this seems to make sense.
Not sure if I forgot to update any paths. Can anyone advice if there are more places that need change?
Reviewed By: jeanlauliac
Differential Revision: D4487867
fbshipit-source-id: d63f9c79d6238300df9632d2e6a4e6a4196d5ccb
Summary:
**motivation**
Right now `SwipeableQuickActions` only allows two actions. Let this limit be in the userland.
cc fred2028
Closes https://github.com/facebook/react-native/pull/8528
Differential Revision: D4211729
Pulled By: ericvicenti
fbshipit-source-id: 903592190b9855ffe9da44864cdc276bc1e18a7c
Summary:
If a SwipeableRow does not have background color defined, QuickAction is rendered below the row. In such case, you can leverage openRowID defined in dataSource. For instance, one can render quickAction only for the open row. The openRowID, however, does not clear when the row is closed. It only clears when the ListView is scrolled. This is s small PR to fix address it.
Closes https://github.com/facebook/react-native/pull/11380
Differential Revision: D4500952
Pulled By: mkonicek
fbshipit-source-id: a965dfb45b77cc1669de405b627d13e2cee59420
Summary:
To update the documentation. Works on iOS, so I assume this is the same on Android.
Closes https://github.com/facebook/react-native/pull/11575
Differential Revision: D4494464
Pulled By: mkonicek
fbshipit-source-id: c7480d39ed0849401efaa080948c14fa0cb7a08d
Summary:
This prop exposes the functionality provided by Android ScrollView's setOverScrollMode method.
One interesting thing to note is that, if you were to read the Android docs, you would think that the value "always" is the default over scroll mode. However, the docs are incorrect and "always-if-content-scrolls" is actually the default value (http://stackoverflow.com/a/27116306).
**Test plan (required)**
Verified this change in a test app. Also, our team uses this change in our app.
Adam Comella
Microsoft Corp.
Closes https://github.com/facebook/react-native/pull/10905
Differential Revision: D4500957
Pulled By: mkonicek
fbshipit-source-id: 873eba38183defba133c228e0c1038efa83297d3
Summary: `RecyclerViewBackedScrollView` was added a long time ago to work around the scroll-back-when-data-is-added bug, but that has now been fixed directly in the `ScrollView` (`ReactScrollView.java`) in open source and internally.
Reviewed By: astreet
Differential Revision: D4482105
fbshipit-source-id: 208f21f00045d5c5a83b74ad69b3db6fa63391d7
Summary:
**Motivation**
Ability to customize slider colors is desirable to match the brand. Currently iOS allows using images for slider parts, but android doesn't have any customization options. This PR adds support for customizing `thumbTintColor`, `trackTintColor` and `progressTintColor`.
**Test plan (required)**
Run UIExplorer example with the changes and verify everything works fine.
cc brentvatne
Closes https://github.com/facebook/react-native/pull/11946
Differential Revision: D4427474
fbshipit-source-id: ec3a38db600bac6108691a4cfa15e2409143b9f3
Summary:
Largely typing fixes to deal with the glut of new `FlowFixMe` suppressions introduced with flow 0.38 in a4bfac907e
Tested with flow itself. CC gabelevi
Closes https://github.com/facebook/react-native/pull/11985
Differential Revision: D4452045
Pulled By: ericvicenti
fbshipit-source-id: acc46c4c406ae706a679e396be1d40ae2f4ce5a1
Summary:
Explain the **motivation** for making this change. What existing problem does the pull request solve?
I had tried fixing a broken link in a previous commit (#11453). My commit was merged, but it did not resolve the underlying problem. I have looked into how links should be formed for the docs and have fixed the original problem as well as updated all other links to be consistent.
Previous link formats:
- /docs/sample.html <-- broken link
- sample.html <-- broken link
- https://facebook.github.io/react-native/docs/sample.html <-- works
- /react-native/docs/sample.html <-- works
- docs/sample.html <-- works (permalink format)
This PR updates all links to the permalink format.
**Test plan (required)**
I ran the website locally and manually tested half of the links in each category. They all worked.
```
$ cd website
$ npm install && npm start
```
Closes https://github.com/facebook/react-native/pull/12064
Differential Revision: D4489153
Pulled By: mkonicek
fbshipit-source-id: bf0231d941ba147317595c3b3466dc579a887169
Summary:
Clearer wording, on first read it is possible to get the impression that it will return immediately for both cached and on update request.
Closes https://github.com/facebook/react-native/pull/12072
Differential Revision: D4482784
Pulled By: mkonicek
fbshipit-source-id: 9eb9acf946b97b7b2b51f07e6a6572098afe7610
Summary:
> Explain the **motivation** for making this change. What existing problem does the pull request solve?
The documentation was slightly out of date. Following https://github.com/facebook/react-native/pull/10898, which removed the `platform ios` tag, this updates the inner documentation to remove the reference to iOS.
Closes https://github.com/facebook/react-native/pull/11993
Differential Revision: D4443723
Pulled By: hramos
fbshipit-source-id: b859c9b0fe1f5e564b919663f8c75401a52ffc9f
Summary:
This is a followup for https://github.com/facebook/react-native/pull/12088 and implements the scrolling to end on Android natively rather than sending a large scroll offset from JS.
This turned out to be an OK amount of code, and some reduction in the amount of JavaScript. The only part I'm not particularly happy about is:
```
// ScrollView always has one child - the scrollable area
int bottom = scrollView.getChildAt(0).getHeight() + scrollView.getPaddingBottom();
```
According to multiple sources (e.g. [this SO answer](http://stackoverflow.com/questions/3609297/android-total-height-of-scrollview)) it is the way to get the total size of the scrollable area, similar to`scrollView.contentSize` on iOS but more ugly and relying on the fact the ScrollView always has a single child (hopefully this won't change in future versions of Android).
An alternative is:
```
View lastChild = scrollLayout.getChildAt(scrollLayout.getChildCount() - 1);
int bottom = lastChild.getBottom() + scrollLayout.getPadd
Closes https://github.com/facebook/react-native/pull/12101
Differential Revision: D4481523
Pulled By: mkonicek
fbshipit-source-id: 8c7967a0b9e06890c1e1ea70ad573c6eceb03daf
Summary:
RecyclerViewBackedScrollView was deprecated, this removes usages in Examples as well as in NetworkOverlay.
**Test plan**
Tested that RecyclerViewBackedScrollView deprecation warning doesn't show up anymore.
Closes https://github.com/facebook/react-native/pull/11999
Differential Revision: D4443707
Pulled By: hramos
fbshipit-source-id: 087afc9f183b3f2087965a2fe84301f422e48e9c
Summary: There's scenarios where you might want to retain transparency behind the header, but have a solid background for the scene stack and its transitions.
Reviewed By: ericvicenti, dwwoelfel
Differential Revision: D4471681
fbshipit-source-id: 529e999b96b02a00e8d625169989dda49fb3ddaa
Summary:
In theory, we should be able to animate any non-layout property, including custom ones. While there is still work to be done on the native side to fully enable this, we should start by dropping the prop whitelist.
Closes https://github.com/facebook/react-native/pull/10658
Differential Revision: D4379031
Pulled By: ericvicenti
fbshipit-source-id: fe9c30ea101e93a8b260d7d09a909fafbb82fee6
Summary: `'invariant'` can only be resolved by chance if node modules have been installed with npm3 or yarn, as it is a transitive dependency of `babel-traverse`. This changes the import to the direct dependency `fbjs/lib/invariant`.
Reviewed By: jeanlauliac, astreet
Differential Revision: D4462471
fbshipit-source-id: 5c841845012ed22a7c6264d46326a47807948513
Summary:
Following the PR https://github.com/facebook/react-native/pull/6195, this adds a `HEIGHT` constant on `StatusBar` for iOS.
Combined with `statusBarFrameDidChange` and `statusBarFrameWillChange` StatusBar native events, it solves various problems with In-Call cellar bar / Location bar / others 40pt status bars, and offers a correct `keyboardVerticalOffset` value for the KeyboardAvoidingView component.
Closes https://github.com/facebook/react-native/pull/12041
Differential Revision: D4450924
Pulled By: hramos
fbshipit-source-id: 664798260f4226140f3fa3f9222a415a305d0d78
Summary:
If this is the way to go, I'll update the rest of the document :)
> Explain the **motivation** for making this change. What existing problem does the pull request solve?
- Update basic usage to latest ES6-7 syntax
- Provide a working simple example of using AppState
Closes https://github.com/facebook/react-native/pull/11879
Differential Revision: D4443891
Pulled By: hramos
fbshipit-source-id: 87433e994ee56050e24a3853f24a94b54f5586d4
Summary:
A temporary React Native compatibility fix was added to React in commit [bba0d99](bba0d992d8) and subsequently removed in commit [e612826](e612826650). I noticed this while testing the React Native fiber renderer and attempting to use `Systrace`.
This commit updates React Native to no longer rely on the deprecated method and module.
PS I'm not sure if I should also update `ReactDebugTool` with this commit or wait for a subsequent sync script to update it. I haven't committed to this repo before. Please advise. 😄
Closes https://github.com/facebook/react-native/pull/11970
Differential Revision: D4446219
Pulled By: bvaughn
fbshipit-source-id: f286b8a4d00cdcbfbb49f52b9f1db5231d453f4c
Summary:
Support `xhr.send(data)` for typed arrays.
**Test plan:** run UIExplorer example on iOS and Android.
Closes https://github.com/facebook/react-native/pull/11904
Differential Revision: D4425551
fbshipit-source-id: 065ab5873407a406ca4a831068ab138606c3361b
Summary:
Without allowing Native Responder on Android, ListView get's Deadlocked while trying to scroll. This happens as soon as a PanResponder fires.
This Commit prevents this Issue and the iOS Optimization for Locking / Unlocking Listview Scrolls does a good job on Android too. So there's no need to prevent the Native Responder.
**Test plan (required)**
Compile on Android in Production Mode and try to scroll before and after this change.
Closes https://github.com/facebook/react-native/pull/8556
Differential Revision: D4438057
Pulled By: hramos
fbshipit-source-id: 05f3b7e6b4e49f5c941c7e1ce72c8bf6d66a9a28
Summary:
Add one more parameter which can specify the keyboard type of first text input(if exists) to AlertIOS.prompt().
Example usage:
`AlertIOS.prompt('Type a phone number', null, null, 'plain-text', undefined, 'phone-pad')`
Closes https://github.com/facebook/react-native/pull/8781
Differential Revision: D4437900
Pulled By: hramos
fbshipit-source-id: 8141cc0d7c70d13603cd5a1d5ea3f1ab1ce437a6
Summary: Introduced IS_TESTING flag on Platform module for android as well. This is useful for testing environment.
Reviewed By: mmmulani
Differential Revision: D4429662
fbshipit-source-id: 33711d7fb5666f0bac8aee444b71261f7f12770f
Summary: Switch to using IS_TESTING on the Platform module. While IS_TESTING has to be explicitly set in the test harness, this makes it more usable and stops people from relying on brittle variables in the (larger) environment.
Reviewed By: fkgozali
Differential Revision: D4423661
fbshipit-source-id: 27a80867778b9374bcba67b69f9c93d32c0a74b0
Summary: Since we don't support this, we should throw early. Also tries to improve the error message when adding a node that doesn't have a YogaNode to a node that can't measure itself.
Reviewed By: andreicoman11
Differential Revision: D4421542
fbshipit-source-id: e0be8cdd763091145e5e6af2db91515f4d236b37
Summary:
In the context of an app an image exists in three resolutions on the server: `thumb` (30px) `feed` (300px) `full` (900px). When looking at an individual item a user can come either from the feed, via a permalink or from other parts of the app. This allows a situation where the `feed` image might or might not already be loaded somewhere in the app. In the detail view I want to render `thumb` with a blur (to quickly display something), then the `feed` image if it exists to have something decent to display until `full` loads. However it is quite a waste to load the `feed` image if it isn't already in cache, and will slow down the time until `full` is loaded. It is possible to track the navigation from feed->detail and that the `feed` image has actually completed loading by the feed component however as component hierarchies grow this turns into quite a lot of prop passing and bad separation of concerns.
NSURLRequests accepts a [Cache Policy](https://developer.apple.com/reference/fo
Closes https://github.com/facebook/react-native/pull/10844
Differential Revision: D4425959
Pulled By: lacker
fbshipit-source-id: 679835439c761a2fc894f56eb6d744c036cf0b49
Summary:
> Explain the **motivation** for making this change. What existing problem does the pull request solve?
`AnimatedValueX` has `removeAllListeners()` which is a convenient way to do cleanup when components unmount, but `AnimatedValueXY` was missing a similar method which doesn't really make sense. This change makes the two classes more similar, less confusing and more convenient.
Closes https://github.com/facebook/react-native/pull/11783
Differential Revision: D4397188
fbshipit-source-id: d10a0c9c7e0a83af015ec04f6facf965d95ea984
Summary:
This adds a hook to let you disable yellow box warnings. It's useful for native engineers who don't want to mess with JS but also for CI/testing, where the app operates mostly as a blackbox.
Depends on D4395091
Reviewed By: achen1
Differential Revision: D4395552
fbshipit-source-id: 4c3a9676caa975c537d1a4711d60aab2f404db15
Summary:
When something comes in from the right, we swipe from left to
right to move back. That means, when something comes in from the bottom,
we should swipe from top to bottom to get rid of it. This diff makes that
behavior occur - right now it's somewhat nonsensical as both jumpBack
and jumpForward are mapped to the same gesture.
thanks to #11192 for making gestures work on VerticalUpSwipeJumps
Reviewed By: ericvicenti, shergin
Differential Revision: D4412129
fbshipit-source-id: 6a3b202b0a90ca459b4ef106ba5bf48d0b1aec9e
Summary:
Hi,
The (as of yet unreleased) commit 5537055bf8 added some ListView and ScrollView mocks, but they leave out the original properties passed into them, which broke some of my tests (e.g. by excluding some properties like `testID`, for example, from the render tree) and I assume might break others' as well.
This PR makes it so the ListView mock directly returns the scroll component (instead of wrapping it in a View), and has ListViewMock and ScrollViewMock pass their given properties through.
Closes https://github.com/facebook/react-native/pull/11847
Differential Revision: D4408497
Pulled By: sahrens
fbshipit-source-id: 7ec01c35d6b8efeb97761cddffdb4075d09c7d70
Summary:
On Android with dev mode on, we're seeing a regular SIGSEGV when pushing a lot of animation declarations over the bridge. We tracked this down to being not specific to animations, but the crash is caused in `deepFreezeAndThrowOnMutationInDev`.
Specifically: the provided object to freeze is modified while looping, replacing the current key access to a getter/setter. After the modification, JSC crashes during retrieval of the next key - but only when there are a lot of events passing over the bridge.
We have a hunch that this is due to a bug in JSC object enumeration but did we not look into it further yet. Any help here is welcome. The JS code seems all right at first sight and shouldn't cause a segmentation crash.
The workaround in this PR is to retrieve the keys first from the object and then looping over that array. In our app and in a reduced app test case this fixes the crash.
If needed I can provide the reduced app test case. It's really tricky to make a test for this as it requires to be run
Closes https://github.com/facebook/react-native/pull/11804
Differential Revision: D4403483
Pulled By: davidaurelio
fbshipit-source-id: a31e5cff734e96bfec56e4a39dc1c6854798e245
Summary:
This fixes a broken link in the docs.
Closes https://github.com/facebook/react-native/pull/11453
Differential Revision: D4394773
Pulled By: lacker
fbshipit-source-id: 07b3aaa25017912063ac9e65f336c56a902d7144
Summary:
Hello,
This PR adds a property to the `ListView` to enable and disable to sticky sections headers behaviour. Current this is enabled by default and there is no way to disable it. It has been previously discussed in #1974 where there was a suggestion to add the `ListView` inside `ScrollView`. This is bad for performance, but some people were using that as a workaround. satya164 suggested someone submitting a PR, which is why I'm here 😉
I have tested the property manually by adding `stickySectionHeaders={false}` to the `<ListView> Paging` example in `UIExplorer`. I have also tested that the current behaviour still stands, so this is a non-breaking change.
I have also checked that the website displays the new documentation.
I couldn't see anywhere to add automated tests to this, but if there is feel free to point it out and I'll update this PR.
I tried running `npm run lint` to check the code style, but it spat out loads and loads of errors. I presume I have something set up incorrectly. Feel
Closes https://github.com/facebook/react-native/pull/11700
Differential Revision: D4380916
fbshipit-source-id: 7782043afc9f0108c81f97952fed60b153479cac
Summary:
This PR adds the `testID` prop to the `Button` component in order to allow end-to-end tests.
Closes https://github.com/facebook/react-native/pull/11526
Differential Revision: D4392137
Pulled By: ericvicenti
fbshipit-source-id: d3f864aacee319e520af226cd063edef452f6fc8
Summary:
I see there is a string matching inconsistency in `Libraries/CustomComponents/Navigator/Navigator.js` and `Libraries/CustomComponents/Navigator/NavigatorSceneConfigs.js`, which caused a bug resulting in gestures not working for vertical SceneConfigs. This PR fixes the inconsistency, and the bug.
**Motivation for making this change**
When working with the navigator, I was using the `VerticalUpSwipeJump` Navigator SceneConfig. The gesture to pop to the previous scene (in this case `jumpBack`) was not working.
**How I tested?**
I changed these strings (as shown in this PR) and swiped down. After these changes, everything worked as expected.
**Example**
In `Libraries/CustomComponents/Navigator/Navigator.js`, we check for gesture direction strings `bottom-to-top` and `top-to-bottom` in multiple places, but nowhere do we ever check for `up-to-down` and `down-to-up`.
```
var isTravelVertical = gesture.direction === 'top-to-bottom' || gesture.direction === 'bottom-to-top';
var isTravelInverted =
Closes https://github.com/facebook/react-native/pull/11192
Differential Revision: D4392103
Pulled By: ericvicenti
fbshipit-source-id: fd80578031f94b1b409815481c82e481c7ff2f13
Summary:
It seems that the `requestPermission` and `checkPermission` APIs from PermissionsAndroid have been deprecated in react-native 0.40.0., but they are still used in the description and example.
This commit updates the description and the example to use the new APIs.
Closes https://github.com/facebook/react-native/pull/11722
Differential Revision: D4392031
Pulled By: ericvicenti
fbshipit-source-id: e3ceebb1ef557e05dab40bb883013be4ec80bed6
Summary:
In Android, components using an elevation > 0 are able to hide the YellowBox. Especially bad when they happen to hide the dismiss button of the inspector.
Closes https://github.com/facebook/react-native/pull/11777
Differential Revision: D4392027
Pulled By: ericvicenti
fbshipit-source-id: 96ab98520cd54b9bb683d984f9990bf0e90b9a37
Summary:
Currently, < WebView > allows you to pass JS to execute within the view. This works great, but there currently is not a way to execute JS after the page is loaded. We needed this for our app.
We noticed that the WebView had messaging support added (see #9762) . Initially, this seemed like more than enough functionality for our use case - just write a function that's injected on initial load that accepts a message with JS, and `eval()` it. However, this broke once we realized that Content Security Policy can block the use of eval on pages. The native methods iOS provide to inject JS allow you to inject JS without CSP interfering. So, we just wrapped the native methods on iOS (and later Android) and it worked for our use case. The method injectJavaScript was born.
Now, after I wrote this code, I realized that #8798 exists and hadn't been merged because of a lack of tests. I commend what was done in #8798 as it sorely solves a problem (injecting JS after the initial load) and has more features than what I'
Closes https://github.com/facebook/react-native/pull/11358
Differential Revision: D4390425
fbshipit-source-id: 02813127f8cf60fd84229cb26eeea7f8922d03b3
Summary:
RCTRootView supports a property `passThroughTouches` which when set, allows
touches to propagate to sibling views. To allow touches to reach RCTRootView,
we also need to set `pointerEvents` on the RCTViews wrapping the child views.
Reviewed By: javache
Differential Revision: D4385443
fbshipit-source-id: 6291d8614870168f1c4cdf0ef5ff6e42e4a8ef63
Summary:
Puts hierarchy and other inspector data in a fixed height scrollview so it never takes up
too much space and you can always scroll to see everything you want.
Reviewed By: fkgozali
Differential Revision: D4374819
fbshipit-source-id: 89356670c984c693db345ad66a97d4cb54a98aee
Summary:
Adds the feature to use percentage as a value unit.
You can use the function ```YGPx(float)``` and ```YGPercent(float)``` for convenience.
I did some benchmarks:
```
Without Percentage Feature - Release x86:
Stack with flex: median: 0.000000 ms, stddev: 0.146683 ms
Align stretch in undefined axis: median: 0.000000 ms, stddev: 0.136525 ms
Nested flex: median: 0.000000 ms, stddev: 0.490101 ms
Huge nested layout: median: 23.000000 ms, stddev: 0.928291 ms
Stack with flex: median: 0.000000 ms, stddev: 0.170587 ms
Align stretch in undefined axis: median: 0.000000 ms, stddev: 0.143384 ms
Nested flex: median: 0.000000 ms, stddev: 0.477791 ms
Huge nested layout: median: 22.000000 ms, stddev: 2.129779 ms
With Percentage Feature - Release x86:
Stack with flex: median: 0.000000 ms, stddev: 0.132951 ms
Align stretch in undefined axis: median: 0.000000 ms, stddev: 0.136525 ms
Nested flex: median: 0.000000 ms, stddev: 0.489570 ms
Huge nested layout: median: 21.000000 ms, stddev: 1.390476 ms
Closes https://github.com/facebook/yoga/pull/258
Reviewed By: dshahidehpour
Differential Revision: D4361945
Pulled By: emilsjolander
fbshipit-source-id: a8f5bc63ad352eb9410d792729e56664468cd76a
Summary: This caused a bunch of stuff to break, reverting and will fix the problems before committing next time.
Reviewed By: fkgozali
Differential Revision: D4363398
fbshipit-source-id: 55146c9da998f6a3883307c36422a9d440ea7f52
Summary:
Bandaid for #7070. Until this is fixed, the docs should at least be honest the state they're in, so people don't have to go search and wonder.
Closes https://github.com/facebook/react-native/pull/11626
Differential Revision: D4366925
Pulled By: mkonicek
fbshipit-source-id: 082a8a9916ad0f8fbb2955cffbf61142fa2a98a1
Summary:
As of iOS10 permission is required to access user photos and their galleries, I felt this really needed to be addressed. I hope to create a section dedicated to iOS permissions soon.
Closes https://github.com/facebook/react-native/pull/11259
Differential Revision: D4364354
Pulled By: hramos
fbshipit-source-id: 97bdeb09deba01995eebd038e00ccc84b08281c9
Summary:
Transition animations are not very customizable right now with NavigationExperimental, unless I am missing something big. This PR allows NavigationCardStack to receive the `horizontalCardStyleInterpolator` and `verticalCardStyleInterpolator` props to override the default interpolators.
See the gif, transition animation changes from the default one (with scale) to a custom one (without scale) when passing in a custom interpolator. (The custom interpolator is an exact copy of the one in `NavigationCardStackStyleInterpolator.forHorizontal`, minus the scale transform.)
Let me know if there's a robust way to test, but I couldn't find anything.
**To address**
The new `canUseNativeDriver` function on NavigationCardStackStyleInterpolator, which returns `true`, is dependent on the interpolator, so custom interpolators may need to falsify this. Didn't include it on the first pass since I wasn
Closes https://github.com/facebook/react-native/pull/11082
Differential Revision: D4362540
Pulled By: ericvicenti
fbshipit-source-id: 2ebd0047c147ac3d6c43ce880661c99de8fd0880
Summary:
`Fake` components are simplified so snapshots are stable and reliable, and references are exported
so that interactions like `onRefresh` and `onScroll` can be called manually. Currently there is just
one global export for each class, but we may change this in the future if we need to manage multiple
`Fake`s of the same type in one render tree.
Right now these must be installed explicitly, but I might move them into `__mocks__` folders if it
seems reasonable to make them defaults.
Reviewed By: cpojer
Differential Revision: D4318207
fbshipit-source-id: 62802353a98b09ca1c80804ef7201ea63091f94a
Summary:
expose this property to make Text having same property like TouchableHighlight
Closes https://github.com/facebook/react-native/pull/11473
Differential Revision: D4348825
fbshipit-source-id: 941bcc681139d4460f52fed5174be1d2381462c7
Summary:
In the 8e2906ae89 commit there was implemented a cancelable option for Alerts. It wasn't clear from the docs about this option and the additional Alert method's parameter.
Closes https://github.com/facebook/react-native/pull/11292
Differential Revision: D4342707
Pulled By: lacker
fbshipit-source-id: dc243b868106e705040e77bc90d4d9b8c2dc26eb
Summary:
I'm pretty sure this is supposed to be "bottom" as opposed to "top", as it's the offset from the keyboard, which is at the bottom of the screen.
Closes https://github.com/facebook/react-native/pull/11446
Differential Revision: D4339957
Pulled By: lacker
fbshipit-source-id: 62dca544a0167704d76cd972c44570f277ea63aa
Summary:
cc brentvatne
potential reviewers mkonicek and kmagiera
**Motivation for making this change.**
The previous PR was closed : #11095 but the followup actions was never done
I reopened a really similar one so it get merged
RecyclerView is no more used at Facebook (according to previous PR)
According to brentvatne, their were two motivations for RecyclerView:
* ListView with ScrollView component used to bounce back on row insert, but this is now fixed
* This made possible to implement certain performance improvements, but the maintenance cost was not worth the risk
With RN 0.37, the actual code in React Native make the app crash:
- see #10560
I spend one hour investigating this and did also require brent time at exponent slack. I think other people are struggling too.
**Test plan**
<img width="708" alt="screen shot 2016-12-13 at 23 42 22" src="https://cloud.githubusercontent.com/assets/13785185/21162483/dbeb642e-c18d-11e6-9c32-1fe73f1826c1.png">
**Code formatting**
The
Closes https://github.com/facebook/react-native/pull/11445
Differential Revision: D4340640
Pulled By: mkonicek
fbshipit-source-id: 64c5cf060f2eb035d4d6199b30f0e73afc520180
Summary:
Thanks for submitting a pull request! Please provide enough information so that others can review your pull request:
> **Unless you are a React Native release maintainer and cherry-picking an *existing* commit into a current release, ensure your pull request is targeting the `master` React Native branch.**
Explain the **motivation** for making this change. What existing problem does the pull request solve?
Prefer **small pull requests**. These are much easier to review and more likely to get merged. Make sure the PR does only one thing, otherwise please split it.
**Test plan (required)**
Demonstrate the code is solid. Example: The exact commands you ran and their output, screenshots / videos if the pull request changes UI.
Make sure tests pass on both Travis and Circle CI.
**Code formatting**
Look around. Match the style of the rest of the codebase. See also the simple [style guide](https://github.com/facebook/react-native/blob/master/CONTRIBUTING.md#style-guide).
For more info, see
Closes https://github.com/facebook/react-native/pull/11459
Differential Revision: D4339946
Pulled By: lacker
fbshipit-source-id: d95e7c62dbf7bf6fd2ab3739b3d64bfcbe83e24a
Summary:
Android has a text API called breakStrategy for controlling how paragraphs are broken up into lines. For example, some modes support automatically hyphenating words so a word can be split across lines while others do not.
One source of complexity is that Android provides different defaults for `breakStrategy` for `TextView` vs `EditText`. `TextView`'s default is `BREAK_STRATEGY_HIGH_QUALITY` while `EditText`'s default is `BREAK_STRATEGY_SIMPLE`.
In addition to exposing `textBreakStrategy`, this change also fixes a couple of rendering glitches with `Text` and `TextInput`. `TextView` and `EditText` have different default values for `breakStrategy` and `hyphenationFrequency` than `StaticLayout`. Consequently, we were using different parameters for measuring and rendering. Whenever measuring and rendering parameters are inconsistent, it can result in visual glitches such as the text taking up too much space or being clipped.
This change fixes these inconsistencies by setting `breakStrategy` and `hyphenat
Closes https://github.com/facebook/react-native/pull/11007
Differential Revision: D4227495
Pulled By: lacker
fbshipit-source-id: c2d96bd0ddc7bd315fda016fb4f1b5108a2e35cf
Summary:
App will crash if result is null.
Closes https://github.com/facebook/react-native/pull/10338
Differential Revision: D4335305
Pulled By: lacker
fbshipit-source-id: 4910bfd7c56525a2ef1b252b56b8debd21fa2bae
Summary:
The reason for this change is to implement `allowFontScaling` on the Android's React Native Text component. Prior to this PR `allowFontScaling` only works for iOS.
The following link contains images of `allowFontScaling` working in Android on small, normal, large, and huge system fonts (from native Android display settings)
http://imgur.com/a/94bF1
The following link is a video of the same thing working on an Android emulator
https://youtu.be/1jTlZhPdj9Y
Here is the sample code snippet driving the video/images
```
render() {
const size = [12, 14, 16, 18];
return (
<View style={{backgroundColor: 'white', flex: 1}}>
<Text>
Default size no allowFontScaling prop (default true)
</Text>
<Text allowFontScaling={true}>
Default size allowFontScaling: true
</Text>
<Text style={{ marginBottom: 10, }} allowFontScaling={false}>
Default size allowFontScaling: false
</Text>
{ size.map(
Closes https://github.com/facebook/react-native/pull/10898
Differential Revision: D4335190
Pulled By: lacker
fbshipit-source-id: 0480809c44983644ff2abfcaf4887569b2bfede5
Summary:
When using React Native on Android on top of a game as an overlay, dialog windows sometimes get created with hardware acceleration disabled. This causes the UI to be unresponsive and anything that uses a TextureView stops working. Added a property for the modal view to make sure hardware acceleration flag is enabled when it's set to true.
**Test plan (required)**
set `hardwareAccelerated` property for Modal to force hardware acceleration on dialog windows on Android. Does nothing on iOS.
Closes https://github.com/facebook/react-native/pull/11421
Differential Revision: D4312912
Pulled By: andreicoman11
fbshipit-source-id: 9db6b2eca361421b92b24234b3501b5de0eecea7
Summary:
some server not work when upload a file with FromData in ios.
the reason is that there is a slash in boundary, like:
```
multipart/form-data; boundary=b/QeEbFgqK9PCZo4T/eXv7f.T74SHd5MxCZ846AsTz-yNV0xrRR_Zks4fkNMCzJck9ZE8o
// koa request.js (line 548)
is(types) {
if (!types) return typeis(this.req);
if (!Array.isArray(types)) types = [].slice.call(arguments);
return typeis(this.req, types);
}
// type-is index.js (line 237)
function normalizeType (value) {
// parse the type
var type = typer.parse(value)
// remove the parameters
type.parameters = undefined
// reformat it
return typer.format(type)
}
// media-typer
var paramRegExp = /; *([!#$%&'\*\+\-\.0-9A-Z\^_`a-z\|~]+) *= *("(?:[ !\u0023-\u005b\u005d-\u007e\u0080-\u00ff]|\\[\u0020-\u007e])*"|[!#$%&'\*\+\-\.0-9A-Z\^_`a-z\|~]+) */g;
```
thanks for dougwilson 's [answer](https://github.com/jshttp/media-typer/issues/5).
> The / is an illegal character for Content-Type, which is what this module parses
Closes https://github.com/facebook/react-native/pull/11342
Differential Revision: D4326750
Pulled By: javache
fbshipit-source-id: b1c78a335c95a5c223537545d87beaffe15d673d
Summary:
Gestures now work with native animations so we can enable it, it is also not needed anymore to check if the native module exists since we print a warning in the Animated module now.
**Test plan**
Tested that animations and gesture work properly in the UIExplorer example. Also been using native animations with NavigationExperimental (ex-nav) in an app for a while.
Closes https://github.com/facebook/react-native/pull/11234
Differential Revision: D4321763
Pulled By: ericvicenti
fbshipit-source-id: 255bed5bfed3b93bdc10939b5a03d4d8b00ceade
Summary:
I was comparing `<TouchableOpacity>` to `UIButton` in iOS and it just doesn't feel native. The initial delay was fixed by https://github.com/facebook/react-native/pull/10866 but still there is a lag between button release and animation.
I'm also not sure what `_hideTimeout` was used for. When logging `touchableHandle*` events looks like `touchableHandleActivePressIn` is called first, then `touchableHandleActivePressOut` and then `touchableHandlePress`. Which means the fade in animation from `touchableHandleActivePressOut` was interrupted by `touchableHandlePress`.
Reviewed By: vjeux
Differential Revision: D4309789
fbshipit-source-id: b6d4df544952e11c2ade97d860531cbb2fada36b
Summary:
need to remove function declaration in a lexically nested statement
because babel uses 'use strict' by default now
Closes https://github.com/facebook/react-native/pull/11390
Differential Revision: D4308275
fbshipit-source-id: 0d073361d25b23fb67f001225feb72532af38683
Summary: No need to have two files; merge it into one and give it an appropriate name.
Reviewed By: javache
Differential Revision: D4296716
fbshipit-source-id: 904d13c23bb8d403b8efcb60f9a4aa5df5b08972
Summary: This singleton was unnecessary and can be implemented with a single `static` in `RCTDevMenu`. In another diff, I will rename `RCTWebSocketManager.{h,m}` to reflect the only class that remains.
Reviewed By: javache
Differential Revision: D4296551
fbshipit-source-id: 653971dfb31de5b0a161b531eed82a067f536ce3
Summary: Avoid using properties where unnecessary; stick to only one way to modify the delegate.
Reviewed By: javache
Differential Revision: D4296351
fbshipit-source-id: 94d0e3c90904ed584f691a3f28a15a7ac450c3e1
Summary:
Right now, the ScrollView's keyboard hiding behavior is either all or nothing: Hide the keyboard on any tap, or do nothing ever. This PR introduces a third mode to keyboardShouldPersistTaps which is much closer to what I consider should be the default.
In the new behavior, the tap responding is done in the bubbling phase (instead of the capture phase like =true). As a result, a child can handle the tap. If no child does, then the ScrollView will receive the tap and will hide the keyboard. As a result, changing TextInput focus works as a user expects, with a single tap and without keyboard hiding. But taping on Text or on the empty part of the ScrollView hides the keyboard and removes the focus.
You can view the behavior in a monkey patched ScrollView demo on rnplay:
https://rnplay.org/apps/E90UYwhttps://rnplay.org/apps/UGzhKA
In order to have a uniform props set, i added 3 values to the keyboardShouldPersistTaps:
'never' and 'always' are the same as false and true.
'handled' is the new behavior.
I don't
Closes https://github.com/facebook/react-native/pull/10628
Differential Revision: D4294945
Pulled By: ericvicenti
fbshipit-source-id: 1a753014156cac1a23fabfa8e1faa9a768868ef2
Summary:
`RCTWebSocketExecutor` saves every WebSocket callback when sending message to chrome, but does not clear them in a debug session until the JS bridge is reloaded, and there may be thousands of blocks saved in the callback table. This PR removes them after they are called.
Closes https://github.com/facebook/react-native/pull/11341
Differential Revision: D4295710
Pulled By: javache
fbshipit-source-id: 29a02d1aba320115bbb97aee8981e34b89303c91
Summary:
Xcode really sucks, per some discussion on e1577df1fd and https://developer.apple.com/library/content/technotes/tn2215/_index.html, if you use the headers phase, and mark headers in your static library as public, they will actually end up in the final package that's built and you can't submit to the app store! This changes our xcode setup to use a copy files phase instead.
I've also changed the header include path to be $(BUILT_PRODUCTS_DIR)/include, which is added to the include path by Xcode by default, so 3rd party libraries should not be impacted by these changes anymore.
Reviewed By: mkonicek
Differential Revision: D4291607
fbshipit-source-id: 969b9ebcbeb8161f85427f8c429e198d9d0fae30
Summary:
Internal research at FB has shown that many devs don't know why they should use ListView instead of ScrollView, or that ListView even exists. This PR changes ScrollView's docs to upsell ListView.
I could put this as a separate guide in the docs, but I think this place will have the best possible reach for target audience.
Suggestions welcome. Let me know if it doesn't make sense or is too verbose.
Closes https://github.com/facebook/react-native/pull/11349
Differential Revision: D4292109
Pulled By: mkonicek
fbshipit-source-id: e4a14e5a55333c9282d0e407461505e71e850b20
Spencer Ahrens
Valentin Shergin
Andrew Monshizadeh
Pieter De Baets
Sokovikov
Angela Hess
Matthew Oaxaca
Kevin Gozali
Libin Lu
Connor McEwen
Dan Abramov
Frazer Kirkman
Sebastian Markbage
Sachin Rekhi
Alexey Kureev
Tim Yung
Adam Comella
Bhuwan Khattar
Hedger Wang
Jon Cursi
Jani Eväkallio
Mehdi Mulani
Janic Duplessis
Christoph Pojer
Chirag
Dan Scanlon
Jonathan Koo
Michal Srb
Martin Konicek
Satyajit Sahoo
rh389
Paul Mestemaker
Bill
yyoshiki41
Hawken Rives
Sean Kinsey
Ryan Gomba
Alex Kotliarskyi
David Aurelio
Koen Punt
Mathieu Acthernoene
Héctor Ramos
Brian Vaughn
Philipp von Weitershausen
Aaron Chiu
Leon
yueshuaijie
Max Graey
Gabe Levi
Andy Street
Peter Salanki
Max Sherman
Seph Soliman
Kevin Lee
Dan Hassin
Albert Brand
Emil Sjolander
Paul Mestemaker
Matt Oakes
Gabriel Reis
alekhurst
Peter Juras
cailenmusselman
Luke Miles
Drew Volz
Lukas Woehrl
Horcrux
Alan Norbauer
Kevin Lacker
Leland Richardson
tychota
pedramsaleh
zongjingyao
Neo
Steven Goff
Eric Vicenti
Üstün Ergenoglu
unordered
Jeff Morrison
Alex Kotliarskyi
Anton Karpov
Adam Ernst
Travis Stanley
Maxime Lapointe
Eming Kwok
Mike Grabowski
Michał Gregorczyk
Martin Konicek
