Set scroll view throttle by default

Summary: Setting the scroll throttle for every animated scrollview is a pain, and if you forget it's super janky and can be confusing and frustrating. Enables setting default props in createAnimatedComponent and uses it for scrollview. Reviewed By: TheSavior Differential Revision: D14790093 fbshipit-source-id: dd8f6f6540813245e87d696351f09ebb2e6ed5f2
facebook · Apr 5, 2019 · b8c8562 · b8c8562
1 parent 929087b
commit b8c8562
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 10 deletions.
diff --git a/Libraries/Animated/src/__tests__/AnimatedMock-test.js b/Libraries/Animated/src/__tests__/AnimatedMock-test.js
@@ -19,11 +19,34 @@ describe('Animated Mock', () => {
       Object.keys(AnimatedImplementation),
     );
   });
-  it('matches implementation params', () => {
-    Object.keys(AnimatedImplementation).forEach(key =>
-      expect(AnimatedImplementation[key].length).toEqual(
-        AnimatedMock[key].length,
-      ),
-    );
+  it('matches implementation params', done => {
+    Object.keys(AnimatedImplementation).forEach(key => {
+      if (AnimatedImplementation[key].length !== AnimatedMock[key].length) {
+        done(
+          new Error(
+            'key ' +
+              key +
+              ' had different lengths: ' +
+              JSON.stringify(
+                {
+                  impl: {
+                    len: AnimatedImplementation[key].length,
+                    type: typeof AnimatedImplementation[key],
+                    val: AnimatedImplementation[key].toString(),
+                  },
+                  mock: {
+                    len: AnimatedMock[key].length,
+                    type: typeof AnimatedMock[key],
+                    val: AnimatedMock[key].toString(),
+                  },
+                },
+                null,
+                2,
+              ),
+          ),
+        );
+      }
+    });
+    done();
   });
 });
diff --git a/Libraries/Animated/src/components/AnimatedScrollView.js b/Libraries/Animated/src/components/AnimatedScrollView.js
@@ -14,4 +14,4 @@ const ScrollView = require('ScrollView');
 
 const createAnimatedComponent = require('createAnimatedComponent');
 
-module.exports = createAnimatedComponent(ScrollView);
+module.exports = createAnimatedComponent(ScrollView, {scrollEventThrottle: 16});
diff --git a/Libraries/Animated/src/createAnimatedComponent.js b/Libraries/Animated/src/createAnimatedComponent.js
@@ -16,7 +16,7 @@ const DeprecatedViewStylePropTypes = require('DeprecatedViewStylePropTypes');
 
 const invariant = require('invariant');
 
-function createAnimatedComponent(Component: any): any {
+function createAnimatedComponent(Component: any, defaultProps: any): any {
   invariant(
     typeof Component !== 'function' ||
       (Component.prototype && Component.prototype.isReactComponent),
@@ -149,6 +149,7 @@ function createAnimatedComponent(Component: any): any {
       const props = this._propsAnimated.__getValue();
       return (
         <Component
+          {...defaultProps}
           {...props}
           ref={this._setComponentRef}
           // The native driver updates views directly through the UI thread so we

diff --git a/jest/setup.js b/jest/setup.js
@@ -45,8 +45,11 @@ jest
   .mock('AnimatedImplementation', () => {
     const AnimatedImplementation = jest.requireActual('AnimatedImplementation');
     const oldCreate = AnimatedImplementation.createAnimatedComponent;
-    AnimatedImplementation.createAnimatedComponent = function(Component) {
-      const Wrapped = oldCreate(Component);
+    AnimatedImplementation.createAnimatedComponent = function(
+      Component,
+      defaultProps,
+    ) {
+      const Wrapped = oldCreate(Component, defaultProps);
       Wrapped.__skipSetNativeProps_FOR_TESTS_ONLY = true;
       return Wrapped;
     };