diff --git a/jest.config.js b/jest.config.js index 40f5d28..7417b5a 100644 --- a/jest.config.js +++ b/jest.config.js @@ -1,35 +1,30 @@ -const { foremanLocation, foremanRelativePath } = require('@theforeman/find-foreman') +const tfmConfig = require('@theforeman/test/src/pluginConfig'); +const { + foremanRelativePath, + foremanLocation, +} = require('@theforeman/find-foreman'); + const foremanReactRelative = 'webpack/assets/javascripts/react_app'; const foremanFull = foremanLocation(); const foremanReactFull = foremanRelativePath(foremanReactRelative); -// Jest configuration -module.exports = { - testURL: 'http://localhost/', - setupFiles: [ - './webpack/test_setup.js', - ], - setupFilesAfterEnv: [ - './webpack/global_test_setup.js', - '@testing-library/jest-dom' - ], - testPathIgnorePatterns: [ - '/node_modules/', - '/foreman/', - '/.+fixtures.+', - '/engines', - ], - moduleDirectories: [ - `${foremanFull}/node_modules`, - `${foremanFull}/node_modules/@theforeman/vendor-core/node_modules`, - 'node_modules', - 'webpack/test-utils', - ], - modulePathIgnorePatterns: [ - '/foreman/', - ], - moduleNameMapper: { - '^.+\\.(css|scss)$': 'identity-obj-proxy', - '^foremanReact(.*)$': `${foremanReactFull}/$1`, - }, -}; +// Find correct path to foremanReact so we do not have to mock it in tests +tfmConfig.moduleNameMapper['^foremanReact(.*)$'] = `${foremanReactFull}/$1`; + +tfmConfig.setupFiles = ['./webpack/test_setup.js']; +tfmConfig.setupFilesAfterEnv = [ + './webpack/global_test_setup.js', + '@testing-library/jest-dom', +]; + +// Do not use default resolver +tfmConfig.resolver = null; +// Specify module dirs instead +tfmConfig.moduleDirectories = [ + `${foremanFull}/node_modules`, + `${foremanFull}/node_modules/@theforeman/vendor-core/node_modules`, + 'node_modules', + 'webpack/test-utils', +]; + +module.exports = tfmConfig; diff --git a/webpack/components/ResourceQuotaForm/components/Properties/StatusPropertiesLabel.test.js b/webpack/components/ResourceQuotaForm/components/Properties/StatusPropertiesLabel.test.js new file mode 100644 index 0000000..6574901 --- /dev/null +++ b/webpack/components/ResourceQuotaForm/components/Properties/StatusPropertiesLabel.test.js @@ -0,0 +1,50 @@ +/* eslint-disable promise/prefer-await-to-then */ +// Configure Enzyme +import { mount } from '@theforeman/test'; +import React from 'react'; +import { Provider } from 'react-redux'; +import store from 'foremanReact/redux'; +import LabelIcon from 'foremanReact/components/common/LabelIcon'; +import StatusPropertiesLabel from './StatusPropertiesLabel'; + +const defaultProps = { + color: 'blue', + iconChild: , + statusContent: 'some content', + linkUrl: '/test/link', + tooltipText: 'Some nice tooltip', +}; + +describe('StatusPropertiesLabel', () => { + const wrapper = mount( + + + + ); + + it('includes components', () => { + expect(wrapper.find('Tooltip').exists()).toBe(true); + expect(wrapper.find('Tooltip')).toHaveLength(1); + expect(wrapper.find('Label').exists()).toBe(true); + expect(wrapper.find('Label')).toHaveLength(1); + expect(wrapper.find('Link').exists()).toBe(true); + expect(wrapper.find('Link')).toHaveLength(1); + }); + + it('passes properties', () => { + // ToolTip + const tooltip = wrapper.find('Tooltip'); + expect(tooltip.props()).toHaveProperty('content'); + expect(tooltip.prop('content')).toContain(defaultProps.tooltipText); + // Label + const label = wrapper.find('Label'); + expect(label.props()).toHaveProperty('icon'); + expect(label.prop('icon')).toEqual(defaultProps.iconChild); + expect(label.props()).toHaveProperty('color'); + expect(label.prop('color')).toEqual(defaultProps.color); + // Link + const link = wrapper.find('Link'); + expect(link.props()).toHaveProperty('to'); + expect(link.prop('to')).toEqual(defaultProps.linkUrl); + }); +}); diff --git a/webpack/lib/EditableTextInput/EditableTextInput.js b/webpack/lib/EditableTextInput/EditableTextInput.js index 9c9aea8..918cea9 100644 --- a/webpack/lib/EditableTextInput/EditableTextInput.js +++ b/webpack/lib/EditableTextInput/EditableTextInput.js @@ -58,16 +58,14 @@ const EditableTextInput = ({ setCurrentAttribute(attribute); }; - const onSubmit = async event => { - if (!event.shiftKey) { - setEditing(false); - if (isPassword) { - if (inputValue?.length > 0) { - setPasswordPlaceholder(PASSWORD_MASK); - } + const onSubmit = async () => { + setEditing(false); + if (isPassword) { + if (inputValue?.length > 0) { + setPasswordPlaceholder(PASSWORD_MASK); } - await onEdit(inputValue, attribute); } + await onEdit(inputValue, attribute); }; const onClear = () => { diff --git a/webpack/lib/EditableTextInput/__tests__/editableTextInput.test.js b/webpack/lib/EditableTextInput/__tests__/editableTextInput.test.js index 20a914f..a24b849 100644 --- a/webpack/lib/EditableTextInput/__tests__/editableTextInput.test.js +++ b/webpack/lib/EditableTextInput/__tests__/editableTextInput.test.js @@ -5,7 +5,7 @@ import { render, patientlyWaitFor, fireEvent, -} from './react-testing-lib-wrapper'; +} from '../../react-testing-lib-wrapper'; import EditableTextInput from '../EditableTextInput'; const actualValue = 'burger'; @@ -38,15 +38,14 @@ test('Passed function is called after editing and hitting enter', async () => { ); getByLabelText(`edit ${attribute}`).click(); - const textInputLabel = `${attribute} text input`; - fireEvent.change(getByLabelText(textInputLabel), { + const textInputLabel = getByLabelText(`${attribute} text input`); + fireEvent.change(textInputLabel, { target: { value: actualValue }, }); - fireEvent.keyUp(getByLabelText(textInputLabel), { + fireEvent.keyUp(textInputLabel, { key: 'Enter', code: 'Enter', }); - await patientlyWaitFor(() => expect(mockEdit.mock.calls).toHaveLength(1)); expect(head(mockEdit.mock.calls)).toContain(actualValue); // first arg }); diff --git a/webpack/lib/EditableTextInput/__tests__/react-testing-lib-wrapper.js b/webpack/lib/react-testing-lib-wrapper.js similarity index 100% rename from webpack/lib/EditableTextInput/__tests__/react-testing-lib-wrapper.js rename to webpack/lib/react-testing-lib-wrapper.js