Comportement balises HTML Safari
Bonjour,
Je travaille pour une société éditrice de solutions web. Sur notre site, nous utilisons des balises HTML <input/> de type "date" et "time" et nous rencontrons plusieurs problèmes sur les navigateurs Safari (de ce que j'ai pu lire sur Internet, ceux-ci surviendraient depuis la version 16 de Safari).
Pour les champs de type "date" et "time", l'agent utilisateur de Safari "complète" la balise <input/> par d'autres balises (<div> avec des pseudo-classes, comme "-webkit-datetime-edit-day-field") pour afficher des données fantômes lorsque la valeur de l'input est vide (en l'occurence, Safari affiche la date actuelle au format local pour les types "date" et l'heure actuelle au format local pour les types "time"). Ce comportement est très problématique dans nos cas car, ces champs pouvant être vides (ils ne sont pas obligatoires et n'ont pas le caractère "required"), ils apparaissent remplis pour l'utilisateur alors que la valeur renseignée et soumise lors de la validation du formulaire est bien nulle. Nous avons donc trouvé une astuce pour masquer via CSS ces valeurs affichées non-souhaitées, mais est-il possible de bloquer ce comportement par défaut de Safari ?
Second problème : pour les <input/> de type "time", ceux-ci ne sont plus éditables/sélectionnables si la valeur est vide (problème détecté jeudi 06/04/2023). Cependant, si on leur fixe une valeur au chargement de la page, que l'on supprime la valeur et qu'on ne perd pas le focus de l'input, alors là on peut ré-écrire... sauriez-vous ce qui bloque le comportement de ces <input/> ? Car actuellement, nous avons été contraints de basculer sur des <input type="text"/> pour pallier ce problème alors que la documentation officielle (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date et https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/time) mentionne la compatibilité de ces attributs HTML avec Safari.
Je vous remercie par avance pour votre aide.
Agent utilisateur de Safari incompatible pour les <input type="date"/> et <input type="time"/>
[Titre Modifié par l’Hôte]
