Иногда нам может понадобиться использовать стандартный ввод даты с помощью элемента
input[type='date'], но при этом хочется кастомизировать триггер, который будет по клику открывать календарь для выбора даты. Тут на помощь может прийти метод
showPicker() – относительно новая возможность определённых видов элемента input открывать пикер программно. Таким образом, можно скрыть сам инпут за стилизованной кнопкой, но при клике на неё вызывать открытие календаря. Данный метод существует для множества видов инпутов – date, month, week, time, datetime-local, color и file. Однако для каждого вида есть свои ограничения в поддержке различными браузерами. Например, выбор времени, недели и месяца не будет работать в Firefox. Подробнее с поддержкой можно ознакомиться на caniuse.
Для выбора даты в некоторых старых браузерах можно использовать обходной вариант с эмуляцией фокуса и клика по инпуту. Однако этот подход всё ещё может быть рискованным, поэтому всегда советуем тестировать решение на разных платформах, которые поддерживает ваше приложение.