Merge pull request #252 from retyui/update-tests

Add simple tests & update dev dependencies

Author: LinusU

.circleci/config.yml

@@ -2,7 +2,7 @@ version: 2.1
 
 
 orbs:
-  rn: react-native-community/react-native@4.1.1
+  rn: react-native-community/react-native@5.5.0
 
 
 jobs:

package.json

@@ -22,21 +22,21 @@
     "@auto-it/all-contributors": "9.28.3",
     "@auto-it/first-time-contributor": "9.28.3",
     "@react-native-community/eslint-config": "1.1.0",
-    "@testing-library/react-hooks": "3.2.1",
-    "@testing-library/react-native": "5.0.3",
-    "@types/jest": "25.2.3",
+    "@testing-library/react-hooks": "7.0.2",
+    "@testing-library/react-native": "7.2.0",
+    "@types/jest": "27.0.2",
     "@types/react": "16.14.17",
     "@types/react-native": "0.62.18",
     "all-contributors-cli": "6.15.0",
     "auto": "9.26.8",
     "eslint": "7.3.1",
     "eslint-plugin-prettier": "3.1.4",
-    "jest": "26.0.1",
+    "jest": "27.2.5",
     "prettier": "2.4.1",
     "react": "16.13.1",
     "react-native": "0.62.3",
     "react-test-renderer": "16.13.1",
-    "ts-jest": "25.5.1",
+    "ts-jest": "27.0.5",
     "typescript": "3.9.10"
   },
   "author": "Nader Dabit",
@@ -46,6 +46,7 @@
   },
   "license": "ISC",
   "files": [
-    "lib"
+    "lib",
+    "!*.test.*"
   ]
 }

src/useBackHandler.test.ts

@@ -0,0 +1,61 @@
+import {useBackHandler} from './useBackHandler'
+import {renderHook} from '@testing-library/react-hooks'
+import {BackHandler} from 'react-native'
+
+jest.mock('react-native', () => ({
+  BackHandler: {
+    addEventListener: jest.fn(),
+    removeEventListener: jest.fn(),
+  },
+}))
+
+describe('useBackHandler', () => {
+  const addEventListenerMock = BackHandler.addEventListener as jest.Mock
+  const removeEventListenerMock = BackHandler.removeEventListener as jest.Mock
+
+  beforeEach(() => {
+    jest.clearAllMocks()
+  })
+
+  it('should add back press listener on mount', () => {
+    const handler = jest.fn()
+
+    renderHook((props) => useBackHandler(props.handler), {
+      initialProps: {handler},
+    })
+
+    expect(addEventListenerMock).toBeCalledTimes(1)
+    expect(addEventListenerMock).toBeCalledWith('hardwareBackPress', handler)
+  })
+
+  it('should resubscribe when passed handler will change', () => {
+    const handler = jest.fn()
+    const handler2 = jest.fn()
+
+    const {rerender} = renderHook((props) => useBackHandler(props.handler), {
+      initialProps: {handler},
+    })
+
+    expect(addEventListenerMock).toBeCalledWith('hardwareBackPress', handler)
+
+    rerender({handler: handler2})
+
+    expect(removeEventListenerMock).toBeCalledWith('hardwareBackPress', handler)
+    expect(addEventListenerMock).toBeCalledWith('hardwareBackPress', handler2)
+  })
+
+  it('should remove back press listener on unmount', () => {
+    const handler = jest.fn()
+
+    const {unmount} = renderHook((props) => useBackHandler(props.handler), {
+      initialProps: {handler},
+    })
+
+    expect(removeEventListenerMock).toBeCalledTimes(0)
+
+    unmount()
+
+    expect(removeEventListenerMock).toBeCalledTimes(1)
+    expect(removeEventListenerMock).toBeCalledWith('hardwareBackPress', handler)
+  })
+})

src/useInteractionManager.test.ts

@@ -0,0 +1,38 @@
+import {useInteractionManager} from './useInteractionManager'
+import {act, renderHook} from '@testing-library/react-hooks'
+import {InteractionManager} from 'react-native'
+
+jest.mock('react-native', () => ({
+  InteractionManager: {
+    runAfterInteractions: jest.fn(),
+  },
+}))
+
+describe('useInteractionManager', () => {
+  const runAfterInteractionsMock =
+    InteractionManager.runAfterInteractions as jest.Mock
+
+  it('should return false by default', () => {
+    const {result} = renderHook(() => useInteractionManager())
+
+    expect(result.current).toBe(false)
+  })
+
+  it('should return true after all interactions have completed', () => {
+    let emitAfterInteractions = () => {}
+
+    runAfterInteractionsMock.mockImplementationOnce((cb) => {
+      emitAfterInteractions = cb
+    })
+
+    const {result} = renderHook(() => useInteractionManager())
+
+    expect(result.current).toBe(false)
+
+    act(() => {
+      emitAfterInteractions()
+    })
+
+    expect(result.current).toBe(true)
+  })
+})

src/useLayout.test.ts

@@ -1,14 +1,29 @@
-import {renderHook} from '@testing-library/react-hooks'
+import {renderHook, act} from '@testing-library/react-hooks'
 
 import {useLayout} from './useLayout'
 
-describe('bla', () => {
-  it('should increment counter', () => {
+describe('useLayout', () => {
+  it('should return default state', () => {
     const {result} = renderHook(() => useLayout())
 
     expect(result.current.x).toBe(0)
     expect(result.current.y).toBe(0)
     expect(result.current.width).toBe(0)
     expect(result.current.height).toBe(0)
   })
+
+  it('should update state when layout change', () => {
+    const {result} = renderHook(() => useLayout())
+
+    act(() => {
+      const layout = {x: 1, y: 2, width: 3, height: 4}
+
+      result.current.onLayout({nativeEvent: {layout}})
+    })
+
+    expect(result.current.x).toBe(1)
+    expect(result.current.y).toBe(2)
+    expect(result.current.width).toBe(3)
+    expect(result.current.height).toBe(4)
+  })
 })