From 18e8e202067dc2cc211c4d79c35770d53bd3a02b Mon Sep 17 00:00:00 2001 From: Bogdan Bodnar Date: Tue, 27 Aug 2019 15:28:29 +0200 Subject: [PATCH] Set tests. --- jest.config.js | 18 +-- src/api/hooks.js | 12 +- src/bootstrap/Checkbox.js | 42 +++--- src/bootstrap/Spinner.js | 48 ++++--- src/bootstrap/__tests__/Button.test.js | 2 +- src/bootstrap/__tests__/Checkbox.test.js | 6 +- src/bootstrap/__tests__/NumberInput.test.js | 2 +- src/bootstrap/__tests__/PasswordInput.test.js | 2 +- src/bootstrap/__tests__/RadioSet.test.js | 2 +- src/bootstrap/__tests__/Select.test.js | 2 +- src/bootstrap/__tests__/TextInput.test.js | 2 +- src/form/__tests__/SubmitButton.test.js | 2 +- src/form/__tests__/hooks.test.js | 85 ++++++------ src/form/components/SubmitButton.js | 44 +++--- src/form/hooks.js | 125 +++++++++--------- src/testUtils/__mocks__/axios.js | 9 ++ src/testUtils/customTestRender.js | 9 +- src/testUtils/setup.js | 2 - 18 files changed, 215 insertions(+), 199 deletions(-) create mode 100644 src/testUtils/__mocks__/axios.js diff --git a/jest.config.js b/jest.config.js index 1aa12ae..59140bf 100644 --- a/jest.config.js +++ b/jest.config.js @@ -8,20 +8,20 @@ // https://jestjs.io/docs/en/configuration.html module.exports = { moduleDirectories: [ - 'node_modules', - '/src/testUtils', - '/src/', + "node_modules", + "/src/testUtils", + "/src/", ], clearMocks: true, - collectCoverageFrom: ['src/**/*.{js,jsx}'], - coverageDirectory: 'coverage', - testPathIgnorePatterns: ['/node_modules/', '/__fixtures__/'], + collectCoverageFrom: ["src/**/*.{js,jsx}"], + coverageDirectory: "coverage", + testPathIgnorePatterns: ["/node_modules/", "/__fixtures__/"], verbose: false, setupFilesAfterEnv: [ - '@testing-library/react/cleanup-after-each', - '/src/testUtils/setupTest', + "@testing-library/react/cleanup-after-each", + "/src/testUtils/setup", ], globals: { - TZ: 'utc', + TZ: "utc", }, }; diff --git a/src/api/hooks.js b/src/api/hooks.js index 4a47fde..cd62851 100644 --- a/src/api/hooks.js +++ b/src/api/hooks.js @@ -8,7 +8,7 @@ import axios from "axios"; import { useCallback, useReducer } from "react"; -import { ForisUrls } from "forisUrls"; +import { ForisURLs } from "forisUrls"; const POST_HEADERS = { @@ -57,7 +57,7 @@ const APIGetReducer = (state, action) => { data: action.payload, }; case API_ACTIONS.FAILURE: - if (action.status === 403) window.location.assign(ForisUrls.login); + if (action.status === 403) window.location.assign(ForisURLs.login); return { ...state, isLoading: false, @@ -69,18 +69,12 @@ const APIGetReducer = (state, action) => { } }; -/** - * This function adds one to its input. - * @returns {number} that number, plus one. - * @param url - */ export function useAPIGet(url) { const [state, dispatch] = useReducer(APIGetReducer, { isLoading: false, isError: false, data: null, }); - const get = useCallback(async () => { dispatch({ type: API_ACTIONS.INIT }); try { @@ -118,7 +112,7 @@ const APIPostReducer = (state, action) => { data: action.payload, }; case API_ACTIONS.FAILURE: - if (action.status === 403) window.location.assign(ForisUrls.login); + if (action.status === 403) window.location.assign(ForisURLs.login); return { ...state, isSending: false, diff --git a/src/bootstrap/Checkbox.js b/src/bootstrap/Checkbox.js index f198b81..02f336c 100644 --- a/src/bootstrap/Checkbox.js +++ b/src/bootstrap/Checkbox.js @@ -5,11 +5,11 @@ * See /LICENSE for more information. */ -import React from 'react'; -import PropTypes from 'prop-types'; -import {useUID} from 'react-uid'; +import React from "react"; +import PropTypes from "prop-types"; +import { useUID } from "react-uid"; -import {formFieldsSize} from './constants'; +import { formFieldsSize } from "./constants"; CheckBox.propTypes = { /** Label message */ @@ -19,28 +19,32 @@ CheckBox.propTypes = { /** Apply default size (full-width) */ useDefaultSize: PropTypes.bool, /** Control if checkbox is clickable */ - disabled: PropTypes.bool + disabled: PropTypes.bool, }; CheckBox.defaultProps = { useDefaultSize: true, - disabled: false + disabled: false, }; -export function CheckBox({label, helpText, useDefaultSize, disabled, ...props}) { +export function CheckBox({ + label, helpText, useDefaultSize, disabled, ...props +}) { const uid = useUID(); - return
-
- +
+ - + {...props} + /> + +
+ {helpText ? {helpText} : null}
- {helpText ? {helpText} : null} -
+ ); } diff --git a/src/bootstrap/Spinner.js b/src/bootstrap/Spinner.js index cefc345..c45776a 100644 --- a/src/bootstrap/Spinner.js +++ b/src/bootstrap/Spinner.js @@ -5,36 +5,42 @@ * See /LICENSE for more information. */ -import React from 'react'; -import PropTypes from 'prop-types'; +import React from "react"; +import PropTypes from "prop-types"; Spinner.propTypes = { /** Children components put into `div` with "spinner-text" class. */ children: PropTypes.oneOfType([ PropTypes.arrayOf(PropTypes.node), - PropTypes.node + PropTypes.node, ]), /** Render component with full-screen mode (using apropriate `.css` styles) */ fullScreen: PropTypes.bool.isRequired, - className: PropTypes.string + className: PropTypes.string, }; Spinner.defaultProps = { fullScreen: false, }; -export function Spinner({fullScreen, children, className, ...props}) { +export function Spinner({ + fullScreen, children, className, ...props +}) { if (!fullScreen) { - return
- {children} -
; + return ( +
+ {children} +
+ ); } - return
-
- {children} + return ( +
+
+ {children} +
-
+ ); } SpinnerElement.propTypes = { @@ -43,15 +49,17 @@ SpinnerElement.propTypes = { /** Children components */ children: PropTypes.oneOfType([ PropTypes.arrayOf(PropTypes.node), - PropTypes.node + PropTypes.node, ]), }; -export function SpinnerElement({small, children}) { - return <> -
- -
-
{children}
- +export function SpinnerElement({ small, children }) { + return ( + <> +
+ +
+
{children}
+ + ); } diff --git a/src/bootstrap/__tests__/Button.test.js b/src/bootstrap/__tests__/Button.test.js index 08684fd..e42ddc9 100644 --- a/src/bootstrap/__tests__/Button.test.js +++ b/src/bootstrap/__tests__/Button.test.js @@ -9,7 +9,7 @@ import React from 'react'; import {render} from 'customTestRender'; -import Button from '../Button' +import {Button} from '../Button' describe('; + {...props} + > + {labelSubmitButton} + + ); } diff --git a/src/form/hooks.js b/src/form/hooks.js index fd12c1b..ebeb326 100644 --- a/src/form/hooks.js +++ b/src/form/hooks.js @@ -5,87 +5,86 @@ * See /LICENSE for more information. */ -import {useCallback, useEffect, useReducer} from 'react'; -import update from 'immutability-helper'; +import { useCallback, useEffect, useReducer } from "react"; +import update from "immutability-helper"; -import {useAPIGet} from 'api/hooks'; -import {useWSForisModule} from 'webSockets/hooks'; +import { useAPIGet } from "api/hooks"; +import { useWSForisModule } from "webSockets/hooks"; -export function useForm(validator, prepData) { - const [state, dispatch] = useReducer(formReducer, { - data: null, - initialData: null, - errors: {}, - }); - - const onFormReload = useCallback(data => { - dispatch({ - type: FORM_ACTIONS.resetData, - data: data, - prepData: prepData, - validator: validator, - }); - }, [prepData, validator]); - - const onFormChangeHandler = useCallback(updateRule => - event => { - dispatch({ - type: FORM_ACTIONS.updateValue, - value: getChangedValue(event.target), - updateRule: updateRule, - validator: validator, - }) - }, [validator]); - - return [ - state, - onFormChangeHandler, - onFormReload, - ] -} - const FORM_ACTIONS = { updateValue: 1, resetData: 2, }; +export function useForm(validator, prepData) { + + const [state, dispatch] = useReducer(formReducer, { + data: null, + initialData: null, + errors: {}, + }); + + const onFormReload = useCallback((data) => { + dispatch({ + type: FORM_ACTIONS.resetData, + data, + prepData, + validator, + }); + }, [prepData, validator]); + + const onFormChangeHandler = useCallback((updateRule) => (event) => { + dispatch({ + type: FORM_ACTIONS.updateValue, + value: getChangedValue(event.target), + updateRule, + validator, + }); + }, [validator]); + return [ + state, + onFormChangeHandler, + onFormReload, + ]; +} + + function formReducer(state, action) { switch (action.type) { - case FORM_ACTIONS.updateValue: { - const newData = update(state.data, action.updateRule(action.value)); - const errors = action.validator(newData); - return { - ...state, - data: newData, - errors: errors - }; - } - case FORM_ACTIONS.resetData: { - if (!action.data) - return {...state, initialData: state.data}; - const prepData = action.prepData ? action.prepData(action.data) : action.data; - return { - data: prepData, - initialData: prepData, - errors: action.data ? action.validator(prepData) : undefined, - }; - } - default: { - throw new Error(); - } + case FORM_ACTIONS.updateValue: { + const newData = update(state.data, action.updateRule(action.value)); + const errors = action.validator(newData); + return { + ...state, + data: newData, + errors, + }; + } + case FORM_ACTIONS.resetData: { + if (!action.data) return { ...state, initialData: state.data }; + const prepData = action.prepData ? action.prepData(action.data) : action.data; + return { + data: prepData, + initialData: prepData, + errors: action.data ? action.validator(prepData) : undefined, + }; + } + default: { + throw new Error(); + } } } function getChangedValue(target) { - let value = target.value; - if (target.type === 'checkbox') { + let { value } = target; + if (target.type === "checkbox") { value = target.checked; - } else if (target.type === 'number') { + } else if (target.type === "number") { const parsedValue = parseInt(value); value = isNaN(parsedValue) ? value : parsedValue; } - return value + return value; } export function useForisModule(ws, config) { diff --git a/src/testUtils/__mocks__/axios.js b/src/testUtils/__mocks__/axios.js new file mode 100644 index 0000000..cda0519 --- /dev/null +++ b/src/testUtils/__mocks__/axios.js @@ -0,0 +1,9 @@ +/* + * Copyright (C) 2019 CZ.NIC z.s.p.o. (http://www.nic.cz/) + * + * This is free software, licensed under the GNU General Public License v3. + * See /LICENSE for more information. + */ + +import mockAxios from "jest-mock-axios"; +export default mockAxios; diff --git a/src/testUtils/customTestRender.js b/src/testUtils/customTestRender.js index 35366d5..ee927de 100644 --- a/src/testUtils/customTestRender.js +++ b/src/testUtils/customTestRender.js @@ -10,6 +10,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import {UIDReset} from 'react-uid'; +import {StaticRouter} from 'react-router'; import {render} from '@testing-library/react' Wrapper.propTypes = { @@ -20,9 +21,11 @@ Wrapper.propTypes = { }; function Wrapper({children}) { - return - {children} - + return + + {children} + + } const customTestRender = (ui, options) => render(ui, {wrapper: Wrapper, ...options}); diff --git a/src/testUtils/setup.js b/src/testUtils/setup.js index 52e99f1..af4800b 100644 --- a/src/testUtils/setup.js +++ b/src/testUtils/setup.js @@ -28,5 +28,3 @@ jest.doMock('moment', () => { }); Date.now = jest.fn(() => new Date(Date.UTC(2019, 1, 1, 12, 13, 14)).valueOf()); - -jest.doMock("utils/vfs_fonts", () => ({}));