Merge pull request #278 from rvsia/addMissingTests

Add missing tests

Author: Hyperkid123

.circleci/config.yml

@@ -22,6 +22,7 @@ jobs:
           command: yarn test:ci
       - codecov/upload:
           file: coverage/*.json
+          token: aa1b6b4d-79a1-49f6-bcb2-d6069134a772
       - persist_to_workspace:
           root: ~/react-forms
           paths:

packages/mui-component-mapper/src/tests/demo-test.test.js

@@ -0,0 +1,14 @@
+import { validationError } from '../form-fields/helpers';
+
+describe('form fields helpers', () => {
+  describe('validationError', () => {
+    it('returns meta.error when validateOnMount', () => {
+      expect(validationError({ error: 'error' }, true)).toEqual('error');
+    });
+
+    it('returns meta.error || meta.touched when validateOnMount', () => {
+      expect(validationError({ error: 'error', touched: false }, false)).toEqual(false);
+      expect(validationError({ error: 'error', touched: true }, false)).toEqual('error');
+    });
+  });
+});

packages/mui-component-mapper/src/tests/helpers.test.js

@@ -0,0 +1,25 @@
+import React from 'react';
+import { mount } from 'enzyme';
+import Typography from '@material-ui/core/Typography';
+
+import PlainText from '../form-fields/plain-text';
+
+describe('PlainText component', () => {
+  it('renders correctly with three paragraphs', () => {
+    const label = 'One \n Two \n Three';
+    const name = 'name';
+
+    const wrapper = mount(<PlainText name={ name } label={ label }/>);
+
+    expect(wrapper.find(Typography)).toHaveLength(3);
+  });
+
+  it('renders correctly with one paragraphs', () => {
+    const label = 'One';
+    const name = 'name';
+
+    const wrapper = mount(<PlainText name={ name } label={ label }/>);
+
+    expect(wrapper.find(Typography)).toHaveLength(1);
+  });
+});

packages/mui-component-mapper/src/tests/plain-text.test.js

@@ -0,0 +1,67 @@
+import React from 'react';
+import { mount } from 'enzyme';
+import Grid from '@material-ui/core/Grid';
+import Typography from '@material-ui/core/Typography';
+
+import Subform from '../form-fields/sub-form';
+
+describe('subform', () => {
+  const props = {
+    fields: [
+      {
+        key: 'cosiKey',
+        title: 'cosiTitle',
+        name: 'cosiName',
+        fields: [],
+      },
+      {
+        key: 'cosiKey2',
+        title: 'cosiTitle2',
+        name: 'cosiName2',
+        fields: [],
+      },
+    ],
+    formOptions: {
+      renderForm: jest.fn().mockImplementation(() => <h1>Content</h1>),
+    },
+  };
+
+  const TITLE = 'TIIIITLE';
+  const DESCRIPTION = 'THIS IS DESCRIPTION';
+
+  it('should render correctly', () => {
+    const wrapper = mount(<Subform { ...props } />);
+
+    expect(wrapper.find(Grid)).toHaveLength(2);
+    expect(wrapper.find(Typography)).toHaveLength(0);
+    expect(wrapper.find('h1')).toHaveLength(1);
+  });
+
+  it('should render correctly with title', () => {
+    const wrapper = mount(<Subform { ...props } title={ TITLE }/>);
+
+    expect(wrapper.find(Grid)).toHaveLength(3);
+    expect(wrapper.find(Typography)).toHaveLength(1);
+    expect(wrapper.find(Typography).text().includes(TITLE)).toEqual(true);
+    expect(wrapper.find('h1')).toHaveLength(1);
+  });
+
+  it('should render correctly with description', () => {
+    const wrapper = mount(<Subform { ...props } description={ DESCRIPTION }/>);
+
+    expect(wrapper.find(Grid)).toHaveLength(3);
+    expect(wrapper.find(Typography)).toHaveLength(1);
+    expect(wrapper.find(Typography).text().includes(DESCRIPTION)).toEqual(true);
+    expect(wrapper.find('h1')).toHaveLength(1);
+  });
+
+  it('should render correctly with title and description', () => {
+    const wrapper = mount(<Subform { ...props } title={ TITLE } description={ DESCRIPTION }/>);
+
+    expect(wrapper.find(Grid)).toHaveLength(4);
+    expect(wrapper.find(Typography)).toHaveLength(2);
+    expect(wrapper.find(Typography).first().text().includes(TITLE)).toEqual(true);
+    expect(wrapper.find(Typography).last().text().includes(DESCRIPTION)).toEqual(true);
+    expect(wrapper.find('h1')).toHaveLength(1);
+  });
+});

packages/mui-component-mapper/src/tests/subform.test.js

@@ -0,0 +1,48 @@
+import React from 'react';
+import { mount } from 'enzyme';
+import AppBar from '@material-ui/core/AppBar';
+import Tabs from '@material-ui/core/Tabs';
+import Tab from '@material-ui/core/Tab';
+
+import FormTabs from '../form-fields/tabs';
+
+describe('tabs', () => {
+  const props = {
+    fields: [
+      {
+        key: 'cosiKey',
+        title: 'cosiTitle',
+        name: 'cosiName',
+        fields: [],
+      },
+      {
+        key: 'cosiKey2',
+        title: 'cosiTitle2',
+        name: 'cosiName2',
+        fields: [],
+      },
+    ],
+    formOptions: {
+      renderForm: jest.fn().mockImplementation(() => <h1>Content</h1>),
+    },
+  };
+
+  it('should render tabs correctly', () => {
+    const wrapper = mount(<FormTabs { ...props } />);
+
+    expect(wrapper.find(AppBar)).toHaveLength(1);
+    expect(wrapper.find(Tabs)).toHaveLength(1);
+    expect(wrapper.find(Tab)).toHaveLength(2);
+    expect(wrapper.find('h1')).toHaveLength(1);
+  });
+
+  it('should switch tabs correctly', () => {
+    const wrapper = mount(<FormTabs { ...props } />);
+    expect(wrapper.instance().state.activeTab).toEqual(0);
+
+    const secondTabButton = wrapper.find('button').last();
+    secondTabButton.simulate('click');
+
+    expect(wrapper.instance().state.activeTab).toEqual(1);
+  });
+});

packages/mui-component-mapper/src/tests/tabs.test.js

@@ -11,10 +11,20 @@ import {
   SwitchField,
 } from '../form-fields/form-fields';
 import { mount, shallow } from 'enzyme';
-
-const FieldProvider = ({ render, ...props }) => <div>{ render({ input: { name: 'Foo', onChange: jest.fn() }, meta: { error: false, touched: false }, ...props }) }</div>;
+import { Radio, Checkbox } from '@patternfly/react-core';
 
 describe('FormFields', () => {
+  let FieldProvider;
+  let onChangeSpy;
+
+  beforeEach(() => {
+    onChangeSpy = jest.fn();
+
+    FieldProvider = ({ render, ...props }) => <div>
+      { render({ input: { name: 'Foo', onChange: onChangeSpy }, meta: { error: false, touched: false }, ...props }) }
+    </div>;
+  });
+
   const props = {
     input: {
       name: 'Name of the field',
@@ -91,6 +101,18 @@ describe('FormFields', () => {
     expect(toJson(wrapper)).toMatchSnapshot();
   });
 
+  it('Multiple checkbox - should call on change correctly', () => {
+    const wrapper = mount(
+      <CheckboxField { ...propsWithOptions } FieldProvider={ FieldProvider } />
+    );
+
+    expect(onChangeSpy).not.toHaveBeenCalled();
+
+    wrapper.find(Checkbox).first().props().onChange();
+
+    expect(onChangeSpy).toHaveBeenCalled();
+  });
+
   it('should render TextArea correctly', () => {
     const wrapper = mount(
       <TextAreaField { ...props } />
@@ -119,6 +141,16 @@ describe('FormFields', () => {
     expect(toJson(wrapper)).toMatchSnapshot();
   });
 
+  it('radio - should call fieldProvider onChange correctly', () => {
+    const wrapper = mount(
+      <RadioField { ...propsWithOptions } FieldProvider={ FieldProvider } disabled={ true } />
+    );
+
+    wrapper.find(Radio).first().props().onChange();
+
+    expect(onChangeSpy).toHaveBeenCalled();
+  });
+
   it('should render Select correctly', () => {
     const wrapper = shallow(
       <SelectField { ...propsWithOptions } />

packages/pf4-component-mapper/src/tests/form-fields.test.js

@@ -0,0 +1,27 @@
+import React from 'react';
+import { mount } from 'enzyme';
+import { TextContent, Text } from '@patternfly/react-core';
+
+import PlainText from '../form-fields/plain-text';
+
+describe('PlainText component', () => {
+  it('renders correctly with three paragraphs', () => {
+    const label = 'One \n Two \n Three';
+    const name = 'name';
+
+    const wrapper = mount(<PlainText name={ name } label={ label }/>);
+
+    expect(wrapper.find(TextContent)).toHaveLength(1);
+    expect(wrapper.find(Text)).toHaveLength(3);
+  });
+
+  it('renders correctly with one paragraphs', () => {
+    const label = 'One';
+    const name = 'name';
+
+    const wrapper = mount(<PlainText name={ name } label={ label }/>);
+
+    expect(wrapper.find(TextContent)).toHaveLength(1);
+    expect(wrapper.find(Text)).toHaveLength(1);
+  });
+});

packages/pf4-component-mapper/src/tests/plain-text.spec.js

@@ -3,6 +3,7 @@ import { mount } from 'enzyme';
 import toJSon from 'enzyme-to-json';
 
 import FormRenderer, { componentTypes, validatorTypes } from '@data-driven-forms/react-form-renderer';
+import * as enterHandle from '@data-driven-forms/common/src/wizard/enter-handler';
 
 import { formFieldsMapper, layoutMapper } from '../../index';
 import Wizard from '../../form-fields/wizard/wizard';
@@ -149,6 +150,33 @@ describe('<Wizard />', () => {
     expect(toJSon(wrapper)).toMatchSnapshot();
   });
 
+  it('should call enter handler when pressing enter', () => {
+    enterHandle.default = jest.fn();
+
+    const wrapper = mount(<Wizard { ...initialProps } />);
+
+    expect(enterHandle.default).not.toHaveBeenCalled();
+
+    const wizard = wrapper.find('.pf-c-wizard');
+
+    const event = { someEvent: true };
+    const formOptions = expect.any(Object);
+    const handleNext = expect.any(Function);
+    const handleSubmit = expect.any(Function);
+    const findCurrentStep = expect.any(Function);
+
+    wizard.props().onKeyDown(event);
+
+    expect(enterHandle.default).toHaveBeenCalledWith(
+      event,
+      formOptions,
+      '1',
+      findCurrentStep,
+      handleNext,
+      handleSubmit
+    );
+  });
+
   it('should render correctly in modal and unmount', () => {
     const wrapper = mount(<Wizard inModal { ...initialProps } />);
     expect(toJSon(wrapper)).toMatchSnapshot();

packages/pf4-component-mapper/src/tests/wizard/wizard.test.js

@@ -87,9 +87,9 @@ FieldProvider.propTypes = {
     getFieldState: PropTypes.func,
     clearedValue: PropTypes.any,
   }),
-  component: PropTypes.oneOfType(PropTypes.node, PropTypes.element, PropTypes.func),
+  component: PropTypes.oneOfType([ PropTypes.node, PropTypes.element, PropTypes.func ]),
   render: PropTypes.func,
-  children: PropTypes.oneOfType(PropTypes.node, PropTypes.element, PropTypes.func),
+  children: PropTypes.oneOfType([ PropTypes.node, PropTypes.element, PropTypes.func ]),
   dataType: PropTypes.oneOf(Object.values(dataTypes)),
   name: PropTypes.string,
   clearOnUnmount: PropTypes.bool,