add tests

.gitignore

@@ -6,4 +6,5 @@ node_modules
 .rts2_cache_esm
 .rts2_cache_umd
 dist
-todo.txt
+todo.txt
+coverage

example/App.tsx

@@ -35,7 +35,7 @@ const App = () => {
       <View
         style={{flex: 1, backgroundColor: 'white', justifyContent: 'center'}}>
         <PagerProvider activeIndex={activeIndex} onChange={onChange}>
-          <MyPager />
+          <KilterCards />
         </PagerProvider>
       </View>
     </SafeAreaView>

src/pager.tsx

@@ -273,8 +273,8 @@ function Pager({
 
   // set the initial position - priority to direct prop over context, and context over uncontrolled
   const _position = memoize(new Value(activeIndex));
-  const position = isControlled
-    ? animatedValue || _position
+  const position = animatedValue
+    ? animatedValue
     : context
     ? context[2]
     : _position;
@@ -456,8 +456,7 @@ function Pager({
                           </FocusProvider>
                         </IndexProvider>
                       );
-                    })}{' '}
-                }
+                    })}
               </Animated.View>
             </Animated.View>
           </Animated.View>

test/pager.test.tsx

@@ -1,15 +1,124 @@
 import React from 'react';
-import { render } from './test-utils';
-import { Pager } from '../src';
-import { Text } from 'react-native';
+import { render, fireEvent } from './test-utils';
+import { Pager, iPager, PagerProvider, usePager } from '../src';
+import { Text, Button } from 'react-native';
 
-test('render()', () => {
-  const { debug } = render(
-    <Pager style={{ width: 200, height: 200 }}>
+function TestPager(props: iPager) {
+  // style prop will render children without waiting for layout events
+  return <Pager {...props} style={{ width: 100, height: 100 }} />;
+}
+
+test('render() works', () => {
+  render(
+    <TestPager>
       <Text>1</Text>
       <Text>2</Text>
-    </Pager>
+    </TestPager>
   );
+});
+
+test('activeIndex and onChange props update pager', () => {
+  function Container({ spy }) {
+    const [activeIndex, onChange] = React.useState(0);
+
+    function handleChange(nextIndex: number) {
+      spy(nextIndex);
+      onChange(nextIndex);
+    }
+
+    return (
+      <TestPager activeIndex={activeIndex} onChange={onChange}>
+        <Text>Active Index: {activeIndex}</Text>
+        <Button
+          title={'change'}
+          onPress={() => handleChange(activeIndex + 1)}
+        />
+      </TestPager>
+    );
+  }
+
+  const spy = jest.fn();
+  const { getByText } = render(<Container spy={spy} />);
 
-  debug();
+  fireEvent.press(getByText(/change/i));
+  getByText('Active Index: 1');
+  expect(spy).toHaveBeenCalledTimes(1);
+  expect(spy).toHaveBeenCalledWith(1);
+
+  fireEvent.press(getByText(/change/i));
+  getByText('Active Index: 2');
 });
+
+test('provider injects props into pager', () => {
+  function Provider({ spy }) {
+    const [activeIndex, onChange] = React.useState(0);
+
+    function handleChange(nextIndex: number) {
+      spy(nextIndex);
+      onChange(nextIndex);
+    }
+
+    return (
+      <PagerProvider activeIndex={activeIndex} onChange={handleChange}>
+        {({ onChange }) => (
+          <TestPager>
+            <Text>Active Index: {activeIndex}</Text>
+            <Button
+              title={'change'}
+              onPress={() => onChange(activeIndex + 1)}
+            />
+          </TestPager>
+        )}
+      </PagerProvider>
+    );
+  }
+
+  const spy = jest.fn();
+  const { getByText } = render(<Provider spy={spy} />);
+
+  fireEvent.press(getByText(/change/i));
+  getByText('Active Index: 1');
+  expect(spy).toHaveBeenCalledTimes(1);
+  expect(spy).toHaveBeenCalledWith(1);
+
+  fireEvent.press(getByText(/change/i));
+  getByText('Active Index: 2');
+});
+
+test('consumers of provider are able to update pager', () => {
+  function Consumer() {
+    const [activeIndex, onChange] = usePager();
+    return <Button title="change" onPress={() => onChange(activeIndex + 1)} />;
+  }
+
+  function Provider({ spy }) {
+    const [activeIndex, onChange] = React.useState(0);
+
+    function handleChange(nextIndex: number) {
+      spy(nextIndex);
+      onChange(nextIndex);
+    }
+
+    return (
+      <PagerProvider activeIndex={activeIndex} onChange={handleChange}>
+        <TestPager>
+          <Text>Active Index: {activeIndex}</Text>
+          <Consumer />
+        </TestPager>
+      </PagerProvider>
+    );
+  }
+
+  const spy = jest.fn();
+  const { getByText } = render(<Provider spy={spy} />);
+
+  fireEvent.press(getByText(/change/i));
+  getByText('Active Index: 1');
+  expect(spy).toHaveBeenCalledTimes(1);
+  expect(spy).toHaveBeenCalledWith(1);
+
+  fireEvent.press(getByText(/change/i));
+  getByText('Active Index: 2');
+});
+
+test.todo('consumers are able to use animatedIndex');