Progress® KendoReact Feedback Portal
Back to Feed
Request a Feature Report a Bug
Completed
Last Updated: 05 Sep 2023 14:17 by ADMIN
David
Created on: 11 May 2023 04:10
Category: DatePicker
Type: Bug Report
6
DatePicker Calendar cannot select dates in any month before the currently selected date

As per the subject, you can no longer use the Calendar to select a date in a month before the currently selected Date. Please see the following demo:

https://stackblitz.com/edit/react-xc2oxm-wgsfhy?file=app%2Fmain.tsx

Steps to reproduce:

  • Click on the Calendar button
  • Click on any month before the currently selected month
  • Click on any date in the month
  • Observe that the day is changed correctly but the month is incorrectly incremented by one

This error is not observed if you:

  • type in a date
  • use the mousewheel to scroll to the earlier date instead of clicking on the month
  • use Firefox instead of Chrome

We aren't certain but don't believe this error was present before the latest Chrome 113 update. The error is reproducible in all versions of KendoReact from 5.2.0 onwards.

15 comments
ADMIN
Vessy
Posted on: 05 Sep 2023 14:17

Hi, David,

Thanks a lot for the update! I managed to reproduce the problem on Chrome as well and pass the given use case to our QAs, so they can test the fix with it as well.

I also updated the related github item with it:

Regards,
Vessy
Progress Telerik

Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Kendo family, check out our getting started resources!

David
Posted on: 05 Sep 2023 13:14

Hi Vessy,

For the benefit of other users with this issue I will share my reply:

No, as the github issue you have provided a link to states, the behaviour is also reproducible in Chrome from time to time.

Here is the link again to the StackBlitz which has the latest (5.17.0) Kendo package versions. I am using the latest version of Chrome i.e. Version 116.0.5845.141 (Official Build) (64-bit).

It's very easy to reproduce and very noticeable when the issue happens because the October calendar is shown even though you have e.g. July selected in the fast navigation bar as per the screenshot I sent yesterday. To reproduce:
  • Load the StackBlitz
  • Toggle the Calendar
  • Click on a month (e.g. August) before the current month (September) in the fast navigation bar
  • If the correct month is shown, click away from the control so the calendar closes and repeat
  • In a few attempts you will see that even though the previous month (e.g. August) is selected in the fast navigation bar, the calendar for the next month (October) is shown instead


Attached Files:
ADMIN
Vessy
Posted on: 05 Sep 2023 12:56

Hi, David,

I have just answered your primary support ticket on the matter, for convenience I will copy my reply here as well:

The newly reported behavior is already logged as a separate issue and it is currently in testing phase. The problem is very specific and currently we are able to replicate it only in Safari, is this the case at your end as well? May I ask you to share some more details about the environment that you have so we can make additional tests on it as well?

Once the fix is merged in develop, we will add a comment in the following github item to share the exact dev version that contains it, so you can test it before the official release:

Regards,
Vessy
Progress Telerik

Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Kendo family, check out our getting started resources!

David
Posted on: 04 Sep 2023 16:27

Please see attached for a screenshot of the calendar when the issue presents

 

Attached Files:
David
Posted on: 04 Sep 2023 16:20

Here is a link to a fork of the StackBlitz with updated packages: https://stackblitz.com/edit/react-xc2oxm-8kps4h?file=app%2Fmain.tsx. The issue is intermittent but easily reproducible.

Kind regards,

David

David
Posted on: 04 Sep 2023 15:56

Hi,

This issue is active again exactly as described. Can you please re-open this issue and investigate. The StackBlitz in the original post can be used to demonstrate the issue.

Kind regards,

David

ADMIN
Vessy
Posted on: 07 Jun 2023 12:18

Hello, Ned,

The bug discussed in this thread is fixed and is currently in testing phase. If everything goes smoothly, the fix will be available until the end of the week.

Regards,
Vessy
Progress Telerik

As of R2 2023, the default icon type will be SVG instead of Font. See this blogpost for more information.
Ned
Posted on: 06 Jun 2023 16:01
There is significant business impact from this issue for us as well.  What is the ETA on a fixed version?
David
Posted on: 15 May 2023 12:03

For anyone else looking for more information and an adequate workaround for this issue:

Kind regards,

David

ADMIN
Vessy
Posted on: 12 May 2023 14:37

Hello, guys,

We examined the reported issue further and it turned out to be related to the usage of the `createRoot` method. I have logged an issue in our github backlog so you can track its progress here:

In the meantime, you can workaround the issue by rendering the component using `ReactDOM.render`:

Regards,
Vessy
Progress Telerik

Stay tuned by visiting our public roadmap and feedback portal pages! Or perhaps, if you are new to our Kendo family, check out our getting started resources!

David
Posted on: 11 May 2023 06:32
Note: this issue is hidden in your examples because you use the deprecated `ReactDOM.render` method and your examples run in React 17 mode as per https://react.dev/blog/2022/03/08/react-18-upgrade-guide#deprecations. The examples provided here correctly use `createRoot` and run using React 18.
Mark
Posted on: 11 May 2023 06:00
I just need to add that there is significant business impact because of this issue. Your urgent attention into this is greatly appreciated.
Mark
Posted on: 11 May 2023 05:59
David has confirmed it works on Chrome 112.
David
Posted on: 11 May 2023 04:25
Update: if you set a max date value of `new Date()` and click on a month before the currently selected month in the Calendar then the Calendar is empty and no dates can be selected.
David
Posted on: 11 May 2023 04:15
Here is the same demo with the latest packages installed:
https://stackblitz.com/edit/react-xc2oxm-aw8vrr?file=app%2Fmain.tsx
Create an account Log In
View
Type
Status
Category