chore: updates files and library to testing library

Author: hmarques98

.npmignore

@@ -33,7 +33,7 @@ template/*.iml
 #
 .vscode/
 template/.env
-template/.env*
+template/.env.prod
 
 # node.js
 #

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hmarques98/react-native-template-typescript",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "description": "A minimal template with good architecture and common packages to let you focus on writing features right away.",
   "scripts": {},
   "files": [

template/.env.example

@@ -0,0 +1,3 @@
+ENV=dev
+SENTRY_DSN="https://19f08009853b4b1a851090e742cf5fa3@o658389.ingest.sentry.io/5763830"
+BASE_URL=https://fakerapi.it/api/v1/

template/jest.config.js

@@ -1,7 +1,22 @@
+// eslint-disable-next-line @typescript-eslint/no-var-requires
 const jestPreset = require('@testing-library/react-native/jest-preset');
 
 module.exports = {
-  preset: 'jest-expo',
-  setupFiles: [...jestPreset.setupFiles],
-  setupFilesAfterEnv: ['./jest.setup.js'],
+  testEnvironment: 'node',
+  preset: 'react-native',
+  setupFiles: [
+    './jest.setup.js',
+    './node_modules/react-native-gesture-handler/jestSetup.js',
+    './node_modules/react-native/jest/setup.js',
+    './node_modules/react-native/Libraries/Utilities/__mocks__/BackHandler.js',
+  ],
+  setupFilesAfterEnv: ['@testing-library/jest-native/extend-expect'],
+  clearMocks: true,
+  moduleNameMapper: {
+    '\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$':
+      '<rootDir>/assetsTransformer.js',
+    '\\.(css|less)$': '<rootDir>/assetsTransformer.js',
+    '\\.svg': '<rootDir>/__mocks__/svgMocks.js',
+  },
+  moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
 };

template/jest.setup.js

@@ -1,5 +1,9 @@
 import mockRNCNetInfo from '@react-native-community/netinfo/jest/netinfo-mock.js';
 import mockAsyncStorage from '@react-native-async-storage/async-storage/jest/async-storage-mock';
+import React from 'react';
+import '@testing-library/jest-native/extend-expect';
+import { jest } from '@jest/globals';
+import { server } from './src/test/mocks/server';
 
 jest.mock('@react-native-community/netinfo', () => mockRNCNetInfo);
 jest.mock('@react-native-async-storage/async-storage', () => mockAsyncStorage);
@@ -9,6 +13,7 @@ jest.mock('@sentry/react-native', () => ({
 }));
 
 jest.mock('react-native-reanimated', () => {
+  // eslint-disable-next-line @typescript-eslint/no-var-requires
   const Reanimated = require('react-native-reanimated/mock');
 
   // The mock for `call` immediately calls the callback which is incorrect
@@ -32,6 +37,63 @@ global.requestAnimationFrame = (cb) => {
 };
 
 jest.mock('react-native/Libraries/Components/Switch/Switch', () => {
+  // eslint-disable-next-line @typescript-eslint/no-var-requires
   const mockComponent = require('react-native/jest/mockComponent');
   return mockComponent('react-native/Libraries/Components/Switch/Switch');
 });
+
+jest.mock('react-native/Libraries/Animated/src/NativeAnimatedHelper');
+jest.mock('react-native-gesture-handler', () => {
+  // eslint-disable-next-line @typescript-eslint/no-var-requires
+  const View = require('react-native/Libraries/Components/View/View');
+  return {
+    Swipeable: View,
+    DrawerLayout: View,
+    State: {},
+    ScrollView: View,
+    Slider: View,
+    Switch: View,
+    TextInput: View,
+    ToolbarAndroid: View,
+    ViewPagerAndroid: View,
+    DrawerLayoutAndroid: View,
+    WebView: View,
+    NativeViewGestureHandler: View,
+    TapGestureHandler: View,
+    FlingGestureHandler: View,
+    ForceTouchGestureHandler: View,
+    LongPressGestureHandler: View,
+    PanGestureHandler: View,
+    PinchGestureHandler: View,
+    RotationGestureHandler: View,
+    /* Buttons */
+    RawButton: View,
+    BaseButton: View,
+    RectButton: View,
+    BorderlessButton: View,
+    /* Other */
+    FlatList: View,
+    gestureHandlerRootHOC: () => null,
+    Directions: {},
+  };
+});
+
+//establish api mocking before all tests
+beforeAll(() => server.listen());
+
+beforeEach(() => {
+  global.fetch = jest.fn((...args) => {
+    console.warn('global.fetch needs to be mocked in tests', ...args);
+    throw new Error('global.fetch needs to be mocked in tests');
+  });
+});
+
+//clean up after the tests are finished
+afterAll(() => server.close());
+
+afterEach(() => {
+  global.fetch.mockRestore();
+  //reset any requests handlers that we may add during the tests,
+  //so they don't affect other tests.
+  server.resetHandlers();
+});

template/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "template",
+  "name": "StarWarsApp",
   "version": "0.0.1",
   "private": true,
   "scripts": {
@@ -61,7 +61,7 @@
     "@storybook/addon-ondevice-actions": "^5.3.23",
     "@storybook/addon-ondevice-knobs": "^5.3.25",
     "@storybook/react-native": "^5.3.25",
-    "@testing-library/jest-native": "^3.4.3",
+    "@testing-library/jest-native": "^4.0.1",
     "@testing-library/react-hooks": "^5.1.0",
     "@testing-library/react-native": "^7.2.0",
     "@types/detox": "^17.14.0",
@@ -95,35 +95,6 @@
   "resolutions": {
     "@types/react": "^17"
   },
-  "jest": {
-    "testEnvironment": "node",
-    "setupFiles": [
-      "./jest.setup.js",
-      "./node_modules/react-native-gesture-handler/jestSetup.js",
-      "./node_modules/react-native/jest/setup.js",
-      "./node_modules/react-native/Libraries/Utilities/__mocks__/BackHandler.js"
-    ],
-    "setupFilesAfterEnv": [
-      "@testing-library/jest-native/extend-expect"
-    ],
-    "preset": "react-native",
-    "moduleFileExtensions": [
-      "ts",
-      "tsx",
-      "js",
-      "jsx",
-      "json",
-      "node"
-    ],
-    "moduleNameMapper": {
-      "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/assetsTransformer.js",
-      "\\.(css|less)$": "/assetsTransformer.js",
-      "\\.svg": "<rootDir>/__mocks__/svgMocks.js"
-    },
-    "transformIgnorePatterns": [
-      "node_modules/(?!(jest-)?react-native|@react-native-community|@react-navigation)"
-    ]
-  },
   "lint-staged": {
     "*.{js,ts,tsx}": [
       "eslint . --fix",