[pickers] Fix duplicate hour label in MultiSectionDigitalClock on DST day#22110
Draft
LukasTy wants to merge 2 commits intomui:masterfrom
Draft
[pickers] Fix duplicate hour label in MultiSectionDigitalClock on DST day#22110LukasTy wants to merge 2 commits intomui:masterfrom
MultiSectionDigitalClock on DST day#22110LukasTy wants to merge 2 commits intomui:masterfrom
Conversation
…ST day On the DST spring-forward day, `adapter.setHours(now, 2)` (Chicago / LA timezones, with certain adapters) returns a date whose local hour is 3 because 2 AM does not exist. That made the hours column render `"03"` twice and drop `"02"`, which with the v8 skipped-hour disable check presented as a confusing picker with hours like `04` appearing unselectable. Compute the label directly from the loop index instead of formatting a DST-affected date. `TimeClock`'s `getHourNumbers` already uses this approach. Fixes mui#21669 Fixes mui#22084 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
LukasTy
added
type: regression
Bundle size
Deploy previewhttps://deploy-preview-22110--material-ui-x.netlify.app/ Check out the code infra dashboard for more information about this PR. |
Switch the DST-safe fix from hardcoded digit formatting to using a DST-free reference day (January 15) as the base for `adapter.setHours`. This keeps the original `adapter.format` + `formatNumber` pipeline so: - Custom `formats.hours12h` / `formats.hours24h` from `LocalizationProvider` (e.g. `'h'` without padding) are respected. - Locales that render digits differently through the adapter's format function keep working. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
LukasTy
removed
the
type: regression
LukasTy
changed the title
MultiSectionDigitalClock on DST day
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Fixes #22084.
On a DST spring-forward day in timezones like
America/ChicagoorAmerica/Los_Angeles, theMultiSectionDigitalClockhour column rendered"03"twice and omitted"02". The picker also emitted a duplicate React key warning.Root cause: labels were produced via
adapter.format(adapter.setHours(now, hour), 'hours12h'). On the DST day,setHours(now, 2)returns a date whose local hour is3(because 2 AM does not exist locally and the adapter rolls forward), so the label forhour=2came out as"03"— same label ashour=3.Fix: use a fixed DST-free reference day (January 15 of the same year, in the same timezone as
now) as the base foradapter.setHourswhen generating labels. The existingadapter.format+formatNumberpipeline is preserved, so locale-specific formats (customhours12h/hours24hviaLocalizationProvider, unpadded tokens like'h', non-ASCII numeric systems such as Arabic) keep working.Before (Mar 8 2026, Chicago picker timezone, LA system timezone):
After:
Note on #21669
This PR does not address #21669 (the "cannot select 4 AM" report). While the duplicate-label bug fixed here made the picker look broken around the DST transition, the author has indicated they've found a separate root cause for #21669 and will address it in a follow-up.
Test plan
timezone.MultiSectionDigitalClock.test.tsxwith:describeAdapterspair asserting 12- and 24-hour columns have unique labels on the DST day (runs across dayjs / date-fns / luxon / moment)clockConfig: new Date('2026-03-08T15:00:00.000Z')that puts the adapter'snowon the DST day (the default June 15 clock indescribeAdapterswouldn't reach the bug). Covers both the unique-label assertion and clicking"4 hours"to set the value to 4 AMexpected 11 to equal 12for unique labels; "Found multiple elements with the role 'option' and name ..." when clicking a DST-affected hour) and pass with itx-date-pickerssuite: 3248 pass, 0 failx-date-pickers-prosuite: 986 pass, 0 failpnpm --filter "@mui/x-date-pickers*" run typescriptcleanpnpm prettierclean