Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[pickers] DateTimePicker issue on pasting date ("ghost value": looks empty when unfocused, looks filled when focused) #15113

Open
morzel85 opened this issue Oct 25, 2024 · 3 comments
Labels
bug 🐛 Something doesn't work component: date time picker This is the name of the generic UI component, not the React module! component: pickers This is the name of the generic UI component, not the React module!

Comments

@morzel85
Copy link

morzel85 commented Oct 25, 2024

Steps to reproduce

Link to live example: https://mui.com/x/react-date-pickers/date-time-picker/#basic-usage

Steps:

  1. Pick some date/time value (e.g. 10/17/2024 12:00 AM).
  2. Paste some date to the filed (e.g. 10/19/2024).
  3. Leave the field.
  4. Get back to the field.

Current behavior

When date is pasted it is not changing the value shown in the field, when user moves out of the field, then the field is presented as empty (shows placeholder), when focus is restored the the date/time value is shown.

Expected behavior

Ideally pasting just a date should override the date part. Definitely field should not act as if it is empty while focus is lost and then present the value when focus is restored.

Context

No response

Your environment

npx @mui/envinfo
  System:
    OS: Linux 5.15 Ubuntu 20.04.6 LTS (Focal Fossa)
  Binaries:
    Node: 20.12.2 - ~/.nvm/versions/node/v20.12.2/bin/node
    npm: 10.5.0 - ~/.nvm/versions/node/v20.12.2/bin/npm
    pnpm: 9.7.1 - ~/.local/share/pnpm/pnpm
  Browsers:
    Chrome: 130.0.6723.69
  npmPackages:
    @emotion/react: 11.13.3 => 11.13.3 
    @emotion/styled: 11.13.0 => 11.13.0 
    @mui/icons-material: 6.1.4 => 6.1.4 
    @mui/material: 6.1.4 => 6.1.4 
    @mui/x-data-grid: 7.21.0 => 7.21.0 
    @mui/x-date-pickers: 7.21.0 => 7.21.0 
    @types/react: 18.3.3 => 18.3.3 
    react: 18.3.1 => 18.3.1 
    react-dom: 18.3.1 => 18.3.1 
    typescript: 5.5.4 => 5.5.4 

Search keywords: DateTimePicker value

@morzel85 morzel85 added bug 🐛 Something doesn't work status: waiting for maintainer These issues haven't been looked at yet by a maintainer labels Oct 25, 2024
@github-actions github-actions bot added the component: pickers This is the name of the generic UI component, not the React module! label Oct 25, 2024
@michelengelen michelengelen changed the title DateTimePicker issue on pasting date ("ghost value": looks empty when unfocused, looks filled when focused) [pickers] DateTimePicker issue on pasting date ("ghost value": looks empty when unfocused, looks filled when focused) Oct 28, 2024
@michelengelen
Copy link
Member

Thanks for opening an issue here ... we will have a look at this. 👍🏼

@michelengelen michelengelen added component: date time picker This is the name of the generic UI component, not the React module! and removed status: waiting for maintainer These issues haven't been looked at yet by a maintainer labels Oct 28, 2024
@LukasTy
Copy link
Member

LukasTy commented Nov 8, 2024

The pasting is buggy in the case of Date Time Picker when pasting incomplete value.
If you were to paste the full value (including time), there would be no issues.

We need to fix this in one way or another. 👍
Ideally parsing partial value and updating only it, but at the very least there should be no mentioned inconsistent value state.

@LukasTy
Copy link
Member

LukasTy commented Nov 12, 2024

We assume that the issue might be related to the strict parsing of the date.
Maybe using non-strict parsing in the case of paste would allow us to cover such use cases.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug 🐛 Something doesn't work component: date time picker This is the name of the generic UI component, not the React module! component: pickers This is the name of the generic UI component, not the React module!
Projects
None yet
Development

No branches or pull requests

3 participants