Trigger onBlur with value initally set to null

Simon Egersand

2017-02-10 794700cc3c0378368320255e978ee3b249a33a48

Trigger onBlur with value initally set to null

Before onBlur was not emitted when value was initally falsey, this
caused some problem for some users.

 DateTime.js

@@ -334,14 +334,19 @@
            .milliseconds( currentDate.milliseconds() );

        if ( !this.props.value ) {
            var open = !( this.props.closeOnSelect && close );
            if ( !open ) {
                this.props.onBlur( date );
            }

            this.setState({
                selectedDate: date,
                viewDate: date.clone().startOf('month'),
                inputValue: date.format( this.state.inputFormat ),
                open: !(this.props.closeOnSelect && close )
                open: open
            });
        } else {
            if (this.props.closeOnSelect && close) {
            if ( this.props.closeOnSelect && close ) {
                this.closeCalendar();
            }
        }

 tests/datetime.spec.js

@@ -152,7 +152,7 @@
    it('open picker', () => {
        const component = utils.createDatetime();
        expect(utils.isOpen(component)).toBeFalsy();
        component.find('.form-control').simulate('focus');
        utils.openDatepicker(component);
        expect(utils.isOpen(component)).toBeTruthy();
    });

@@ -343,7 +343,7 @@
                component = utils.createDatetime({ value: date });

            expect(utils.isOpen(component)).toBeFalsy();
            component.find('.form-control').simulate('focus');
            utils.openDatepicker(component);
            expect(utils.isOpen(component)).toBeTruthy();
            component.find('.form-control').simulate('keyDown', { key: 'Tab', keyCode: 9, which: 9 });
            expect(utils.isOpen(component)).toBeFalsy();
@@ -354,7 +354,7 @@
                component = utils.createDatetime({ value: date, closeOnTab: false });

            expect(utils.isOpen(component)).toBeFalsy();
            component.find('.form-control').simulate('focus');
            utils.openDatepicker(component);
            expect(utils.isOpen(component)).toBeTruthy();
            component.find('.form-control').simulate('keyDown', { key: 'Tab', keyCode: 9, which: 9 });
            expect(utils.isOpen(component)).toBeTruthy();
@@ -565,7 +565,7 @@
            const component = utils.createDatetime({ closeOnSelect: false });

            expect(utils.isOpen(component)).toBeFalsy();
            component.find('.form-control').simulate('focus');
            utils.openDatepicker(component);
            expect(utils.isOpen(component)).toBeTruthy();
            utils.clickNthDay(component, 2);
            expect(utils.isOpen(component)).toBeTruthy();
@@ -575,7 +575,7 @@
            const component = utils.createDatetime({ closeOnSelect: true });

            expect(utils.isOpen(component)).toBeFalsy();
            component.find('.form-control').simulate('focus');
            utils.openDatepicker(component);
            expect(utils.isOpen(component)).toBeTruthy();
            utils.clickNthDay(component, 2);
            expect(utils.isOpen(component)).toBeFalsy();
@@ -702,10 +702,30 @@
                onBlurFn = jest.fn(),
                component = utils.createDatetime({ value: date, onBlur: onBlurFn, closeOnSelect: true });

            component.find('.form-control').simulate('focus');
            utils.openDatepicker(component);
            // Close component by selecting a date
            utils.clickNthDay(component, 2);
            expect(onBlurFn).toHaveBeenCalledTimes(1);
        });

        it('onBlur with value=null and closeOnSelect=true', () => {
            const onBlurFn = jest.fn(),
                component = utils.createDatetime({ value: null, onBlur: onBlurFn, closeOnSelect: true });

            utils.openDatepicker(component);
            // Close component by selecting a date
            utils.clickNthDay(component, 2);
            expect(onBlurFn).toHaveBeenCalledTimes(1);
        });

        it('onBlur with value=null and closeOnSelect=false', () => {
            const onBlurFn = jest.fn(),
                component = utils.createDatetime({ value: null, onBlur: onBlurFn, closeOnSelect: false });

            utils.openDatepicker(component);
            // Close component by selecting a date
            utils.clickNthDay(component, 2);
            expect(onBlurFn).not.toHaveBeenCalled();
        });

        it('onFocus', () => {
@@ -713,7 +733,7 @@
                onFocusFn = jest.fn(),
                component = utils.createDatetime({ value: date, onFocus: onFocusFn });

            component.find('.form-control').simulate('focus');
            utils.openDatepicker(component);
            expect(onFocusFn).toHaveBeenCalledTimes(1);
        });


 tests/testUtils.js

@@ -18,6 +18,10 @@
    /*
     * Click Simulations
     */
    openDatepicker: (datetime) => {
        datetime.find('.form-control').simulate('focus');
    },

    clickOnElement: (element) => {
        return simulateClickOnElement(element);
    },