date-picker-widget

Select dates in native or custom calendar widgets using ISO-8601 input.

8|Updated May 13, 2026
One-click install
npx skills add https://github.com/bettyguo/browser-skills --skill date-picker-widget
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: date-picker-widget
Source: https://github.com/bettyguo/browser-skills/tree/main/skills/date-picker-widget
Command: npx skills add https://github.com/bettyguo/browser-skills --skill date-picker-widget

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Picks a date from a calendar-style widget by interacting with native date inputs or custom calendar UIs, enabling automated booking and scheduling flows.

Core Features & Use Cases

  • Easy path: fill native input type date fields directly when available.
  • Hard path: interact with custom calendar widgets by triggering the calendar, waiting for it to render, and selecting a day cell via ARIA and data-date attributes.
  • Use Case: booking a reservation or scheduling a demo by supplying vars.target_date in ISO format.

Quick Start

Set vars.target_date to an ISO date (e.g., "2026-06-15") and let the agent select that date in the calendar widget.

Frequently Asked Questions about date-picker-widget

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I automate picking a date in a custom calendar widget for UI automation?

Automating date selection in a custom calendar widget involves triggering the calendar UI, waiting for it to render, and selecting the target day cell via ARIA and data-date attributes. This handles custom booking and scheduling flows.

Can I fill native HTML date inputs directly during web form automation?

Yes, filling native HTML date inputs directly is supported as an easy path for web form automation. When standard input[type='date'] controls are available, the date can be populated directly without interacting with a custom calendar UI.

What date format is required for automating calendar date selection?

ISO-8601 format is required for automating calendar date selection. You must supply the target date in ISO format, such as "2026-06-15", using the target_date variable to successfully interact with both native date inputs and custom calendar UIs.

Does this date picker automation work for both booking and dining reservation forms?

Yes, date picker automation works for booking, dining, and scheduling tasks across forms. It handles selecting dates in various custom calendar widgets and native date inputs, making it suitable for diverse reservation and demo scheduling flows.

What is the best way to handle date grids that fail to render during automated booking?

Handling date grids that fail to render during automated booking requires triggering the calendar UI and explicitly waiting for it to render before selecting day cells. This ensures the date grid is fully loaded before interaction attempts.