DatePicker resets manually input value when clicking outside

[FrivalszkyP]

DatePicker resets value when clicking outside

Detailed description

If you change the date via keyboard while the date picker dropdown is open, clicking outside the input field will reset the value.

Related component: DatePicker

Browser: Chrome, latest (74)

Carbon Design System V9 and V10 are both affected.

Steps to reproduce the issue

1. Click inside a datepicker element that already has a value
2. The dropdown opens
3. Change the date value via keyboard, not by selecting anything in the dropdown
4. Click outside of the input element

Expected result:

• The input field retains its value that was input via keyboard

Actual result:

• The input field resets its value that was selected before.

Additional information

This behavior can be reproduced in the storybook examples easily:

http://v6-react.carbondesignsystem.com/?selectedKind=DatePicker&selectedStory=single%20with%20calendar&full=0&addons=1&stories=1&panelRight=0&addonPanel=storybooks%2Fstorybook-addon-knobs

http://react.carbondesignsystem.com/?selectedKind=DatePicker&selectedStory=simple&full=0&addons=1&stories=1&panelRight=0&addonPanel=storybook%2Fstories%2Fstories-panel

Notes

The VanillaJS code in the Carbon Design System website behaves differently, so this is clearly an inconsistency with the Carbon Design System. Check here:

https://www.carbondesignsystem.com/components/date-picker/code

[carbon-bot]

Hi there! 👋 If you're wondering why this issue was moved, we're currently updating our repo structure so that every package is found in the same project.

This should not have any impact for you, but we wanted to give you a heads up in case you were wondering what is going on. If you have any questions, feel free to reach out to us on Slack or contact us at: [email protected]. Thanks!

[abbeyhrt]

Hi @FrivalszkyP! Thank you for bringing this to our attention, I am not able to recreate this problem so it seems like this might have been addressed, could you see if you can still reproduce the issue?

[gpandrews]

I can reproduce the problem in a different way.
I'm using <DatePicker onClose={(dateObjs, dateString) => { ... }}> if I type in a date and press Tab to move to the next field in my form, the dateObjs is not correct. The same is true if I enter a value and click outside the input field (to move the focus out of the input field). If I press Enter and then Tab, the dateObjs is correct. It's also correct if I use the mouse to pick a date.
Here's a sandbox: https://codesandbox.io/s/bitter-meadow-1wy9j

[asudoh]

The last comment above seems about a different issue, closer to: #3832

[tw15egan]

Closing since this due to inactivity, if you would like us to take a look into this please link to a CodeSanbox that illustrates the problem you're having. Thanks!