refactor stack. Add details to example tests.
This commit is contained in:
parent
bc3d481d25
commit
b3c2e09987
@ -10,6 +10,19 @@ import React, { act } from 'react';
|
||||
import { render, screen } from '@testing-library/react-native'
|
||||
import { MyComponent } from '@/app/component/MyComponent';
|
||||
|
||||
/**
|
||||
* IMPORTANT NOTE: If you need to use jest mock, remember that
|
||||
* you cannot include any external components in the mock.
|
||||
* You absolutely must use `jest.requireActual` to import the
|
||||
* component *within* the jest.mock callback.
|
||||
*/
|
||||
jest.mock('@/app/component/index.tsx', () => {
|
||||
// Require-actual the component
|
||||
const { Text } = jest.requireActual('react-native');
|
||||
// Use the component.
|
||||
return () => <Text>Index</Text>
|
||||
});
|
||||
|
||||
describe('Message Component', () => {
|
||||
|
||||
beforeEach(() => {
|
||||
|
1
.vscode/settings.json
vendored
1
.vscode/settings.json
vendored
@ -1,3 +1,2 @@
|
||||
{
|
||||
"jestTestExplorer.pathToJest": "./node_modules/.bin/jest"
|
||||
}
|
10
__mocks__/expo-file-system.js
Normal file
10
__mocks__/expo-file-system.js
Normal file
@ -0,0 +1,10 @@
|
||||
// __mocks__/expo-file-system.js
|
||||
export const File = {
|
||||
// Define the properties and methods you need for your tests
|
||||
uri: 'file:///path/to/file',
|
||||
};
|
||||
|
||||
export const Paths = {
|
||||
// Define the paths you need for your tests
|
||||
DOCUMENTS_DIRECTORY: '/path/to/documents',
|
||||
};
|
@ -5,17 +5,12 @@ import { LanguageSelection } from '@/components/LanguageSelection';
|
||||
import { createNativeStackNavigator } from '@react-navigation/native-stack';
|
||||
import ConversationThread from '@/components/ConversationThread';
|
||||
import Home from '.';
|
||||
import TTNavStack from '@/components/TTNavStack';
|
||||
|
||||
const Stack = createNativeStackNavigator();
|
||||
|
||||
export default function Layout() {
|
||||
return (
|
||||
<NavigationContainer>
|
||||
<Stack.Navigator initialRouteName='LanguageSelection'>
|
||||
<Stack.Screen name="LanguageSelection" component={Home} />
|
||||
<Stack.Screen name="ConversationThread" component={ConversationThread} />
|
||||
<Stack.Screen name="Settings" component={SettingsComponent} />
|
||||
</Stack.Navigator>
|
||||
</NavigationContainer>
|
||||
<TTNavStack />
|
||||
);
|
||||
}
|
20
components/TTNavStack.tsx
Normal file
20
components/TTNavStack.tsx
Normal file
@ -0,0 +1,20 @@
|
||||
import * as React from 'react';
|
||||
import { NavigationContainer } from '@react-navigation/native';
|
||||
import SettingsComponent from '@/components/Settings';
|
||||
import { LanguageSelection } from '@/components/LanguageSelection';
|
||||
import { createNativeStackNavigator } from '@react-navigation/native-stack';
|
||||
import ConversationThread from '@/components/ConversationThread';
|
||||
|
||||
const Stack = createNativeStackNavigator();
|
||||
|
||||
export default function TTNavStack() {
|
||||
return (
|
||||
<NavigationContainer>
|
||||
<Stack.Navigator initialRouteName='LanguageSelection'>
|
||||
<Stack.Screen name="LanguageSelection" component={LanguageSelection} />
|
||||
<Stack.Screen name="ConversationThread" component={ConversationThread} />
|
||||
<Stack.Screen name="Settings" component={SettingsComponent} />
|
||||
</Stack.Navigator>
|
||||
</NavigationContainer>
|
||||
);
|
||||
}
|
30
components/__tests__/index.spec.tsx
Normal file
30
components/__tests__/index.spec.tsx
Normal file
@ -0,0 +1,30 @@
|
||||
import React from 'react';
|
||||
import { fireEvent, render, screen } from '@testing-library/react-native';
|
||||
import { NavigationContainer } from '@react-navigation/native';
|
||||
import { createStackNavigator } from '@react-navigation/stack';
|
||||
import TTNavStack from '../TTNavStack';
|
||||
|
||||
jest.mock('expo-file-system', () => require('./__mocks__/expo-file-system'));
|
||||
|
||||
const Stack = createStackNavigator();
|
||||
|
||||
describe('Navigation', () => {
|
||||
beforeEach(() => {
|
||||
// Reset the navigation state before each test
|
||||
jest.clearAllMocks();
|
||||
});
|
||||
|
||||
it('Navigates to ConversationThread on language selection', async () => {
|
||||
render(<TTNavStack />);
|
||||
const languageSelectionText = await screen.findByText("Language Selection");
|
||||
fireEvent.press(languageSelectionText);
|
||||
expect(await screen.findByText("Conversation Thread")).toBeOnTheScreen();
|
||||
});
|
||||
|
||||
it('Navigates to Settings on settings selection', async () => {
|
||||
render(<TTNavStack />);
|
||||
const settingsButton = await screen.findByText("Settings");
|
||||
fireEvent.press(settingsButton);
|
||||
expect(await screen.findByText("Settings")).toBeOnTheScreen();
|
||||
});
|
||||
});
|
12
package.json
12
package.json
@ -64,20 +64,10 @@
|
||||
"transformIgnorePatterns": [
|
||||
"node_modules/(?!((jest-)?react-native|@react-native(-community)?)|expo(nent)?|@expo(nent)?/.*|@expo-google-fonts/.*|react-navigation|@react-navigation/.*|@sentry/react-native|native-base|react-native-svg)"
|
||||
],
|
||||
"collectCoverage": true,
|
||||
"collectCoverageFrom": [
|
||||
"**/*.{ts,tsx,js,jsx}",
|
||||
"!**/coverage/**",
|
||||
"!**/node_modules/**",
|
||||
"!**/babel.config.js",
|
||||
"!**/expo-env.d.ts",
|
||||
"!**/.expo/**"
|
||||
],
|
||||
"automock": false,
|
||||
"setupFilesAfterEnv": [
|
||||
"<rootDir>/jestSetup.ts"
|
||||
],
|
||||
"testTimeout": 10000
|
||||
]
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.26.7",
|
||||
|
Loading…
x
Reference in New Issue
Block a user