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:
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:
We are rolling out exact-by-default syntax to xplat/js.
I had to manually move around some comments to preserve proper placement.
Changelog: [Internal]
Reviewed By: jbrown215
Differential Revision: D18633611
fbshipit-source-id: 48f7468dcc55b1d00985419d035a61c6820b3abe
Summary:
We found that many callsites existed that could be using the native driver, but weren't. In order to help people use it when appropriate and eventually switch the default, we are requiring that useNativeDriver is explicit, even when set to false.
This change adds a runtime warning if useNativeDriver is not specified, hopefully giving some light feedback to remember to use the native driver when you can. Without it being explicit it is very easy to forget setting this.
Reviewed By: JoshuaGross
Differential Revision: D17575918
fbshipit-source-id: e54612d87177e1821692b7de20fe673df0e890d2
Summary:
It doesn't work super smoothly, but I don't think we should hide it. The ultimate goal is to get it working well in Fabric.
Changelog:
[Internal]
Reviewed By: shergin
Differential Revision: D17201209
fbshipit-source-id: 2d2f447e10173462d98ff01ed58f3cb94da77513
Summary:
In order to cleanup the callsites that are not using Animated's native driver, we are going to make useNativeDriver a required option so people have to think about whether they want the native driver or not.
I made this change by changing [Animated.js](https://fburl.com/ritcebri) to have this animation config type:
```
export type AnimationConfig = {
isInteraction?: boolean,
useNativeDriver: true,
onComplete?: ?EndCallback,
iterations?: number,
};
```
This causes Flow to error anywhere where useNativeDriver isn't set or where it is set to false.
I then used these Flow errors to codemod the callsites.
I got the location of the Flow errors by running:
```
flow status --strip-root --json --message-width=0 | jq '.errors | [.[].extra | .[].message | .[].loc | objects | {source: .source, start: .start, end: .end}]'
```
And then ran this codemod:
```
const json = JSON.parse('JSON RESULT FROM FLOW');
const fileLookup = new Map();
json.forEach(item => {
if (!fileLookup.has(item.source)) {
fileLookup.set(item.source, []);
}
fileLookup.get(item.source).push(item);
});
export default function transformer(file, api) {
const j = api.jscodeshift;
const filePath = file.path;
if (!fileLookup.has(filePath)) {
return;
}
const locationInfo = fileLookup.get(filePath);
return j(file.source)
.find(j.ObjectExpression)
.forEach(path => {
if (
path.node.properties.some(
property =>
property != null &&
property.key != null &&
property.key.name === 'useNativeDriver',
)
) {
return;
}
const hasErrorOnLine = locationInfo.some(
singleLocationInfo =>
singleLocationInfo.start.line === path.node.loc.start.line &&
Math.abs(
singleLocationInfo.start.column - path.node.loc.start.column,
) <= 2,
);
if (!hasErrorOnLine) {
return;
}
path.node.properties.push(
j.property(
'init',
j.identifier('useNativeDriver'),
j.booleanLiteral(false),
),
);
})
.toSource();
}
export const parser = 'flow';
```
```
yarn jscodeshift --parser=flow --transform addUseNativeDriver.js RKJSModules react-native-github
```
Followed up with
```
hg status -n --change . | xargs js1 prettier
```
Reviewed By: mdvacca
Differential Revision: D16611291
fbshipit-source-id: 1157587416ec7603d1a59e1fad6a821f1f57b952
Summary:
Changes RNTester, first attempt in the direction of improving the RNTester overall. Related ticket: #24647
Changed the `js` directory of the RNTester to have the following structure:
```
- js
- assets
- components
- examples
- types
- utils
```
* **assets**
_Any images, gifs, and media content_
* **components**
_All shared components_
* **examples**
_Example View/Components to be rendered by the App_
* **types**
_Shared flow types_
* **utils**
_Shared utilities_
## Changelog
[General] [Changed] - Update folder structure of RNTester's JS directory.
Pull Request resolved: https://github.com/facebook/react-native/pull/25013
Differential Revision: D15515773
Pulled By: cpojer
fbshipit-source-id: 0e4b6386127f338dca0ffe8c237073be53a9e221