A lightweight, powerful javascript datetime picker
95
{
"context": "This evaluation assesses how effectively the engineer uses flatpickr's inline calendar display mode to create an always-visible, embedded calendar widget. The focus is on correct configuration of the inline mode and proper integration with event handling.",
"type": "weighted_checklist",
"checklist": [
{
"name": "Inline mode configuration",
"description": "Uses the 'inline' option set to true to configure flatpickr for inline display mode, ensuring the calendar is always visible and embedded in the page rather than appearing as a popup",
"max_score": 30
},
{
"name": "Target element binding",
"description": "Correctly initializes flatpickr on an appropriate HTML element (input or div) using the containerId parameter, properly binding the calendar to a container element in the DOM",
"max_score": 15
},
{
"name": "Date selection handling",
"description": "Implements the onChange callback hook to detect when a user selects a date and respond appropriately by displaying event information",
"max_score": 25
},
{
"name": "Event data integration",
"description": "Integrates the provided events array with the calendar to show which dates have events, potentially using options like onDayCreate or other flatpickr features to mark or highlight event dates",
"max_score": 20
},
{
"name": "Instance return",
"description": "Returns the flatpickr instance from the initializeCalendar function to allow further manipulation of the calendar after initialization",
"max_score": 10
}
]
}Install with Tessl CLI
npx tessl i tessl/npm-flatpickrevals
scenario-1
scenario-2
scenario-3
scenario-4
scenario-5
scenario-6
scenario-7
scenario-8
scenario-9
scenario-10