react-openfin-mat-impl/components/ConfigComp/ConfigField.spec.js

Materialize UI implementation of react-openfin

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const React = require("react");
const react_openfin_1 = require("react-openfin");
const enzyme_to_json_1 = require("enzyme-to-json");
const styles_1 = require("@material-ui/core/styles");
const styles_2 = require("@material-ui/styles");
const test_utils_1 = require("@material-ui/core/test-utils");
// import {
//     DateTimePicker,
// } from '@material-ui/pickers';
const TextField_1 = require("@material-ui/core/TextField");
const ConfigField_1 = require("./ConfigField");
const theme = styles_1.createMuiTheme({});
describe('ConfigField comp', () => {
    let shallow;
    let mount;
    beforeEach(() => {
        mount = test_utils_1.createMount();
        shallow = test_utils_1.createShallow();
    });
    afterEach(() => {
        mount.cleanUp();
    });
    it('TITLE field renders correctly', () => {
        const onChange = jest.fn();
        const wrapper = shallow(React.createElement(styles_2.ThemeProvider, { theme: theme },
            React.createElement(ConfigField_1.default, { _type: react_openfin_1.FieldType.TITLE, _label: 'label', value: '', onChange: onChange })));
        // const component = wrapper.dive();
        expect(enzyme_to_json_1.default(wrapper)).toMatchSnapshot();
    });
    it('SUBHEADING field renders correctly', () => {
        const onChange = jest.fn();
        const wrapper = shallow(React.createElement(styles_2.ThemeProvider, { theme: theme },
            React.createElement(ConfigField_1.default, { _type: react_openfin_1.FieldType.SUBHEADING, _label: 'label', value: '', onChange: onChange })));
        // const component = wrapper.dive();
        expect(enzyme_to_json_1.default(wrapper)).toMatchSnapshot();
    });
    it('CUSTOM_FIELD field renders correctly', () => {
        const onChange = jest.fn();
        const wrapper = shallow(React.createElement(styles_2.ThemeProvider, { theme: theme },
            React.createElement(ConfigField_1.default, { _type: react_openfin_1.FieldType.CUSTOM_FIELD, _label: 'label', value: '', _custom: React.createElement("span", null, "Custom field"), onChange: onChange })));
        // const component = wrapper.dive();
        expect(enzyme_to_json_1.default(wrapper)).toMatchSnapshot();
    });
    it('CURRENCY field renders correctly', () => {
        const onChange = jest.fn();
        const wrapper = shallow(React.createElement(styles_2.ThemeProvider, { theme: theme },
            React.createElement(ConfigField_1.default, { _type: react_openfin_1.FieldType.CURRENCY, _label: 'label', value: 1, onChange: onChange })));
        // const component = wrapper.dive();
        const comp = enzyme_to_json_1.default(wrapper);
        if (comp.props.id) {
            comp.props.id = 'config_field_id';
        }
        expect(comp).toMatchSnapshot();
    });
    it('CURRENCY field fires onChange correctly', () => {
        const onChange = jest.fn();
        const wrapper = mount(React.createElement(styles_2.ThemeProvider, { theme: theme },
            React.createElement(ConfigField_1.default, { _type: react_openfin_1.FieldType.CURRENCY, _label: 'label', value: 1, onChange: onChange })));
        expect(wrapper.find(TextField_1.default)).toHaveLength(1);
        wrapper.find(TextField_1.default).props().onChange({ target: { value: '2.345' } });
        expect(onChange).toHaveBeenCalled();
    });
    it('STRING field renders correctly', () => {
        const onChange = jest.fn();
        const wrapper = shallow(React.createElement(styles_2.ThemeProvider, { theme: theme },
            React.createElement(ConfigField_1.default, { _type: react_openfin_1.FieldType.STRING, _label: 'label', value: 'string', onChange: onChange })));
        // const component = wrapper.dive();
        const comp = enzyme_to_json_1.default(wrapper);
        if (comp.props.id) {
            comp.props.id = 'config_field_id';
        }
        expect(comp).toMatchSnapshot();
    });
    it('STRING field fires onChange correctly', () => {
        const onChange = jest.fn();
        const wrapper = mount(React.createElement(styles_2.ThemeProvider, { theme: theme },
            React.createElement(ConfigField_1.default, { _type: react_openfin_1.FieldType.STRING, _label: 'label', value: 'str1', onChange: onChange })));
        expect(wrapper.find(TextField_1.default)).toHaveLength(1);
        wrapper.find(TextField_1.default).props().onChange({ target: { value: 'str2' } });
        expect(onChange).toHaveBeenCalled();
    });
    it('NUMBER field renders correctly', () => {
        const onChange = jest.fn();
        const wrapper = shallow(React.createElement(styles_2.ThemeProvider, { theme: theme },
            React.createElement(ConfigField_1.default, { _type: react_openfin_1.FieldType.NUMBER, _label: 'label', value: 1, onChange: onChange })));
        // const component = wrapper.dive();
        const comp = enzyme_to_json_1.default(wrapper);
        if (comp.props.id) {
            comp.props.id = 'config_field_id';
        }
        expect(comp).toMatchSnapshot();
    });
    it('NUMBER field fires onChange correctly', () => {
        const onChange = jest.fn();
        const wrapper = mount(React.createElement(styles_2.ThemeProvider, { theme: theme },
            React.createElement(ConfigField_1.default, { _type: react_openfin_1.FieldType.NUMBER, _label: 'label', value: 1, onChange: onChange })));
        expect(wrapper.find(TextField_1.default)).toHaveLength(1);
        wrapper.find(TextField_1.default).props().onChange({ target: { value: '2' } });
        expect(onChange).toHaveBeenCalled();
    });
    it('DATE field renders correctly', () => {
        const onChange = jest.fn();
        const wrapper = shallow(React.createElement(styles_2.ThemeProvider, { theme: theme },
            React.createElement(ConfigField_1.default, { _type: react_openfin_1.FieldType.DATE, _label: 'label', value: '01/01/1990', onChange: onChange })));
        // const component = wrapper.dive();
        const comp = enzyme_to_json_1.default(wrapper);
        if (comp.props.id) {
            comp.props.id = 'config_field_id';
        }
        expect(comp).toMatchSnapshot();
    });
    it('TIME field renders correctly', () => {
        const onChange = jest.fn();
        const wrapper = shallow(React.createElement(styles_2.ThemeProvider, { theme: theme },
            React.createElement(ConfigField_1.default, { _type: react_openfin_1.FieldType.TIME, _label: 'label', value: new Date('1990-12-17T03:24:00'), onChange: onChange })));
        // const component = wrapper.dive();
        const comp = enzyme_to_json_1.default(wrapper);
        if (comp.props.id) {
            comp.props.id = 'config_field_id';
        }
        expect(comp).toMatchSnapshot();
    });
    it('DATETIME field renders correctly', () => {
        const onChange = jest.fn();
        const wrapper = shallow(React.createElement(styles_2.ThemeProvider, { theme: theme },
            React.createElement(ConfigField_1.default, { _type: react_openfin_1.FieldType.DATETIME, _label: 'label', value: new Date('1990-12-17T03:24:00'), onChange: onChange })));
        // const component = wrapper.dive();
        const comp = enzyme_to_json_1.default(wrapper);
        if (comp.props.id) {
            comp.props.id = 'config_field_id';
        }
        expect(comp).toMatchSnapshot();
    });
    // todo fix this test case
    // it('DATETIME field fires onChange correctly',()=>{
    //     const onChange = jest.fn();
    //     const wrapper = mount(
    //         <ThemeProvider theme={theme}>
    //             <ConfigField
    //                 _type={FieldType.DATETIME}
    //                 _label={'label'}
    //                 value={new Date('1990-12-17T03:24:00')}
    //                 onChange={onChange}
    //             />
    //         </ThemeProvider>
    //     );
    //     expect(wrapper.find(DateTimePicker)).toHaveLength(1);
    //     wrapper.find(DateTimePicker).props().onChange({_d:new Date('1991-12-17T03:24:00')});
    //     expect(onChange).toHaveBeenCalled();
    // })
    it('BODY1 field renders correctly', () => {
        const onChange = jest.fn();
        const wrapper = shallow(React.createElement(styles_2.ThemeProvider, { theme: theme },
            React.createElement(ConfigField_1.default, { _type: react_openfin_1.FieldType.BODY1, _label: 'label', value: '', onChange: onChange })));
        // const component = wrapper.dive();
        expect(enzyme_to_json_1.default(wrapper)).toMatchSnapshot();
    });
});
//# sourceMappingURL=ConfigField.spec.js.map