Skip to content

Commit e690d72

Browse files
vanGalileavanGalilea
authored
Feat/makeover (#35)
* upgrade all android func. * upgrading RN * tsc clean * count case V * count with hook case V * Easy Button revamp V * FlatList revamp V * FlatList revamp V * Home revamp V and assests transf. * Video revamp V * tests passing, still in need of revamping last compos: modal 2 logins and list with... * Modal revamp V * Login related revamp V * list with fetch related revamp V * Cleanup and README.md * fixed video not playing on iOS bug
1 parent 057a068 commit e690d72

File tree

102 files changed

+5322
-6006
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

102 files changed

+5322
-6006
lines changed

‎.buckconfig

-6
This file was deleted.

‎.bundle/config

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
BUNDLE_PATH: "vendor/bundle"
2+
BUNDLE_FORCE_RUBY_PLATFORM: 1

‎.eslintrc.js

+1-10
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,4 @@
11
module.exports = {
22
root: true,
33
extends: '@react-native-community',
4-
parser: '@typescript-eslint/parser',
5-
plugins: ['@typescript-eslint', 'jest'],
6-
rules: {
7-
semi: [2, 'never'],
8-
'react-native/no-inline-styles': 0,
9-
},
10-
env: {
11-
'jest/globals': true,
12-
},
13-
}
4+
};

‎.gitattributes

-1
This file was deleted.

‎.gitignore

+13-16
Original file line numberDiff line numberDiff line change
@@ -20,32 +20,25 @@ DerivedData
2020
*.hmap
2121
*.ipa
2222
*.xcuserstate
23+
ios/.xcode.env.local
2324

2425
# Android/IntelliJ
2526
#
27+
build/
2628
.idea
2729
.gradle
2830
local.properties
2931
*.iml
3032
*.hprof
31-
32-
# Visual Studio Code
33-
#
34-
.vscode/
33+
.cxx/
34+
*.keystore
35+
!debug.keystore
3536

3637
# node.js
3738
#
3839
node_modules/
3940
npm-debug.log
4041
yarn-error.log
41-
package-lock.json
42-
yarn.lock
43-
44-
# BUCK
45-
buck-out/
46-
\.buckd/
47-
*.keystore
48-
!debug.keystore
4942

5043
# fastlane
5144
#
@@ -54,13 +47,17 @@ buck-out/
5447
# For more information about the recommended setup visit:
5548
# https://docs.fastlane.tools/best-practices/source-control/
5649

57-
*/fastlane/report.xml
58-
*/fastlane/Preview.html
59-
*/fastlane/screenshots
50+
**/fastlane/report.xml
51+
**/fastlane/Preview.html
52+
**/fastlane/screenshots
53+
**/fastlane/test_output
6054

6155
# Bundle artifact
6256
*.jsbundle
6357

64-
# CocoaPods
58+
# Ruby / CocoaPods
6559
/ios/Pods/
60+
/vendor/bundle/
6661

62+
# Temporary files created by Metro to check the health of the file watcher
63+
.metro-health-check*

‎.node-version

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
18

‎.prettierrc

-17
This file was deleted.

‎.prettierrc.js

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
module.exports = {
2+
arrowParens: 'avoid',
3+
bracketSameLine: true,
4+
bracketSpacing: false,
5+
singleQuote: true,
6+
trailingComma: 'all',
7+
};

‎src/components/App.tsx ‎App.tsx

+37-28
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,33 @@
1-
import 'react-native-gesture-handler'
2-
import React from 'react'
3-
import Counter from './Counter'
4-
import LoginSubmission from './LoginSubmission'
5-
import {NavigationContainer} from '@react-navigation/native'
1+
import React from 'react';
2+
import {NavigationContainer} from '@react-navigation/native';
63
import {
74
createStackNavigator,
85
StackNavigationProp,
9-
} from '@react-navigation/stack'
10-
import EasyButton from './EasyButton'
11-
import Home from './Home'
12-
import {ThemeProvider} from '../utils/theme'
13-
import Video from './Video'
14-
import Modal from './Modal'
15-
import FlatList from './FlatList'
16-
import ListWithFetch from './ListWithFetch'
6+
} from '@react-navigation/stack';
7+
import Home from './src/components/Home';
8+
import EasyButton from './src/components/EasyButton';
9+
import Video from './src/components/Video';
10+
import FlatList from './src/components/FlatList';
11+
import Modal from './src/components/Modal';
12+
import {ThemeProvider} from './src/utils/theme';
13+
import ListWithFetch from './src/components/ListWithFetch';
14+
import LoginSubmission from './src/components/LoginSubmission';
15+
import Counter from './src/components/Counter';
16+
import {Alert} from 'react-native';
1717

