Summary:
ES Modules implicitly enable strict mode. Adding the "use strict" directive is, therefore, not required.
This diff removes all "use strict" directives from ES modules.
Changelog:
[Internal]
Reviewed By: motiz88
Differential Revision: D26172715
fbshipit-source-id: 57957bcbb672c4c3e62b1db633cf425c1c9d6430
Summary:
This change contains the suppressions for the up coming v0.142.0 Flow release.
The new suppressions are a result the following changes:
* Disallow flowing functions or inexact objects to indexed objects to improve object soundness. This can cause errors if you are passing a function or inexact objects when an indexed object is expected.
* Flow now processes imports before checking the body of a file. In some rare cases this can expose previously skipped errors due to the processing order.
Reviewed By: mroch
Differential Revision: D25820434
fbshipit-source-id: 59cc1d852ffc8cc39f0d5112ce485fb33f05c092
Summary:
The `isFabric` method used in createAnimatedComponent is unreliable (another reason in a long list of reasons why you should not duplicate this code elsewhere, and why we want to delete it ASAP).
In particular, during the first render, the ref component has not been set yet, so we /cannot/ detect if the component is Fabric or non-Fabric and assume it's non-Fabric.
In Fabric, this causes `collapsable` and `nativeID` values to change after the first render.
To reduce this re-rendering, but not eliminate it for all components, I've introduced a flag that indicates if a component will /never/ be flattened. In particular, Image components, ScrollViews, Text cannot ever be flattened,
so we should always pass `collapsable:false` and the same nativeID prop for those components. For Animated <View>s and other components, the re-rendering issue is still a problem in Fabric for now.
Changelog: [Internal]
Reviewed By: mdvacca
Differential Revision: D25720322
fbshipit-source-id: fe3234d8ae974911a2b5f82e4f6a093216f43d4b
Summary:
In D24521951 (2ff1d4c041) I refactored the JS-side queueing for NativeAnimated API calls, and used randomized IDs for queueing. This could cause bugs or unexpected behavior, and potentially crashes, if there's ever a collision in random numbers generated or
a collision between random number and one of the deterministic numbers generated in createAnimatedComponent.
In this diff I make both of them namespaced with a string, and deterministic, to eliminate any potential collisions. This could also be slightly faster (but not meaningfully) since we're not relying on Math.random.
Changelog: [Internal]
Reviewed By: yungsters
Differential Revision: D24553557
fbshipit-source-id: 8b765e21597ad4f8e641453c1f9f90bdf1ee022f
Summary:
This small PR fixes few "no-unused-var" issues and and removes two old entries for no longer existing files from the `.eslintignore`.
## Changelog
[Internal] [Fixed] - Lint: fix few "no-unused-var" warnings for imports
Pull Request resolved: https://github.com/facebook/react-native/pull/30157
Test Plan: Successfully run of `yarn lint` script. Warnings count has been reduced from `61` to `58`.
Reviewed By: yungsters
Differential Revision: D24288226
Pulled By: appden
fbshipit-source-id: 06e4ef015a331e3f2eac3b9aa6f757a3764e3ed9
Summary:
There's no reason for us to have lint ignores for `react-native/codegen/react-native-modules`. This diff removes all such ignores. I'll address any actual problems with the specs in subsequent diffs.
Changelog: [Internal]
Reviewed By: fkgozali
Differential Revision: D24529238
fbshipit-source-id: bbd2f4fb5dace65d803a8f93bd0d9a1c5a1cfb34
Summary:
I believe the old method of queueing these operations for Fabric is causing crashes because "connectNode" is on a separate JS queue from setting up nodes.
In hindsight, this seems silly. We must ensure that nodes are created before they're connected, and we weren't doing that?
Using a single queue is conceptually simpler, should be easier to reason about, and should fix some crashes.
Changelog: [Internal]
Reviewed By: fkgozali
Differential Revision: D24521951
fbshipit-source-id: f6c38ac0023faa28414063d8b96daf32ba95524d
Summary:
Same as D20969087 (be78673755) but a bit more sophisticated.
We currently see a lot of errors happens because of division by zero in AnimatedDivision module. We already have a check for that in the module but it happens during the animation tick where the context of execution is already lost and it's hard to find why exactly it happens.
Adding an additional check to the constructor should trigger an error right inside render function which should make the error actionable.
Changelog: [Internal] Fabric-specific internal change.
Reviewed By: fkgozali
Differential Revision: D23908993
fbshipit-source-id: d21be9a72ec04fe4ff0740777d9ff49cf1bcde73
Summary:
Open source this ESLint rule so that we can lint our open source NativeModule specs.
Changelog: [Internal]
Reviewed By: shergin, cpojer
Differential Revision: D23791748
fbshipit-source-id: e44444bc87eaa9dc9b7f2b3ed03151798a35e8a5
Summary:
We disabled animations on Android because native driver animations weren't working yet. After recent changes in NativeAnimatedModule, animations are now working as expected. This diff re-enables animations for bridgeless mode on Android.
Changelog: [Internal]
Reviewed By: mdvacca
Differential Revision: D22605612
fbshipit-source-id: 7a7078bf23bb88e7745fc899e1a5ff551425dbad
Summary:
Deletes `Animated/polyfills` which is no longer necessary (and only creates extra configuration burden).
Changelog:
[Internal]
Reviewed By: cpojer
Differential Revision: D22451963
fbshipit-source-id: 7a9a48b96b3783f2f6340226bdafd2eaa43f32e7
Summary:
Removes the legacy `react-animated` package configuration and collapses the `Animated/src/` directory into `Animated/`.
Also, reconfigures all references to `Animated/src/` to just be `Animated/`.
Changelog:
[Internal]
Reviewed By: cpojer
Differential Revision: D22450848
fbshipit-source-id: 9fd4861e9f357d817d82e9fec71967a2936a3830
Summary:
This is the JS side of D23010844 (73242b45a9).
In the past I tried a few heuristics to guess when a batch of Animated Operations were ready, and none of these were super reliable. But it turns out we can safely allow JS to manage that explicitly.
Non-Fabric still uses the old behavior which seems fine.
Changelog: [Internal]
Reviewed By: mdvacca
Differential Revision: D23010937
fbshipit-source-id: 4a513672c166ceaa8b6daa387e46a2a95b60ce53
Summary:
In D22801173 (9e6ba9ddb8) I introduced a mechanism to queue Animated operations on the JS side until all mounting effects were finished. I also added an unnecessary check that the NativeAnimated module is loaded, and it seems like if it's called too early, before the NM is initialized, it will crash.
It's not necessary in these two methods, so we just delete the invariant check.
Changelog: [Internal]
Reviewed By: lunaleaps
Differential Revision: D23040331
fbshipit-source-id: e70ec887695b9abefa0f01408a4a1c2749946d1c
Summary:
In the past I tried a few heuristics to guess when a batch of Animated Operations were ready, and none of these were super reliable. But it turns out we can safely allow JS to manage that explicitly.
Non-Fabric still uses the old behavior which seems fine.
Changelog: [Internal]
Reviewed By: mdvacca
Differential Revision: D23010844
fbshipit-source-id: 4c688d3a61460118557a4971e549ec7457f3eb8f
Summary:
Unfortunately, the new codegen doesn't allow us to import types from other files. Therefore, I've inlined the interface specification of NativeAnimatedModule into NativeAnimatedTurboModule.
Changelog: [Internal]
Reviewed By: JoshuaGross
Differential Revision: D22858790
fbshipit-source-id: 759bb960240afaba6b70c2730c3359b7e8c46c83
Summary:
In Fabric, there are two subtle differences in Animated:
1) On the native side, queued NativeAnimated operations are executed more frequently
2) On the JS side there seems to be a bigger gap between AnimatedNodes being set up, and the final `componentDidMount`/`componentDidUpdate` that results in `_attachNativeEvents` being called.
This results in some visual glitching for certain features like StickyScrollViewHeader and other animations that are frequently rerendered. Rerendering an animated component relies on sync-like behavior
(new animations must be set up in the same frame that old animations are torn down, and the UI must flush any updates in the same frame). This sync-like behavior is trickier to achieve in Fabric, so
we introduce this mechanism, in Fabric only, to queued operations more aggressively on the JS side and only flush them when `componentDidMount`/`componentDidUpdate` have been called on all relevant nodes.
This seems to resolve longstanding issues with animations in Fabric on Android.
There are unrelated issues on iOS that make this difficult to test currently, so I'll keep the new path Android-only for now.
Changelog: [Internal]
Reviewed By: sammy-SC
Differential Revision: D22801173
fbshipit-source-id: 3db2235483636c9074df941cfac0a30f3f97545a
Summary:
The Animated native module cannot be converted to a TM because it has perf regressions when used in conjunction with Paper renderer. Instead of fixing these complicated perf issues (which will disappear when Fabric ships this half), temporarily fork the native module. The new fork is converted to a TM, and only used to unblock bridgeless mode testing.
Changelog:[Internal]
Reviewed By: RSNara
Differential Revision: D22651010
fbshipit-source-id: 912123ef38ac8c66025b7bba34a65ec6d98f330d
Summary:
This appears to be the only usage of whitelist/blacklist in react-native-github, let's use some more inclusive language.
Changelog: [JS][Internal]
Reviewed By: kacieb
Differential Revision: D22539431
fbshipit-source-id: 21d4cd54a5a2a676996ccec7b02ef15c421efee1
Summary:
After animation has been finished using Native driver there is no final value passed from the native to JS side. This causes a bug from https://github.com/facebook/react-native/issues/28114.
This PR solves this problem in the same way as `react-native-reanimated` library. When detaching it is calling native side to get the last value from Animated node and stores it on the JS side.
Preserving animated value even if animation was using `useNativeDriver: true`
Fixes https://github.com/facebook/react-native/issues/28114
## Changelog
<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://github.com/facebook/react-native/wiki/Changelog
-->
[Internal] [Fixed] - Save native Animated node value on JS side in detach phase
Pull Request resolved: https://github.com/facebook/react-native/pull/28841
Test Plan: Unit tests for added getValue method passed. Green CI
Reviewed By: mdvacca
Differential Revision: D22211499
Pulled By: JoshuaGross
fbshipit-source-id: 9a3a98a9f9a8536fe2c8764f667cdabe1f6ba82a
Summary:
Fabric will crash if Inf/NaN values are passed to the native side, so just pass zero to native in those cases. It's an equally (in)valid value and we're already logging the error.
Also, debounce the error so we don't spam the LogBox/console.
This should potentially be changed to a warning.
Changelog: [Internal]
Reviewed By: mdvacca
Differential Revision: D22008980
fbshipit-source-id: 1aef33a13febed04311557718f05ef79bbbcca93
Summary:
In Fabric, some uses of the ScrollViewStickyHeader don't work after scrolling because even though the UI correctly reflects the translateY that the StickyHeader should be at, the underlying C++ Fabric ShadowTree doesn't have the updated parameters.
1. We add a mechanism to pass static props through to animated nodes; these get passed to the platform through the normal commit-diff process. This is to allow passing props to the platform that are also controlled by the animation. This mechanism could be reused elsewhere.
2. In ScrollViewStickyHeader, listen to updates for the translateY value and pass them to the platform when it stops changing - for Fabric only. This noops for non-Fabric since it's not necessary.
Changelog: [Internal]
Reviewed By: mdvacca
Differential Revision: D21948830
fbshipit-source-id: b203ecde466732203dd12a86e2339e81f66b27e7
Summary: We don't yet have native driver support for animations in bridgeless mode on Android, which leads to some weird bugs (like an overlay that never disappears). Let's just disable animations on Android again.
Reviewed By: mdvacca
Differential Revision: D21537982
fbshipit-source-id: b4e8882a414fecbd52dd25e02325b5c588ee68c0
Summary:
This diff extends venice app to render an Animation example test
changelog: [Internal][Android] Internal change to enable Animated in RN Bridgless mode
Reviewed By: PeteTheHeat
Differential Revision: D21317630
fbshipit-source-id: 9726fea9baba86191e63df909639d1d47ef5f359
Summary:
We currently see a lot of errors happens because of division by zero in `AnimatedDivision` module. We already have a check for that in the module but it happens during the animation tick where the context of execution is already lost and it's hard to find why exactly it happens.
Adding an additional check to the constructor should trigger an error right inside render function which should make the error actionable.
Changelog: [Internal] Early crash in AnimatedDivision in case of division by zero.
Reviewed By: mdvacca
Differential Revision: D20969087
fbshipit-source-id: 0d98774b79be2cc56d468a4f56d2d7c8abf58344
Summary:
This gets us on the latest Prettier 2.x:
https://prettier.io/blog/2020/03/21/2.0.0.html
Notably, this adds support for TypeScript 3.8,
which introduces new syntax, such as `import type`.
Reviewed By: zertosh
Differential Revision: D20636268
fbshipit-source-id: fca5833d003804333a05ba16325bbbe0e06d6c8a
Summary:
Changelog: [Internal]
Add one more error around AnimatedValue.js returning an undefined value for "value" property.
Since this error happens in construction of the animated node, it makes sense that the constructor could be passed an undefined value?
Reviewed By: zackargyle
Differential Revision: D20354532
fbshipit-source-id: ba35172cd91977c48c849a2b1e27596c4dd8b4d4
Summary:
This Pull Request implements the PlatformColor proposal discussed at https://github.com/react-native-community/discussions-and-proposals/issues/126. The changes include implementations for iOS and Android as well as a PlatformColorExample page in RNTester.
Every native platform has the concept of system defined colors. Instead of specifying a concrete color value the app developer can choose a system color that varies in appearance depending on a system theme settings such Light or Dark mode, accessibility settings such as a High Contrast mode, and even its context within the app such as the traits of a containing view or window.
The proposal is to add true platform color support to react-native by extending the Flow type `ColorValue` with platform specific color type information for each platform and to provide a convenience function, `PlatformColor()`, for instantiating platform specific ColorValue objects.
`PlatformColor(name [, name ...])` where `name` is a system color name on a given platform. If `name` does not resolve to a color for any reason, the next `name` in the argument list will be resolved and so on. If none of the names resolve, a RedBox error occurs. This allows a latest platform color to be used, but if running on an older platform it will fallback to a previous version.
The function returns a `ColorValue`.
On iOS the values of `name` is one of the iOS [UI Element](https://developer.apple.com/documentation/uikit/uicolor/ui_element_colors) or [Standard Color](https://developer.apple.com/documentation/uikit/uicolor/standard_colors) names such as `labelColor` or `systemFillColor`.
On Android the `name` values are the same [app resource](https://developer.android.com/guide/topics/resources/providing-resources) path strings that can be expressed in XML:
XML Resource:
`@ [<package_name>:]<resource_type>/<resource_name>`
Style reference from current theme:
`?[<package_name>:][<resource_type>/]<resource_name>`
For example:
- `?android:colorError`
- `?android:attr/colorError`
- `?attr/colorPrimary`
- `?colorPrimaryDark`
- `android:color/holo_purple`
- `color/catalyst_redbox_background`
On iOS another type of system dynamic color can be created using the `IOSDynamicColor({dark: <color>, light:<color>})` method. The arguments are a tuple containing custom colors for light and dark themes. Such dynamic colors are useful for branding colors or other app specific colors that still respond automatically to system setting changes.
Example: `<View style={{ backgroundColor: IOSDynamicColor({light: 'black', dark: 'white'}) }}/>`
Other platforms could create platform specific functions similar to `IOSDynamicColor` per the needs of those platforms. For example, macOS has a similar dynamic color type that could be implemented via a `MacDynamicColor`. On Windows custom brushes that tint or otherwise modify a system brush could be created using a platform specific method.
## Changelog
[General] [Added] - Added PlatformColor implementations for iOS and Android
Pull Request resolved: https://github.com/facebook/react-native/pull/27908
Test Plan:
The changes have been tested using the RNTester test app for iOS and Android. On iOS a set of XCTestCase's were added to the Unit Tests.
<img width="924" alt="PlatformColor-ios-android" src="https://user-images.githubusercontent.com/30053638/73472497-ff183a80-433f-11ea-90d8-2b04338bbe79.png">
In addition `PlatformColor` support has been added to other out-of-tree platforms such as macOS and Windows has been implemented using these changes:
react-native for macOS branch: https://github.com/microsoft/react-native/compare/master...tom-un:tomun/platformcolors
react-native for Windows branch: https://github.com/microsoft/react-native-windows/compare/master...tom-un:tomun/platformcolors
iOS
|Light|Dark|
|{F229354502}|{F229354515}|
Android
|Light|Dark|
|{F230114392}|{F230114490}|
{F230122700}
Reviewed By: hramos
Differential Revision: D19837753
Pulled By: TheSavior
fbshipit-source-id: 82ca70d40802f3b24591bfd4b94b61f3c38ba829
Summary:
Changelog: [Internal] Throw error when setting Animated value to undefined.
Background:
ReadableNativeMap removes keys that have undefined values. Somewhere some animation is setting the value to be undefined.
Follow up: Find a way to warn generally that undefined values are being set for maps that become ReadableNativeMaps
Reviewed By: JoshuaGross
Differential Revision: D20169325
fbshipit-source-id: 404b727dc238703ebe5f71a0939340d5f1b3b211
Summary:
We will soon be enforcing that flow suppressions will only apply when on an error's primary location ([post](https://fb.workplace.com/groups/179614562644215/permalink/559286354677032/)). This diff uses the codemod created in D20008770 to move all suppression comments to their primary locations in the `xplat/js` flow root, and deletes suppression comments that are not on any primary locations.
This diff was generated with:
```
~/fbsource/fbcode/flow/packages/flow-dev-tools/bin/tool suppression-primary-locations --json-file ~/www/errors.json ~/fbsource/xplat/js
hg st -n | xargs grep -l -P '@(partially-)?generated' | xargs hg revert
hg st -n | xargs grep -l 'format' | xargs prettier --write
```
Changelog: [Internal]
bypass-lint
Reviewed By: dsainati1
Differential Revision: D20122544
fbshipit-source-id: d94e409aadb18bb399a1ddbf9f3f2494fe4fb54c
Summary:
We recently updated React Native's docs site to have its own domain reactnative.dev and needed to update the URLs in the source code
CHANGELOG:
[INTERNAL]
Reviewed By: hramos
Differential Revision: D20072842
fbshipit-source-id: 1970d9214c872a6e7abf697d99f8f5360b3b308e
Summary:
As we don't link modules manually anymore it's better to point the user in another direction when they face this issue.
## Changelog
[Internal] [Changed] - tweak missing RCTAnimation warning message
Pull Request resolved: https://github.com/facebook/react-native/pull/28139
Reviewed By: cpojer
Differential Revision: D20009264
Pulled By: hramos
fbshipit-source-id: 114cae4fe908186eab3d8d9e79c2016015406821
Summary:
List components aren't host components so checking if the direct component itself's internals isn't sufficient to know if we are in Fabric. For lists, we have to call through some helper functions to get to the host component.
Hopefully we will fix this in the future by making the lists use forwardRef, or by getting rid of the JS Driver altogether, but for now, this is fine (TM).
Changelog: Internal
Reviewed By: mdvacca
Differential Revision: D19731067
fbshipit-source-id: 0e73583c6bf7c10de30e668a390d29718d31b295
Summary:
Bridgeless mode requires all native modules to be turbomodules. The iOS animated module was converted to TM, but reverted due to perf issues. RSNara is looking into it, but it may be an involved fix. As a short term workaround, to unblock release mode testing of bridgeless mode, use `AnimatedMock`.
Changelog: [Internal] Disable animations in bridgeless mode
Reviewed By: RSNara
Differential Revision: D19729827
fbshipit-source-id: e6c4d89258ec23da252c047b4c67c171f7f21c25
Summary:
Noticed the _validateMapping call right now is a no-op, as the traverse method is never invoked. We can only really do validation once we've received a sample of an event, and can then verify the values being extracted indeed correspond with a valid key.
Changelog: [General] [Fixed] - Fix validation of event mappings for AnimatedEvent
Reviewed By: cpojer
Differential Revision: D19498971
fbshipit-source-id: e978dda895498a7e567d5e18b3181b319d88d95c
Micha Reiser
Pieter Vanderwerff
Joshua Gross
simek
Ramanpreet Nara
Valentin Shergin
Samuel Susla
Emily Janzer
Tim Yung
Peter Argany
TMaszko
Christoph Nakazawa
Yuanzhe Bian
David Vacca
George Zahariev
Michael Bolin
Luna Wei
Daniel Sainati
Tom Underhill
Pieter De Baets
Hans Halverson
Rachel Nabors
Radek Czemerys
Eli White
Mackenzie Mance
Poyan Nabati
