Fix tests

Signed-off-by: soupette <cyril@strapi.io>
This commit is contained in:
soupette 2021-08-26 15:35:47 +02:00
parent 38b012f227
commit ae87bafccd
6 changed files with 18 additions and 113 deletions

View File

@ -11,9 +11,7 @@ import { ThemeProvider, lightTheme } from '@strapi/parts';
import Input from '../index';
const messages = {
en: {
'users-permissions.component.name': 'Input',
},
en: {},
};
describe('<Input />', () => {
@ -26,8 +24,10 @@ describe('<Input />', () => {
<Input
intlLabel={{ id: 'enabled', defaultMessage: 'Enabled' }}
name="test"
onChange={jest.fn()}
providerToEditName="email"
type="text"
value="test"
/>
</ThemeProvider>
</IntlProvider>
@ -172,9 +172,10 @@ describe('<Input />', () => {
aria-invalid="false"
class="c6"
id="textinput-1"
name="test"
placeholder=""
type="text"
value=""
value="test"
/>
</div>
</div>

View File

@ -24,6 +24,8 @@ describe('<FormModal />', () => {
isOpen={false}
onToggle={jest.fn()}
headerBreadcrumbs={['Edit', 'Email']}
onSubmit={jest.fn()}
isSubmiting={false}
/>
</IntlProvider>
);

View File

@ -5,10 +5,7 @@ import reducer, { initialState } from './reducer';
const useUserForm = (endPoint, permissions) => {
const { isLoading: isLoadingForPermissions, allowedActions } = useRBAC(permissions);
const [{ formErrors, initialData, isLoading, modifiedData }, dispatch] = useReducer(
reducer,
initialState
);
const [{ isLoading, modifiedData }, dispatch] = useReducer(reducer, initialState);
const toggleNotification = useNotification();
const isMounted = useRef(true);
@ -54,24 +51,6 @@ const useUserForm = (endPoint, permissions) => {
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [isLoadingForPermissions, endPoint]);
const handleChange = useCallback(({ target: { name, value } }) => {
dispatch({
type: 'ON_CHANGE',
keys: name,
value,
});
}, []);
const dispatchResetForm = useCallback(() => {
dispatch({
type: 'RESET_FORM',
});
}, []);
const dispatchSetFormErrors = useCallback(errors => {
dispatch({ type: 'SET_ERRORS', errors });
}, []);
const dispatchSubmitSucceeded = useCallback(data => {
dispatch({
type: 'ON_SUBMIT_SUCCEEDED',
@ -81,13 +60,7 @@ const useUserForm = (endPoint, permissions) => {
return {
allowedActions,
dispatch,
dispatchResetForm,
dispatchSetFormErrors,
dispatchSubmitSucceeded,
formErrors,
handleChange,
initialData,
isLoading,
isLoadingForPermissions,
modifiedData,

View File

@ -1,10 +1,7 @@
import produce from 'immer';
import { set } from 'lodash';
const initialState = {
formErrors: {},
isLoading: true,
initialData: {},
modifiedData: {},
};
@ -14,15 +11,12 @@ const reducer = (state, action) =>
switch (action.type) {
case 'GET_DATA': {
draftState.isLoading = true;
draftState.initialData = {};
draftState.modifiedData = {};
break;
}
case 'GET_DATA_SUCCEEDED': {
draftState.isLoading = false;
draftState.initialData = action.data;
draftState.modifiedData = action.data;
break;
@ -31,23 +25,9 @@ const reducer = (state, action) =>
draftState.isLoading = true;
break;
}
case 'ON_CHANGE': {
set(draftState, ['modifiedData', ...action.keys.split('.')], action.value);
break;
}
case 'ON_SUBMIT_SUCCEEDED': {
draftState.initialData = action.data;
draftState.modifiedData = action.data;
// draftState.formErrors = {};
break;
}
case 'RESET_FORM': {
draftState.modifiedData = state.initialData;
// draftState.formErrors = {};
break;
}
case 'SET_ERRORS': {
draftState.formErrors = action.errors;
break;
}
default: {

View File

@ -6,9 +6,7 @@ describe('USERS PERMISSIONS | HOOKS | useForm | reducer', () => {
beforeEach(() => {
state = {
formErrors: {},
isLoading: true,
initialData: {},
modifiedData: {},
};
});
@ -28,12 +26,10 @@ describe('USERS PERMISSIONS | HOOKS | useForm | reducer', () => {
};
state.isLoading = false;
state.initialData = true;
state.modifiedData = true;
const expected = produce(state, draft => {
draft.isLoading = true;
draft.initialData = {};
draft.modifiedData = {};
});
@ -61,7 +57,6 @@ describe('USERS PERMISSIONS | HOOKS | useForm | reducer', () => {
const expected = produce(state, draft => {
draft.isLoading = false;
draft.initialData = data;
draft.modifiedData = data;
});
@ -85,67 +80,14 @@ describe('USERS PERMISSIONS | HOOKS | useForm | reducer', () => {
});
});
describe('ON_CHANGE', () => {
it('should change the data correctly', () => {
state.modifiedData = { from: { name: 'test' }, test: 'test' };
const action = {
type: 'ON_CHANGE',
keys: 'from.name',
value: 'test@test.io',
};
const expected = produce(state, draft => {
draft.modifiedData = {
from: { name: 'test@test.io' },
test: 'test',
};
});
expect(reducer(state, action)).toEqual(expected);
});
});
describe('ON_SUBMIT_SUCCEEDED', () => {
it('should set the initialData object with the modifiedData', () => {
state.initialData = { test: true };
state.modifiedData = { test: false };
state.formErrors = { ok: true };
const action = { type: 'ON_SUBMIT_SUCCEEDED' };
const action = { type: 'ON_SUBMIT_SUCCEEDED', data: { test: true, foo: 'bar' } };
const expected = produce(state, draft => {
draft.initialData = { test: false };
draft.formErrors = {};
});
expect(reducer(state, action)).toEqual(expected);
});
});
describe('RESET_FORM', () => {
it('should set the modifiedData object with the initialData', () => {
state.initialData = { test: true };
state.modifiedData = { test: false };
state.formErrors = { ok: true };
const action = { type: 'RESET_FORM' };
const expected = produce(state, draft => {
draft.modifiedData = { test: true };
draft.formErrors = {};
});
expect(reducer(state, action)).toEqual(expected);
});
});
describe('SET_ERRORS', () => {
it('should set the formErrors correctly', () => {
const action = { type: 'SET_ERRORS', errors: { test: true } };
const expected = produce(state, draft => {
draft.formErrors = { test: true };
draft.modifiedData = { test: true, foo: 'bar' };
});
expect(reducer(state, action)).toEqual(expected);

View File

@ -9,6 +9,13 @@ jest.mock('../../../hooks', () => ({
useForm: jest.fn(),
}));
jest.mock('@strapi/helper-plugin', () => ({
...jest.requireActual('@strapi/helper-plugin'),
useTracking: jest.fn(() => ({ trackUsage: jest.fn() })),
useNotification: jest.fn(),
useOverlayBlocker: jest.fn(() => ({ lockApp: jest.fn(), unlockApp: jest.fn() })),
}));
const App = (
<ThemeProvider theme={lightTheme}>
<IntlProvider locale="en" messages={{ en: {} }} textComponent="span">