1818
export type RootStackParamList = {
19-
Home: undefined
20-
Counter: undefined
21-
Login: undefined
22-
EasyButton: undefined
23-
Video: undefined
24-
Modal: undefined
25-
FlatList: undefined
26-
ListWithFetch: undefined
27-
}
28-
export type NavigationProps = StackNavigationProp<RootStackParamList>
19+
Home: undefined;
20+
Counter: undefined;
21+
Login: undefined;
22+
EasyButton: undefined;
23+
Video: undefined;
24+
Modal: undefined;
25+
FlatList: undefined;
26+
ListWithFetch: undefined;
27+
};
28+
export type NavigationProps = StackNavigationProp<RootStackParamList>;
2929

30-
export const Stack = createStackNavigator<RootStackParamList>()
30+
export const Stack = createStackNavigator<RootStackParamList>();
3131

3232
export const SCREENS: Record<string, keyof RootStackParamList> = {
3333
HOME: 'Home',
@@ -38,7 +38,13 @@ export const SCREENS: Record<string, keyof RootStackParamList> = {
3838
MODAL: 'Modal',
3939
FLATLIST: 'FlatList',
4040
LIST_WITH_FETCH: 'ListWithFetch',
41-
}
41+
};
42+
const EasyButtonScreen = () => {
43+
const handleOnPress = () => {
44+
Alert.alert('EasyButton', 'You clicked me!');
45+
};
46+
return <EasyButton onPress={handleOnPress} />;
47+
};
4248
export default () => {
4349
return (
4450
<>
@@ -47,7 +53,10 @@ export default () => {
4753
<Stack.Navigator initialRouteName="Home">
4854
<Stack.Screen name={SCREENS.HOME} component={Home} />
4955
<Stack.Screen name={SCREENS.LOGIN} component={LoginSubmission} />
50-
<Stack.Screen name={SCREENS.EASYBUTTON} component={EasyButton} />
56+
<Stack.Screen
57+
name={SCREENS.EASYBUTTON}
58+
component={EasyButtonScreen}
59+
/>
5160
<Stack.Screen name={SCREENS.COUNTER} component={Counter} />
5261
<Stack.Screen name={SCREENS.VIDEO} component={Video} />
5362
<Stack.Screen name={SCREENS.MODAL} component={Modal} />
@@ -60,5 +69,5 @@ export default () => {
6069
</NavigationContainer>
6170
</ThemeProvider>
6271
</>
63-
)
64-
}
72+
);
73+
};

‎Gemfile

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
source 'https://rubygems.org'
2+
3+
# You may use http://rbenv.org/ or https://rvm.io/ to install and use this version
4+
ruby '>= 2.6.10'
5+
6+
gem 'cocoapods', '>= 1.11.3'

‎Gemfile.lock

+98
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,98 @@
1+
GEM
2+
remote: https://rubygems.org/
3+
specs:
4+
CFPropertyList (3.0.6)
5+
rexml
6+
activesupport (7.0.5)
7+
concurrent-ruby (~> 1.0, >= 1.0.2)
8+
i18n (>= 1.6, < 2)
9+
minitest (>= 5.1)
10+
tzinfo (~> 2.0)
11+
addressable (2.8.4)
12+
public_suffix (>= 2.0.2, < 6.0)
13+
algoliasearch (1.27.5)
14+
httpclient (~> 2.8, >= 2.8.3)
15+
json (>= 1.5.1)
16+
atomos (0.1.3)
17+
claide (1.1.0)
18+
cocoapods (1.12.1)
19+
addressable (~> 2.8)
20+
claide (>= 1.0.2, < 2.0)
21+
cocoapods-core (= 1.12.1)
22+
cocoapods-deintegrate (>= 1.0.3, < 2.0)
23+
cocoapods-downloader (>= 1.6.0, < 2.0)
24+
cocoapods-plugins (>= 1.0.0, < 2.0)
25+
cocoapods-search (>= 1.0.0, < 2.0)
26+
cocoapods-trunk (>= 1.6.0, < 2.0)
27+
cocoapods-try (>= 1.1.0, < 2.0)
28+
colored2 (~> 3.1)
29+
escape (~> 0.0.4)
30+
fourflusher (>= 2.3.0, < 3.0)
31+
gh_inspector (~> 1.0)
32+
molinillo (~> 0.8.0)
33+
nap (~> 1.0)
34+
ruby-macho (>= 2.3.0, < 3.0)
35+
xcodeproj (>= 1.21.0, < 2.0)
36+
cocoapods-core (1.12.1)
37+
activesupport (>= 5.0, < 8)
38+
addressable (~> 2.8)
39+
algoliasearch (~> 1.0)
40+
concurrent-ruby (~> 1.1)
41+
fuzzy_match (~> 2.0.4)
42+
nap (~> 1.0)
43+
netrc (~> 0.11)
44+
public_suffix (~> 4.0)
45+
typhoeus (~> 1.0)
46+
cocoapods-deintegrate (1.0.5)
47+
cocoapods-downloader (1.6.3)
48+
cocoapods-plugins (1.0.0)
49+
nap
50+
cocoapods-search (1.0.1)
51+
cocoapods-trunk (1.6.0)
52+
nap (>= 0.8, < 2.0)
53+
netrc (~> 0.11)
54+
cocoapods-try (1.2.0)
55+
colored2 (3.1.2)
56+
concurrent-ruby (1.2.2)
57+
escape (0.0.4)
58+
ethon (0.16.0)
59+
ffi (>= 1.15.0)
60+
ffi (1.15.5)
61+
fourflusher (2.3.1)
62+
fuzzy_match (2.0.4)
63+
gh_inspector (1.1.3)
64+
httpclient (2.8.3)
65+
i18n (1.13.0)
66+
concurrent-ruby (~> 1.0)
67+
json (2.6.3)
68+
minitest (5.18.0)
69+
molinillo (0.8.0)
70+
nanaimo (0.3.0)
71+
nap (1.1.0)
72+
netrc (0.11.0)
73+
public_suffix (4.0.7)
74+
rexml (3.2.5)
75+
ruby-macho (2.5.1)
76+
typhoeus (1.4.0)
77+
ethon (>= 0.9.0)
78+
tzinfo (2.0.6)
79+
concurrent-ruby (~> 1.0)
80+
xcodeproj (1.22.0)
81+
CFPropertyList (>= 2.3.3, < 4.0)
82+
atomos (~> 0.1.3)
83+
claide (>= 1.0.2, < 2.0)
84+
colored2 (~> 3.1)
85+
nanaimo (~> 0.3.0)
86+
rexml (~> 3.2.4)
87+
88+
PLATFORMS
89+
ruby
90+
91+
DEPENDENCIES
92+
cocoapods (>= 1.11.3)
93+
94+
RUBY VERSION
95+
ruby 2.7.5p203
96+
97+
BUNDLED WITH
98+
2.3.21

‎README.md

+26-6
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
11
### This is how you should test 🧪 your react-native ⚛️ components with [Jest](https://jestjs.io/) and [React Native Testing Library](https://callstack.github.io/react-native-testing-library/)
22

3-
##### 👏 Inspired by [Kent C. Dodds'](https://testingjavascript.com/) workshop [Test React Components with Jest and React Testing Library](https://github.com/testing-library/react-testing-library). For more info check [Epic React](https://epicreact.dev/)
4-
53
In this repo you'll find several examples that will cover:
64
- 👆 [Clicking buttons and asserting onPress' outcome](https://github.com/vanGalilea/react-native-testing/blob/master/__tests__/Counter.test.tsx).
75
- 📲 [Filling a simple login form and asserting successful submission](https://github.com/vanGalilea/react-native-testing/blob/master/__tests__/LoginSubmission.test.tsx).
@@ -15,8 +13,30 @@ In this repo you'll find several examples that will cover:
1513
- 🧾 [Handling with a screen with RN's FlatList component](https://github.com/vanGalilea/react-native-testing/blob/master/__tests__/FlatList.test.tsx).
1614
- 📡 [Using MSW to mock api calls and handling loading/errors](https://github.com/vanGalilea/react-native-testing/blob/master/__tests__/ListWithFetch.test.tsx).
1715

18-
19-
20-
21-
16+
### How to run the tests 🏃‍♀️
17+
- Clone the repo
18+
- Run `yarn` to install dependencies
19+
- Run `yarn test` to run the tests
20+
- Run `yarn test:coverage` to run the tests and generate a coverage report
21+
22+
23+
### How to run the app 📱
24+
- Clone the repo
25+
- Run `yarn` to install dependencies
26+
- Run `npx pod-install` to install iOS dependencies
27+
- Run `yarn start` to start the metro bundler
28+
- Click `i` to run the app on iOS simulator or `a` to run it on Android emulator
29+
30+
### Ideas and future improvements 🚀
31+
- 📱 Add E2E tests with Maestro
32+
- ⚛️ Add tests for react native web project
33+
34+
### Inspiration, resources and further reading 📚
35+
- 👏 Inspired by [Kent C. Dodds'](https://testingjavascript.com/) workshop [Test React Components with Jest and React Testing Library](https://github.com/testing-library/react-testing-library).
36+
For more info check [Epic React](https://epicreact.dev/).
37+
- 📕 [React Native Testing Library](https://callstack.github.io/react-native-testing-library/)
38+
- 🧑‍🔬️ [Jest](https://jestjs.io/)
39+
- ️⚛️ [React Native](https://reactnative.dev/)
40+
- 🗺 [React Navigation](https://reactnavigation.org/)
41+
- 🛰 [MSW](https://mswjs.io/)
2242

‎SECURITY.md

-21
This file was deleted.

0 commit comments

Comments
 (0)