Fakultas Ilmu Komputer UI

Commit b1fa5502 authored by Zafir Rasyidi Taufik's avatar Zafir Rasyidi Taufik
Browse files

[RED] Add test for google signin form page

parent 69156048
/**
* @format
*/
import 'react-native';
import React from 'react';
import axios from 'axios';
import {NavigationContainer} from '@react-navigation/native';
import {createStackNavigator} from '@react-navigation/stack';
import OfficerSignupFormGoogleSignin from '.';
// Note: test renderer must be required after react-native.
import ReactTestRenderer, { act } from 'react-test-renderer';
import { AppContext } from 'contexts';
import { useMainService } from 'services';
import { KECAMATAN_VALUES, KELURAHAN_VALUES } from './constants';
const Stack = createStackNavigator();
const testProps = {
services: {
main: useMainService('dummyToken'),
},
cache: {},
}
jest.mock('axios');
jest.useFakeTimers();
const mockedAxios = axios as jest.Mocked<typeof axios>;
describe("OfficerSignupFormGoogleSignin", () => {
it('renders correctly', () => {
const formPage = ReactTestRenderer.create(
<NavigationContainer>
<Stack.Navigator
screenOptions={{
// Empty header
header: () => <></>,
}}>
<Stack.Screen name="googlesignup" component={OfficerSignupFormGoogleSignin} />
</Stack.Navigator>
</NavigationContainer>
);
expect(formPage).toBeTruthy();
});
it('district and subdistrict field has default value on render', () => {
const formPage = ReactTestRenderer.create(
<NavigationContainer>
<Stack.Navigator
screenOptions={{
// Empty header
header: () => <></>,
}}>
<Stack.Screen name="googlesignup" component={OfficerSignupFormGoogleSignin} />
</Stack.Navigator>
</NavigationContainer>
);
expect(formPage).toBeTruthy();
const districtField = formPage.root.find(elem => elem.props.id === "district");
const sub_districtField = formPage.root.find(elem => elem.props.id === "sub_district");
expect(districtField).toBeTruthy();
expect(sub_districtField).toBeTruthy();
expect(districtField.props.value).toBe(KECAMATAN_VALUES[0].value);
expect(sub_districtField.props.value).toBe(KELURAHAN_VALUES[KECAMATAN_VALUES[0].value][0].value);
});
it('success with insert fields with valid values', async () => {
const formPage = ReactTestRenderer.create(
<AppContext.Provider value={testProps}>
<NavigationContainer>
<Stack.Navigator
screenOptions={{
// Empty header
header: () => <></>,
}}>
<Stack.Screen name="googlesignup" component={OfficerSignupFormGoogleSignin} />
</Stack.Navigator>
</NavigationContainer>
</AppContext.Provider>
);
expect(formPage).toBeTruthy()
const phoneField = formPage.root.find(elem => elem.props.id === "phone")
expect(phoneField).toBeTruthy()
const districtField = formPage.root.find(elem => elem.props.id === "district")
expect(districtField).toBeTruthy()
const sub_districtField = formPage.root.find(elem => elem.props.id === "sub_district")
expect(sub_districtField).toBeTruthy()
// Set value
act(() => {
if (phoneField && districtField && sub_districtField) {
phoneField.props.updateValue("081802769312")
districtField.props.updateValue("districtku")
sub_districtField.props.updateValue("subdistrictku")
}
})
expect(formPage.toJSON()).toMatchSnapshot()
mockedAxios.request.mockImplementationOnce(
() => new Promise(resolve => {
resolve({
status: 201,
data: {
"message": "success signup",
},
});
})
);
const submit = formPage.root.find(elem => elem.props.id === "submit")
await act(async () => {
submit.props.onPress()
})
});
it('Show modal when signup with already used username', async () => {
const formPage = ReactTestRenderer.create(
<AppContext.Provider value={testProps}>
<NavigationContainer>
<Stack.Navigator
screenOptions={{
// Empty header
header: () => <></>,
}}>
<Stack.Screen name="googlesignup" component={OfficerSignupFormGoogleSignin} />
</Stack.Navigator>
</NavigationContainer>
</AppContext.Provider>
);
expect(formPage).toBeTruthy()
const phoneField = formPage.root.find(elem => elem.props.id === "phone")
expect(phoneField).toBeTruthy()
const districtField = formPage.root.find(elem => elem.props.id === "district")
expect(districtField).toBeTruthy()
const sub_districtField = formPage.root.find(elem => elem.props.id === "sub_district")
expect(sub_districtField).toBeTruthy()
// Set value
act(() => {
if (phoneField && districtField && sub_districtField) {
phoneField.props.updateValue("081802769312")
districtField.props.updateValue("districtku")
sub_districtField.props.updateValue("subdistrictku")
}
})
expect(formPage.toJSON()).toMatchSnapshot()
mockedAxios.request.mockImplementationOnce(
() => new Promise(resolve => {
resolve({
status: 500,
data: "IntegrityError"
});
})
);
const submit = formPage.root.find(elem => elem.props.id === "submit")
await act(async () => {
submit.props.onPress()
})
const modal = formPage.root.find(elem => elem.props.id === "errorModal")
const modalBack = formPage.root.find(elem => elem.props.id === "modalBack")
act(() => {
modalBack.props.onPress()
modal.props.onDismiss()
})
});
it('Show modal when signup error', async () => {
const formPage = ReactTestRenderer.create(
<AppContext.Provider value={testProps}>
<NavigationContainer>
<Stack.Navigator
screenOptions={{
// Empty header
header: () => <></>,
}}>
<Stack.Screen name="googlesignup" component={OfficerSignupFormGoogleSignin} />
</Stack.Navigator>
</NavigationContainer>
</AppContext.Provider>
);
expect(formPage).toBeTruthy()
const phoneField = formPage.root.find(elem => elem.props.id === "phone")
expect(phoneField).toBeTruthy()
const districtField = formPage.root.find(elem => elem.props.id === "district")
expect(districtField).toBeTruthy()
const sub_districtField = formPage.root.find(elem => elem.props.id === "sub_district")
expect(sub_districtField).toBeTruthy()
// Set value
act(() => {
if (phoneField && districtField && sub_districtField) {
phoneField.props.updateValue("081802769312")
districtField.props.updateValue("districtku")
sub_districtField.props.updateValue("subdistrictku")
}
})
expect(formPage.toJSON()).toMatchSnapshot()
mockedAxios.request.mockImplementationOnce(
() => new Promise(resolve => {
resolve({
status: 500,
data: "Error selain integrity"
});
})
);
const submit = formPage.root.find(elem => elem.props.id === "submit")
await act(async () => {
submit.props.onPress()
})
const modal = formPage.root.find(elem => elem.props.id === "errorModal")
const modalBack = formPage.root.find(elem => elem.props.id === "modalBack")
act(() => {
modalBack.props.onPress()
modal.props.onDismiss()
})
});
it('Show messages when insert fields with invalid values', async () => {
const formPage = ReactTestRenderer.create(
<AppContext.Provider value={testProps}>
<NavigationContainer>
<Stack.Navigator
screenOptions={{
// Empty header
header: () => <></>,
}}>
<Stack.Screen name="googlesignup" component={OfficerSignupFormGoogleSignin} />
</Stack.Navigator>
</NavigationContainer>
</AppContext.Provider>
);
expect(formPage).toBeTruthy()
const phoneField = formPage.root.find(elem => elem.props.id === "phone")
expect(phoneField).toBeTruthy()
const districtField = formPage.root.find(elem => elem.props.id === "district")
expect(districtField).toBeTruthy()
const sub_districtField = formPage.root.find(elem => elem.props.id === "sub_district")
expect(sub_districtField).toBeTruthy()
// Set value
act(() => {
if (phoneField && districtField && sub_districtField) {
phoneField.props.updateValue("081")
districtField.props.updateValue("")
sub_districtField.props.updateValue("")
}
})
expect(formPage.toJSON()).toMatchSnapshot()
const submit = formPage.root.find(elem => elem.props.id === "submit")
act(async () => {
submit.props.onPress()
})
});
})
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment