Date Format not being updated upon componentWillReceiveProps

[alizaidi606]

When we render DatePicker inside another component and save the date format for the DatePicker inside its parent component as a state variable, then upon updating the state in parent component that is passed in the DatePicker as props do update the props in DatePicker but do not display the date in new format on the very first update. This is when the state in the parent component has changed via some action other than the DatePicker's.

Expected Behavior

1. Render DatePicker component.
2. Keep the dateFormat in the state of its parent component
3. Change the dateFormat in the parent component state and pass it to DatePicker Component
4. DatePicker should display the date in the new passed date format.

Current Behavior

1. Render DatePicker component.
2. Keep the dateFormat in the state of its parent component
3. Change the dateFormat in the parent component state and pass it to DatePicker Component
4. DatePicker still displays the date in the old format until another componentWillReceiveProps is called

Possible Solution

I reviewed the code of the library and found the bug.
When componentWillReceiveProps is invoked it compares the value from newProps with this.getValue() and if they are changed then state is set by creating new date values by calling the function makeDateValues and this function is passed the value from the newProps.

makeDateValues this function then calls makeInputValueString and the bug lies in this function.
In makeInputValueString function the dateFormat being used to format the date is this.props.dateFormat while the dateFormat may have been changed in the latest nextProps.

There are two possible solutions either save dateFormat in the state of DatePicker or pass dateFormat down the above function calls.

Steps to Reproduce (for bugs)

1. Render DatePicker component.
2. Keep the dateFormat in the state of its parent component
3. Change the dateFormat in the parent component state and pass it to DatePicker Component which will invoke DatePicker's componentWillReceiveProps

Your Environment

• Version used: github:pushtell/react-bootstrap-date-picker#f622dc8872dd180324ba5d3c295d009848f5814b
• Browser Name and version: Any
• Operating System and version (desktop or mobile): Any