Skip to content

DateTime: user-local display/input with UTC storage and semantic <time>#753

Open
alistair3149 wants to merge 10 commits intomasterfrom
731-datetime-presentation
Open

DateTime: user-local display/input with UTC storage and semantic <time>#753
alistair3149 wants to merge 10 commits intomasterfrom
731-datetime-presentation

Conversation

@alistair3149
Copy link
Copy Markdown
Member

Fixes #728
Fixes #731

Summary

Three DateTime components now agree on one story: user-local wall-clock in the UI, UTC ISO on disk.

  • New shared utility dateTimeConversion.ts (toLocalInputValue, fromLocalInputValue) uses new Date() + .toISOString() so explicit-offset ISOs (e.g. 2025-06-15T23:30:00+05:00) round-trip without silent re-encoding.
  • DateTimeDisplay renders valid ISOs inside a semantic <time :datetime="iso"> element with the user's local wall-clock plus a visible timezone abbreviation (UTC, CEST, PST, ...). Invalid values render a <span> fallback. Validity uses the newly-exported parseStrictDateTime from DateTime.ts.
  • DateTimeInput and DateTimeAttributesEditor replace raw <input type="datetime-local"> with CdxTextInput input-type="datetime-local". The Input gets a cdxIconClock start-icon (previously registered but never rendered). Two eslint-disable vue/html-self-closing comments retired.
  • Tests in all three component specs rewritten around the new behavior; FIXME(#728) pins that locked the old buggy behavior are gone. Direct tests added for parseStrictDateTime since it is now part of the public module surface.

Manual Browser Check

  1. Subject edit flow — open a page that has a DateTime property and edit it in the subject editor.
    • Input shows a Codex clock icon on the left.
    • Typing 2025-06-15 14:00 saves as your local 14:00. Reload — the input should still show 14:00 in your host TZ.
    • If the schema declares minimum/maximum, the min/max attributes on the input reflect them in your local TZ.
  2. Subject display flow — view the same page without editing.
    • Inspect the value: it must be a <time> element with a datetime attribute equal to the stored UTC ISO.
    • Rendered text must include a timezone abbreviation after the time (e.g. UTC, CEST, PST).
    • An unparseable stored value falls back to a <span> showing the raw string.
  3. Schema editor flow — open the schema editor for a DateTime property.
    • Both min/max inputs are Codex-styled (focus ring, proper sizing), not bare browser inputs.
    • Entered values round-trip as the same local wall-clock after saving and reopening.

Suggested starting URL: http://localhost:8484/index.php/Main_Page (or any page with DateTime data).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

DateTime: semantic <time> rendering, UTC indicator, Codex CdxTextInput DateTime: correct timezone handling for Input and AttributesEditor

1 participant