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

DatePicker and DateRangePicker don't always display value passed #10727

Closed
mrkesh opened this issue Oct 19, 2023 · 1 comment
Closed

DatePicker and DateRangePicker don't always display value passed #10727

mrkesh opened this issue Oct 19, 2023 · 1 comment
Labels
component: pickers This is the name of the generic UI component, not the React module! duplicate This issue or pull request already exists regression A bug, but worse

Comments

@mrkesh
Copy link

mrkesh commented Oct 19, 2023

Steps to reproduce

CodeSandbox link

Steps:

  1. Open the picker and choose a date in the middle of the week
  2. Open the picker again and choose a date from the same week
  3. Unlike the first time, selected date is not the first day of the week, it is the one user clicked.

Current behavior

First time around, the selected date in the picker and in the textfield is the first day of the week. For instance, if you click on 19th October 2023, the selected day will become 15th October 2023 (which is the first day of the week according to my locale settings)

When we open picker again and select 19th October again, it won't move to 15th October but instead the 19th will be kept. However, if you choose a different week, the behaviour is as expected

Expected behavior

Whichever date you select, it should always go to the start of the week or whichever value it is set. I believe that is the expected behaviour in controlled mode

Context

I have DatePicker and a DateRangePicker components where I need to move the clicked date to the start of the week. The fact the behaviour is consistent affects UI experience for users.

Your environment

npx @mui/envinfo
  System:
    OS: macOS 13.5.2
  Binaries:
    Node: 18.15.0 - ~/.nvm/versions/node/v18.15.0/bin/node
    Yarn: 1.22.19 - ~/.nvm/versions/node/v18.15.0/bin/yarn
    npm: 9.5.0 - ~/.nvm/versions/node/v18.15.0/bin/npm
  Browsers:
    Chrome: 118.0.5993.70
    Edge: Not Found
    Safari: 16.6
  npmPackages:
    @emotion/react:  11.11.1 
    @emotion/styled:  11.11.0 
    @mui/base:  5.0.0-beta.8 
    @mui/core-downloads-tracker:  5.14.1 
    @mui/icons-material:  5.14.1 
    @mui/lab:  5.0.0-alpha.137 
    @mui/material:  5.14.1 
    @mui/private-theming:  5.13.7 
    @mui/styled-engine:  5.13.2 
    @mui/system:  5.14.1 
    @mui/types:  7.2.6 
    @mui/utils:  5.14.13 
    @mui/x-data-grid:  6.11.2 
    @mui/x-data-grid-pro:  6.11.2 
    @mui/x-date-pickers:  6.16.2 
    @mui/x-date-pickers-pro:  6.16.2 
    @mui/x-license-pro:  6.10.2 
    @types/react:  18.2.22 
    react:  18.2.0 
    react-dom:  18.2.0 
    typescript:  5.2.2 

Search keywords: date picker, pickers, datepicker controlled state

@mrkesh mrkesh added the status: waiting for maintainer These issues haven't been looked at yet by a maintainer label Oct 19, 2023
@cherniavskii cherniavskii added the component: pickers This is the name of the generic UI component, not the React module! label Oct 19, 2023
@LukasTy
Copy link
Member

LukasTy commented Oct 20, 2023

Thank you for opening this issue! 🙏
It looks like the same problem as #10424 and just increases the incentive to work on it ASAP. 👌
The underlying issue is that we are comparing if the previous value is equal to the newly provided one, before updating the controlled value, which is not the most correct behavior on our end.
I'm closing this issue as a duplicate.
Feel free to follow the mentioned issue to get notified about it's progress.

@LukasTy LukasTy closed this as not planned Won't fix, can't repro, duplicate, stale Oct 20, 2023
@LukasTy LukasTy added duplicate This issue or pull request already exists regression A bug, but worse and removed status: waiting for maintainer These issues haven't been looked at yet by a maintainer labels Oct 20, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
component: pickers This is the name of the generic UI component, not the React module! duplicate This issue or pull request already exists regression A bug, but worse
Projects
None yet
Development

No branches or pull requests

3 participants