UI5 / UI5/webcomponents

[DatePicker|Calendar]: MaxDate property prevents immediate selection of next month date

Open
#14,046 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

bug SAP UDEx TOPIC B
Dominant language
TypeScript
Stars
1.8k
Forks
285
Avg merge
3d 2h
Merged PRs (30d)
59

Description

Bug Description

When user uses maxDate property, and try to select date of end range month, from previous than max month view, then instead of date being selected (and calendar dropdown being closed), month view is changed and user need to click again on desire date.

Current behavior:

  • maxDate is set
  • user opens calendar for the month, which is right before the last allowed month (month containing maxDate)
  • user clicks at one of the dates from the last allowed month, visible at the last row of the previous month
  • date picker stays open and date is not selected

https://github.com/user-attachments/assets/56c05f67-2d0b-44c7-8ddb-f8c966d65ebc

Affected Component

Date Picker, Calendar

Expected Behaviour
  • maxDate is set
  • user opens calendar for the month, which is right before the last allowed month (month containing maxDate)
  • user clicks at one of the dates from the last allowed month, visible at the last row of the previous month
  • date picker closes and date is selected
Isolated Example

https://ui5.github.io/webcomponents/components/DatePicker/

Steps to Reproduce
  • Set maxDate to '2026-12-10'
  • open date picker and click on the months switch button to open calendar for November
  • click on the 'December, 4' cell visible at the last row of the calendar for November
Log Output, Stack Trace or Screenshots

No response

Priority

Medium

UI5 Web Components Version

2.26.0

Browser

Chrome

Operating System

No response

Additional Context

UDEx ticket https://github.tools.sap/sapudex/digital-design-system/issues/3532

Organization

SAP UDEx

Declaration
  • I’m not disclosing any internal or sensitive information.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the DatePicker and Calendar entry points using the isolated DatePicker example. Reproduce the November view with maxDate set to 2026-12-10, then click the visible December 4 cell. Done means the date is selected and the date picker closes on that first click.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend, web-dev
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Active
Clarity
Mostly clear
Newbie friendliness
68/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.