= ({
datePickers.close("start")}
diff --git a/apps/calendar-web/src/views/Forms/EventForm/DateControlsSection/DateTimeSection/eventFormDateField.util.test.ts b/apps/calendar-web/src/views/Forms/EventForm/DateControlsSection/DateTimeSection/eventFormDateField.util.test.ts
index ce70b70000..020f7361fb 100644
--- a/apps/calendar-web/src/views/Forms/EventForm/DateControlsSection/DateTimeSection/eventFormDateField.util.test.ts
+++ b/apps/calendar-web/src/views/Forms/EventForm/DateControlsSection/DateTimeSection/eventFormDateField.util.test.ts
@@ -1,11 +1,20 @@
import dayjs from "@core/util/date/dayjs";
import { getTimeOptionByValue } from "@web/common/utils/datetime/web.date.util";
import {
+ formatEventFormDateLabel,
shiftTimedScheduleByDays,
timedScheduleFromDateChange,
} from "@web/views/Forms/EventForm/DateControlsSection/DateTimeSection/eventFormDateField.util";
import { describe, expect, it } from "bun:test";
+describe("formatEventFormDateLabel", () => {
+ it("uses MM.DD.YY", () => {
+ expect(formatEventFormDateLabel(new Date("2026-10-17T12:00:00.000Z"))).toBe(
+ "10.17.26",
+ );
+ });
+});
+
describe("shiftTimedScheduleByDays", () => {
it("preserves duration when shifting both instants", () => {
const start = new Date("2026-04-24T14:00:00.000Z");
diff --git a/apps/calendar-web/src/views/Forms/EventForm/DateControlsSection/DateTimeSection/eventFormDateField.util.ts b/apps/calendar-web/src/views/Forms/EventForm/DateControlsSection/DateTimeSection/eventFormDateField.util.ts
index f1a134e1df..b732bfe598 100644
--- a/apps/calendar-web/src/views/Forms/EventForm/DateControlsSection/DateTimeSection/eventFormDateField.util.ts
+++ b/apps/calendar-web/src/views/Forms/EventForm/DateControlsSection/DateTimeSection/eventFormDateField.util.ts
@@ -6,11 +6,11 @@ import {
tryMapToBackend,
} from "@web/common/utils/datetime/web.date.util";
-/** date-fns tokens for react-datepicker (shows as Tue, Oct 13). */
-export const EVENT_FORM_DATE_INPUT_FORMAT = "eee, MMM d";
+/** date-fns tokens for react-datepicker (display: 10.17.26). */
+export const EVENT_FORM_DATE_INPUT_FORMAT = "MM.dd.yy";
export const formatEventFormDateLabel = (date: Date) =>
- dayjs(date).format("ddd, MMM D");
+ dayjs(date).format("MM.DD.YY");
export const shiftTimedScheduleByDays = (
start: Date,
diff --git a/e2e/timed/event-form-keyboard-audit.spec.ts b/e2e/timed/event-form-keyboard-audit.spec.ts
new file mode 100644
index 0000000000..eb464453a0
--- /dev/null
+++ b/e2e/timed/event-form-keyboard-audit.spec.ts
@@ -0,0 +1,102 @@
+import { expect, test } from "@playwright/test";
+import {
+ openTimedEventFormWithKeyboard,
+ prepareTimedCalendarPage,
+} from "../utils/event-test-utils";
+import path from "node:path";
+
+const ARTIFACTS = "/opt/cursor/artifacts";
+
+const getFormScrollLeft = (page: import("@playwright/test").Page) =>
+ page.evaluate(() => {
+ const form = document.querySelector('form[name="Event Form"]');
+ const scroller = form?.querySelector(".overflow-y-auto");
+ return scroller instanceof HTMLElement ? scroller.scrollLeft : 0;
+ });
+
+test.beforeEach(async ({ page }) => {
+ await prepareTimedCalendarPage(page);
+});
+
+test("keyboard tab order: title, date, start time, end time, all day", async ({
+ page,
+}) => {
+ await openTimedEventFormWithKeyboard(page);
+
+ const title = page.getByRole("form").getByPlaceholder("Title");
+ const startDate = page.locator('input[title="Pick Start Date"]');
+ const startTime = page.getByRole("combobox", { name: "Start time" });
+ const endTime = page.getByRole("combobox", { name: "End time" });
+ const allDay = page.getByRole("checkbox", { name: "All day?" });
+
+ await title.focus();
+ await page.keyboard.press("Tab");
+ await expect(startDate).toBeFocused();
+
+ await page.keyboard.press("Tab");
+ await expect(startTime).toBeFocused();
+
+ await page.keyboard.press("Tab");
+ await expect(endTime).toBeFocused();
+
+ await page.keyboard.press("Tab");
+ await expect(allDay).toBeFocused();
+
+ await page.screenshot({
+ path: path.join(ARTIFACTS, "event-form-tab-order.png"),
+ fullPage: true,
+ });
+});
+
+test("typed date formats commit on Enter and preserve clock times", async ({
+ page,
+}) => {
+ await openTimedEventFormWithKeyboard(page);
+
+ const startDate = page.locator('input[title="Pick Start Date"]');
+ const startTime = page.getByRole("combobox", { name: "Start time" });
+
+ await startTime.focus();
+ const startTimeBefore = await startTime.inputValue();
+
+ await startDate.focus();
+ await startDate.fill("17.10.26");
+ await page.keyboard.press("Enter");
+ await expect(startDate).toHaveValue("10.17.26");
+
+ await expect(startTime).toHaveValue(startTimeBefore);
+
+ await startDate.focus();
+ await startDate.fill("2026-11-03");
+ await page.keyboard.press("Enter");
+ await expect(startDate).toHaveValue("11.03.26");
+
+ await page.screenshot({
+ path: path.join(ARTIFACTS, "event-form-date-formats.png"),
+ fullPage: true,
+ });
+});
+
+test("end time menu opens without shifting the form panel horizontally", async ({
+ page,
+}) => {
+ await openTimedEventFormWithKeyboard(page);
+
+ const endTime = page.getByRole("combobox", { name: "End time" });
+ const scrollBefore = await getFormScrollLeft(page);
+
+ await endTime.focus();
+ await page.keyboard.press("ArrowDown");
+ await expect(page.getByRole("listbox")).toBeVisible();
+
+ const scrollAfter = await getFormScrollLeft(page);
+ expect(scrollAfter).toBe(scrollBefore);
+
+ await page.screenshot({
+ path: path.join(ARTIFACTS, "event-form-end-time-menu.png"),
+ fullPage: true,
+ });
+
+ await page.keyboard.press("Escape");
+ await expect(page.getByRole("listbox")).toHaveCount(0);
+});