Why this is tricky

Five different calendar implementations, each requiring a different automation approach — a native OS picker with no DOM to click through, a combined date+time control, a popup that only exists once triggered, an always-visible inline grid whose day cells regenerate every month, and two related fields whose combined output depends on both. All dates display as mm/dd/yyyy.

1. Native date input

The browser's own date picker isn't part of this page's DOM — set the value directly rather than clicking through a picker UI.

No date selected.


2. Date + time input

No date/time selected.


3. Popup calendar

The calendar grid doesn't exist in the DOM until the input is focused or clicked — it's built fresh and removed on selection.


4. Inline calendar

Always visible, no trigger needed — but every day cell is regenerated when you change month, so there's no fixed set of day elements to locate once and reuse.

No date selected.


5. Date range picker

Two related fields — the result depends on both, and is only valid once the end date is on or after the start date.

No range calculated.

Initial state.