Summary:
Fixes issue #11828 that causes layout animations for removed views to
remove some adjacent views as well. This happens because the animated
views are still present in the ViewGroup, which throws off subsequent
operations that rely on view indices having updated.
This issue was addressed in #11962, which was closed in favour of a more
reliable solution that addresses the issue globally since it’s difficult
to account for animated views everywhere. janicduplessis [recommended][0]
handling the issue through ViewManager.
Since API 11, Android provides `ViewGroup#startViewTransition(View)`
that can be used to keep child views visible even if they have been
removed from the group. ViewGroup keeps an array of these views, which
is only used for drawing. Methods such as `ViewGroup#getChildCount()`
and `ViewGroup#getChildAt(int)` will ignore them.
I believe relying on these framework methods within ViewManager is the
most reliable way to solve this issue because it also works if callers
ignore ViewManager and reach into the native view indices and counts
directly.
[0]: https://github.com/facebook/react-native/pull/11962#pullrequestreview-21862640
I wrote a minimal test app that you can find here:
<https://gist.github.com/lnikkila/87f3825442a5773f17ead433a810d53f>
The expected result is that the red and green squares disappear, a blue
one appears, and the black one stays in place. iOS has this behaviour,
but Android removes the black square as well.
We can see the bug with some breakpoint logging.
Without LayoutAnimation:
```
NativeViewHierarchyOptimizer: Removing node from parent with tag 2 at index 0
NativeViewHierarchyOptimizer: Removing node from parent with tag 4 at index 1
NativeViewHierarchyManager: Removing indices [0] with tags [2]
RootViewManager: Removing child view at index 0 with tag 2
NativeViewHierarchyManager: Removing indices [1] with tags [4]
RootViewManager: Removing child view at index 1 with tag 4
```
With LayoutAnimation tag 3 gets removed when it shouldn’t be:
```
NativeViewHierarchyOptimizer: Removing node from parent with tag 2 at index 0
NativeViewHierarchyOptimizer: Removing node from parent with tag 4 at index 1
NativeViewHierarchyManager: Removing indices [0] with tags [2]
NativeViewHierarchyManager: Removing indices [1] with tags [4]
-> RootViewManager: Removing child view at index 1 with tag 3
RootViewManager: Removing child view at index 2 with tag 4
(Animation listener kicks in here)
RootViewManager: Removing child view at index 1 with tag 2
```
Here are some GIFs to compare, click to expand:
<details>
<summary><b>Current master (iOS vs Android)</b></summary>
<p></p>
<img src="https://user-images.githubusercontent.com/1291143/38695083-fbc29cd4-3e93-11e8-9150-9b8ea75b87aa.gif" height="400" /><img src="https://user-images.githubusercontent.com/1291143/38695108-06eb73a6-3e94-11e8-867a-b95d7f926ccd.gif" height="400" />
</details><p></p>
<details>
<summary><b>With this patch (iOS vs Android, fixed)</b></summary>
<p></p>
<img src="https://user-images.githubusercontent.com/1291143/38695083-fbc29cd4-3e93-11e8-9150-9b8ea75b87aa.gif" height="400" /><img src="https://user-images.githubusercontent.com/1291143/38695137-1090f782-3e94-11e8-94c8-ce33a5d7ebdb.gif" height="400" />
</details><p></p>
Previously addressed in #11962, which wasn’t merged.
Tangentially related to my other LayoutAnimation PR #18651.
No documentation changes needed.
[ANDROID] [BUGFIX] [LayoutAnimation] - Removal LayoutAnimations no longer remove adjacent views as well in certain cases.
Closes https://github.com/facebook/react-native/pull/18830
Reviewed By: achen1
Differential Revision: D7612904
Pulled By: mdvacca
fbshipit-source-id: a04cf47ab80e0e813fa043125b1f907e212b1ad4
Summary:
Before, any calls to ReactContext would either use the default DevSupportManager's exception handler in debug mode OR throw exceptions immediately in non debug mode. In order to intercept these kinds of native exceptions, we should reuse the NativeModuleCallExceptionHandler provided by the ReactInstanceManager. For those who don't specify a NativeModuleCallExceptionHandler, the resulting behavior remains the same. For those who do specify a NativeModuleCallExceptionHandler,
the main difference is that it will now be responsible for handling exceptions for ReactContext.handleException
Reviewed By: mdvacca
Differential Revision: D7641772
fbshipit-source-id: 8f175df687723fcbb8a7620f90d8a08c94798738
Summary: Still gross but less gross.
Reviewed By: sebmarkbage
Differential Revision: D7107180
fbshipit-source-id: 31f1639a8f44e4ab247c338001a4a5c9b4b83cdf
Summary:
Issue [#2088](https://github.com/facebook/react-native/issues/2088).
The basic desire is to have a declarative mechanism to transform text content to uppercase or lowercase or titlecase ("capitalized").
My test plan involves having added a test-case to the RNTester app within the `<Text>` component area. I then manually verified that the rendered content met my expectation.
Here is the markup that exercises my enhancement:
```
<View>
<Text style={{ textTransform: 'uppercase'}}>
This text should be uppercased.
</Text>
<Text style={{ textTransform: 'lowercase'}}>
This TEXT SHOULD be lowercased.
</Text>
<Text style={{ textTransform: 'capitalize'}}>
This text should be CAPITALIZED.
</Text>
<Text style={{ textTransform: 'capitalize'}}>
Mixed:{' '}
<Text style={{ textTransform: 'uppercase'}}>
uppercase{' '}
</Text>
<Text style={{ textTransform: 'lowercase'}}>
LoWeRcAsE{' '}
</Text>
<Text style={{ textTransform: 'capitalize'}}>
capitalize each word
</Text>
</Text>
</View>
```
And here is a screenshot of the result:
[Website Documentation PR](https://github.com/facebook/react-native-website/pull/254)
https://github.com/facebook/react-native-website/pull/254
[IOS] [ENHANCEMENT] [Text] - added textTransform style property enabling declarative casing transformations
Closes https://github.com/facebook/react-native/pull/18387
Differential Revision: D7583315
Pulled By: shergin
fbshipit-source-id: a5d22aea2aa4f494b7b25a055abe64799ccbaa79
Summary: Should be more performant theoretically.
Reviewed By: mdvacca
Differential Revision: D7591713
fbshipit-source-id: 74141053f2b91cb621cc0d573f89f3454512c585
Summary:
The new interface of ComponentDescriptor makes ShadowNode creation/cloning process a bit more explicit:
Now customers (UIManager) must prepare Props object explicitly before creation or cloning.
Besides general clarity, we need this to prepare for a new virtual `ShadowNode::clone()` method which will serve "virtual constructor" role,
redirecting execution to concrete ComponentDescriptor instance.
Actually, the whole purpose of concrete ComponentDescriptor instance is serve "virtual constructor" role (and all this code should be "templated").
Reviewed By: mdvacca
Differential Revision: D7591714
fbshipit-source-id: 8793b3ef70ed7ae113efb36ad1eee20573360dc8
Summary:
<!--
Required: Write your motivation here.
If this PR fixes an issue, type "Fixes #issueNumber" to automatically close the issue when the PR is merged.
-->
- This is most likely a merge issue?
- hasTVPreferredFocus was duplicated in the Flow types definition for the Button component, but the PropTypes are fine
<!--
Required: Write your test plan here. If you changed any code, please provide us with
clear instructions on how you verified your changes work. Bonus points for screenshots and videos!
-->
Removing a duplicated prop can't really throw a Flow error. Anyway, I removed the duplicated prop and successfully ran `$ yarn flow`
<!--
Does this PR require a documentation change?
Create a PR at https://github.com/facebook/react-native-website and add a link to it here.
-->
None
<!--
Required.
Help reviewers and the release process by writing your own release notes. See below for an example.
-->
[GENERAL] [ENHANCEMENT] [Button] - Remove duplicate prop definition
<!--
**INTERNAL and MINOR tagged notes will not be included in the next version's final release notes.**
CATEGORY
[----------] TYPE
[ CLI ] [-------------] LOCATION
[ DOCS ] [ BREAKING ] [-------------]
[ GENERAL ] [ BUGFIX ] [ {Component} ]
[ INTERNAL ] [ ENHANCEMENT ] [ {Filename} ]
[ IOS ] [ FEATURE ] [ {Directory} ] |-----------|
[ ANDROID ] [ MINOR ] [ {Framework} ] - | {Message} |
[----------] [-------------] [-------------] |-----------|
EXAMPLES:
[IOS] [BREAKING] [FlatList] - Change a thing that breaks other things
[ANDROID] [BUGFIX] [TextInput] - Did a thing to TextInput
[CLI] [FEATURE] [local-cli/info/info.js] - CLI easier to do things with
[DOCS] [BUGFIX] [GettingStarted.md] - Accidentally a thing/word
[GENERAL] [ENHANCEMENT] [Yoga] - Added new yoga thing/position
[INTERNAL] [FEATURE] [./scripts] - Added thing to script that nobody will see
-->
Closes https://github.com/facebook/react-native/pull/18845
Differential Revision: D7627621
Pulled By: mdvacca
fbshipit-source-id: 924522641a334212f5e2c1310d81da1e321f19b1
Summary: Initial attempt to make fabric stuffs built properly with CocoaPods + RNTesterPods project. This simply includes fabric libs to the build, it doesn't change any behavior or enable fabric runtime.
Reviewed By: shergin
Differential Revision: D7626038
fbshipit-source-id: 4a80e0066cffa4478bb442fa8aefeaee6ff56ddd
Summary:
There was a fix around folly::dynamic constructor that will be needed for Fabric work. This was done in 94e964976c (diff-7d1cb97d222ba0c863ea8a8e43b2ee2b) and luckily the release 1 month after the Folly version we used in RN already had the fix, so that we don't need to upgrade to the latest folly yet (minimizing breakages).
Tested by:
* running RNTester xcode project (ios)
* running RNTesterPods workspace via cocoapods
* building android via gradle
Reviewed By: shergin
Differential Revision: D7626037
fbshipit-source-id: cb36ba5b91ba131d4e450300bd620db657cfa1e8
Summary: Should have been checked in previously. No setup change here.
Reviewed By: shergin
Differential Revision: D7626040
fbshipit-source-id: e7a1a9de70a40a22e39eb3777d1b62c8d7b66381
Summary:
This adds a way to test out CocoaPods build to RNTester, but as a separate project/workspace.
This also fixes the podspecs due to Fabric stuffs.
Note that this setup is meant to be run manually, not by CI (yet)
Reviewed By: mmmulani
Differential Revision: D7603823
fbshipit-source-id: 2219aa4c77f40ec07097a5c9ed4052529226618b
Summary:
On Android, LayoutAnimation directly updates the layout since a generic
scaling animation is more difficult to implement. This causes a problem
if the layout is updated during an animation, as the previous layout is
stored with the animation and is not updated. As a result the view gets
the old layout instead once the animation completes.
This commit fixes this issue by storing the layout handling animations
while those animations are active, and updating the animations on the
fly if one of the views receives a new layout. The resulting behaviour
mirrors what iOS currently does.
This bug has real world consequences, for example if a LayoutAnimation
happens right after a VirtualizedList has mounted, it’s possible that
some list rows are mounted while the animation is active, making the
list content view bigger. If the content view is being animated, the
new size will not take effect and it becomes impossible to scroll to
the end of the list.
I wrote a minimal test case to verify the bug, which I’ve also added to
RNTester. You can find the standalone app here:
<https://gist.github.com/lnikkila/18096c15b2fb99b232795ef59f8fb0cd>
The app creates a 100x300 view that gets animated to 200x300 using
LayoutAnimation. In the middle of that animation, the view’s dimensions
are updated to 300x300.
The expected result (which is currently exhibited by iOS) is that the
view’s dimensions after the animation would be 300x300. On Android the
view keeps the 200x300 dimensions since the animation overrides the
layout update.
The test app could probably be turned into an integration test by
measuring the view through UIManager after the animation, however I
don’t have time to do that right now...
Here are some GIFs to compare, click to expand:
<details>
<summary><b>Current master (iOS vs Android)</b></summary>
<p></p>
<img src="https://user-images.githubusercontent.com/1291143/38191325-f1aeb3d4-3670-11e8-8aca-14e7b24e2946.gif" height="400" /><img src="https://user-images.githubusercontent.com/1291143/38191337-f643fd8c-3670-11e8-9aac-531a32cc0a67.gif" height="400" />
</details><p></p>
<details>
<summary><b>With this patch (iOS vs Android, fixed)</b></summary>
<p></p>
<img src="https://user-images.githubusercontent.com/1291143/38191325-f1aeb3d4-3670-11e8-8aca-14e7b24e2946.gif" height="400" /><img src="https://user-images.githubusercontent.com/1291143/38191355-07f6e972-3671-11e8-8ad2-130d06d0d64d.gif" height="400" />
</details><p></p>
No documentation changes needed.
[ANDROID] [BUGFIX] [LayoutAnimation] - View layout is updated correctly during an ongoing LayoutAnimation, mirroring iOS behaviour.
Closes https://github.com/facebook/react-native/pull/18651
Differential Revision: D7604698
Pulled By: hramos
fbshipit-source-id: 4d114682fd540419b7447e999910e05726f42b39
Summary:
BREAKING CHANGE
This change upgrades the React Native build pipeline from Babel 6 to Babel 7
If you use a `.babelrc` then you'll need to update it to Babel 7 (note that some plugins are no longer relevant, some plugins are automatically upgraded, and some will need some manual love).
Note that you may also need to upgrade your dev env, tests etc, to make sure they work with Babel 7.
Reviewed By: mjesun
Differential Revision: D7591303
fbshipit-source-id: 29cef21f6466633a9c366d1f3c0d3cf874c714db
Summary:
BREAKING CHANGE
This change upgrades the React Native build pipeline from Babel 6 to Babel 7
If you use a `.babelrc` then you'll need to update it to Babel 7 (note that some plugins are no longer relevant, some plugins are automatically upgraded, and some will need some manual love).
Note that you may also need to upgrade your dev env, tests etc, to make sure they work with Babel 7.
Reviewed By: cpojer
Differential Revision: D7097279
fbshipit-source-id: 9fb204cae733174a1c155669b7c17ddb70f7aecc
Summary:
The latest release of react-native (0.55.2) does not expose the new `InputAccessoryView` component; It can't be accessed at all. This change fixes this problem.
* Problem: Snack showing the problem: https://snack.expo.io/B1fDQRYif
* Proof: `RNTester` still works with adapted imports
No related PRs.
[IOS] [BUGFIX] [InputAccessoryView] - Expose `InputAccessoryView` so it can be imported
Closes https://github.com/facebook/react-native/pull/18780
Differential Revision: D7581729
Pulled By: hramos
fbshipit-source-id: d61ab1f167360e829e32b93fb5414d2f7e57e115
Summary:
Apparently, there is no point to return a reference from this method because the struct (std::shared_ptr) is allocated on stack.
The test is also updated.
allow-large-files
Reviewed By: fkgozali
Differential Revision: D7557749
fbshipit-source-id: aa74146322c6d340256752586f05fc672024038e
Summary:
The previous name conflicts with the method with same (but with different semantic) name in `ShadowNode` class.
That was bad idea to use same name especially because the different semantic.
Reviewed By: fkgozali
Differential Revision: D7554549
fbshipit-source-id: 0bccbaacd0812f8a26592b2008f15ddb5bc34ebc
Summary:
`enum class` types do not provide default conversion to integers and reguire use typename before value names.
This must prevent bugs like the previous one where we used `Undefined` as a number value.
Reviewed By: fkgozali
Differential Revision: D7554548
fbshipit-source-id: b19379aae48c9aebe03043e08cf3acc712da3cb8
Summary: `Undefined` is actually equal `0` (becasuse it is `LayoutDirection::Undefined`), whereas `kFloatUndefined` is a magic huge number.
Reviewed By: fkgozali
Differential Revision: D7554550
fbshipit-source-id: 3ea37f0b8b6a59b4b0e00d205b75cd7252247d03
Summary:
Implementation of the native view component of <View>.
Root View also must have dedicated class even if its empty now.
Reviewed By: mdvacca
Differential Revision: D7526406
fbshipit-source-id: 9e14c9f679396c2cdb2d64c99086bb19df37c25c
Summary: Quite obvious. We have to check `sealable` flag of the child (not a parent) before mutating it.
Reviewed By: mdvacca
Differential Revision: D7526407
fbshipit-source-id: ce8e0d6446ff7eb23baee9c92f246d5e198fe377
Summary:
RCTSurfacePresenter coordinates presenting of React Native Surfaces and represents application-facing interface of running React Native core.
SurfacePresenter incapsulates a bridge object inside and discourages direct access to it.
Reviewed By: mdvacca
Differential Revision: D7526413
fbshipit-source-id: 9b6c513ec63a84d8b6c0951458cbd6b47f49669b
Summary:
RCTScheduler represent facebook::react::Scheduler as a Obejctive-C object.
It supposed to be single, unified, bidirectional interop layer between C++ and Obejctive-C worlds.
Reviewed By: mdvacca
Differential Revision: D7526405
fbshipit-source-id: a206755f64f2904981b356a40e7659922b24d7bb
Summary: RCTFabricSurface was reimplemented as separate class which does not rely on (old) RCTUIManager and delegate some functionality (which must be coordinated between Surface instances and Scheduler) to RCTSurfacePresenter.
Reviewed By: mdvacca
Differential Revision: D7526404
fbshipit-source-id: e8c38261bc489fd6066ba29a829cd8f623c26217
Summary:
YogaLayoutableShadowNode::yogaNodeCloneCallbackConnector recently was disabled because of change in Yoga (D7339832).
This diff brings is back.
Reviewed By: mdvacca
Differential Revision: D7526417
fbshipit-source-id: 5369d641bf1e118132cf742d2d243bf426c0ffdb
Summary:
A registry for components. The registry allows to refer to component view instance by react tag.
It also has recycle-pool-like interface (and eventually the pool will be implemented).
Reviewed By: mdvacca
Differential Revision: D7507519
fbshipit-source-id: ed74203fb4d0694490b0dc23aae0aa067b3fc55b
Summary:
MountItem is a small granular light-weight instruction describing a change in the component view tree.
All instruction are supposed to be small and standard. All additional logic must be implemented in component view subclasses.
No more opaque and untyped objcblocks.
All that allows mounting manager to control and optimize an execution of those items (eventually).
Besides that five we probably will need `perform imperative instruction` (for execution something like `scrollTo`) and `update local data` (for updating local state of something like text input).
Reviewed By: mdvacca
Differential Revision: D7507518
fbshipit-source-id: 745b93125231a02cbc152cfa6c6baf423d100f81
Summary:
All methods of RCTComponentViewProtocol are non-optional,
but this default implementation removes necessity to implement all of them manually.
Reviewed By: mdvacca
Differential Revision: D7507522
fbshipit-source-id: e4dff97e8bf64e79d2f1ffca94f0549bd4b5e2fa
Summary: RCTComponentViewProtocol is a protocol for all UIView instances which are managed by React/MountingManager.
Reviewed By: mdvacca
Differential Revision: D7507520
fbshipit-source-id: dcbed8c5d0cc97f72942508aeccb445833ade271
Andrew Chen (Eng)
Leo Nikkilä
David Vacca
Sophie Alpert
TomSwift
Valentin Shergin
Jonathan Kim
Jakub Grzmiel
Patrice Vignola
Kevin Gozali
Himabindu Gadupudi
Peter van der Zee
Aaron Brager
Sebastian Markbage
Rafael Oleza
Matt Mahoney
Manuel Alabor
David Aurelio
