Merge fb336ca into de32e2f

calintamas · Feb 14, 2021 · 10f628d · 10f628d
2 parents de32e2f + fb336ca
commit 10f628d
Showing 1 changed file with 159 additions and 79 deletions.
diff --git a/src/__tests__/Toast.test.js b/src/__tests__/Toast.test.js
@@ -2,21 +2,16 @@
 
 import { act, fireEvent, render, waitFor } from '@testing-library/react-native';
 import React from 'react';
+import { View } from 'react-native';
 
 import Toast from '..';
 import colors from '../colors';
 
-const FRAME_TIME = 10;
-
-global.requestAnimationFrame = (cb) => {
-  setTimeout(cb, FRAME_TIME);
-};
-
 function setup(props) {
   const ref = {
     current: undefined
   };
-  const utils = render(<Toast ref={ref} {...props} />);
+  const utils = render(<Toast ref={ref} autoHide={false} {...props} />);
   const getAnimatedView = () => utils.queryByTestId('animatedView');
   const getText1 = () => utils.queryByTestId('text1');
   const getText2 = () => utils.queryByTestId('text2');
@@ -37,115 +32,200 @@ function getVerticalOffset(reactElement) {
 }
 
 describe('test Toast behavior', () => {
-  it('becomes visible when show() is called, hides when hide() is called', async () => {
-    const { ref, getText1, getText2, getAnimatedView } = setup();
-    let animatedView = getAnimatedView();
-
-    expect(getText1()).toBeFalsy();
-    // Toast View is pushed off screen, on the Y axis
-    expect(getVerticalOffset(animatedView) < 0).toBe(true);
+  describe('test API', () => {
+    it('becomes visible when show() is called, hides when hide() is called', async () => {
+      const { ref, getText1, getText2, getAnimatedView } = setup();
+      let animatedView = getAnimatedView();
+
+      expect(getText1()).toBeFalsy();
+      // Toast View is pushed off screen, on the Y axis
+      expect(getVerticalOffset(animatedView) < 0).toBe(true);
+
+      await act(async () => {
+        await ref.current.show({
+          text1: 'Hello',
+          text2: 'Test'
+        });
+      });
+      await waitFor(() => getText1());
+      await waitFor(() => getText2());
+      animatedView = getAnimatedView();
+      expect(getVerticalOffset(animatedView) < 0).toBe(false);
 
-    await act(async () => {
-      await ref.current.show({
-        text1: 'Hello',
-        text2: 'Test'
+      await act(async () => {
+        await ref.current.hide();
       });
+      animatedView = getAnimatedView();
+      expect(getVerticalOffset(animatedView) < 0).toBe(true);
     });
-    await waitFor(() => getText1());
-    await waitFor(() => getText2());
-    animatedView = getAnimatedView();
-    expect(getVerticalOffset(animatedView) < 0).toBe(false);
 
-    await act(async () => {
-      await ref.current.hide();
-    });
-    animatedView = getAnimatedView();
-    expect(getVerticalOffset(animatedView) < 0).toBe(true);
-  });
+    it('shows success type', async () => {
+      const { ref, getRootView } = setup();
 
-  it('shows success type', async () => {
-    const { ref, getRootView } = setup();
+      await act(async () => {
+        await ref.current.show({
+          type: 'success'
+        });
+      });
 
-    await act(async () => {
-      await ref.current.show({
-        type: 'success'
+      expect(getRootView()).toHaveStyle({
+        borderLeftColor: colors.mantis
       });
     });
 
-    expect(getRootView()).toHaveStyle({
-      borderLeftColor: colors.mantis
+    it('shows info type', async () => {
+      const { ref, getRootView } = setup();
+
+      await act(async () => {
+        await ref.current.show({
+          type: 'info'
+        });
+      });
+
+      expect(getRootView()).toHaveStyle({
+        borderLeftColor: colors.lightSkyBlue
+      });
     });
-  });
 
-  it('shows info type', async () => {
-    const { ref, getRootView } = setup();
+    it('shows error type', async () => {
+      const { ref, getRootView } = setup();
 
-    await act(async () => {
-      await ref.current.show({
-        type: 'info'
+      await act(async () => {
+        await ref.current.show({
+          type: 'error'
+        });
+      });
+
+      expect(getRootView()).toHaveStyle({
+        borderLeftColor: colors.blazeOrange
       });
     });
 
-    expect(getRootView()).toHaveStyle({
-      borderLeftColor: colors.lightSkyBlue
+    it('calls onShow', async () => {
+      const onShow = jest.fn();
+      const { ref } = setup();
+
+      await act(async () => {
+        await ref.current.show({
+          type: 'info',
+          onShow
+        });
+      });
+
+      expect(onShow).toHaveBeenCalled();
     });
-  });
 
-  it('shows error type', async () => {
-    const { ref, getRootView } = setup();
+    it('calls onHide', async () => {
+      const onHide = jest.fn();
+      const { ref } = setup();
 
-    await act(async () => {
-      await ref.current.show({
-        type: 'error'
+      await act(async () => {
+        await ref.current.show({
+          type: 'info',
+          onHide
+        });
+        await ref.current.hide();
       });
+
+      expect(onHide).toHaveBeenCalled();
     });
 
-    expect(getRootView()).toHaveStyle({
-      borderLeftColor: colors.blazeOrange
+    it('fires onPress', async () => {
+      const onPress = jest.fn();
+      const { ref, getRootView } = setup();
+
+      await act(async () => {
+        await ref.current.show({
+          type: 'info',
+          onPress
+        });
+      });
+
+      fireEvent.press(getRootView());
+      expect(onPress).toHaveBeenCalled();
     });
-  });
 
-  it('calls onShow', async () => {
-    const onShow = jest.fn();
-    const { ref } = setup();
+    it('shows at the bottom', async () => {
+      const { ref, getAnimatedView } = setup();
 
-    await act(async () => {
-      await ref.current.show({
-        type: 'info',
-        onShow
+      await act(async () => {
+        await ref.current.show({
+          position: 'bottom'
+        });
+      });
+      expect(getAnimatedView()).toHaveStyle({
+        bottom: 0
       });
     });
 
-    expect(onShow).toHaveBeenCalled();
-  });
+    it('shows with custom top offset', async () => {
+      const { ref, getAnimatedView } = setup();
+      const offset = 60;
+      const height = 65;
 
-  it('calls onHide', async () => {
-    const onHide = jest.fn();
-    const { ref } = setup();
+      let animatedView = getAnimatedView();
+      expect(getVerticalOffset(animatedView)).toBe(-height);
 
-    await act(async () => {
-      await ref.current.show({
-        type: 'info',
-        onHide
+      await act(async () => {
+        await ref.current.show({
+          topOffset: offset
+        });
       });
-      await ref.current.hide();
+
+      animatedView = getAnimatedView();
+      expect(getVerticalOffset(animatedView)).toBe(offset);
     });
 
-    expect(onHide).toHaveBeenCalled();
+    it('shows with custom bottom offset', async () => {
+      const { ref, getAnimatedView } = setup();
+      const offset = 60;
+      const height = 65;
+
+      let animatedView = getAnimatedView();
+      expect(getVerticalOffset(animatedView)).toBe(-height);
+
+      await act(async () => {
+        await ref.current.show({
+          position: 'bottom',
+          bottomOffset: offset
+        });
+      });
+
+      animatedView = getAnimatedView();
+      expect(getVerticalOffset(animatedView)).toBe(-offset);
+    });
   });
 
-  it('fires onPress', async () => {
-    const onPress = jest.fn();
-    const { ref, getRootView } = setup();
+  describe('test props', () => {
+    it('shows Toast from custom config', async () => {
+      const testID = 'testView';
+      const { ref, queryByTestId } = setup({
+        config: {
+          test: () => <View testID={testID} />
+        }
+      });
 
-    await act(async () => {
-      await ref.current.show({
-        type: 'info',
-        onPress
+      await act(async () => {
+        await ref.current.show({
+          type: 'test'
+        });
       });
+
+      const testView = queryByTestId(testID);
+      expect(testView).toBeTruthy();
     });
 
-    fireEvent.press(getRootView());
-    expect(onPress).toHaveBeenCalled();
+    it('tries to show Toast type that does not exist', async () => {
+      const { ref, getRootView } = setup();
+
+      await act(async () => {
+        await ref.current.show({
+          type: 'test'
+        });
+      });
+
+      const rootView = getRootView();
+      expect(rootView).toBeFalsy();
+    });
   });
 });