Chrome : résoudre l'erreur Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first.

Chrome : résoudre l'erreur Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first. Le message d'erreur en question provient d'une mauvaise application des règles de Google concernant la lecture des vidéos en autoplay.

Le navigateur Chrome évolue sans cesse depuis sa création. Une version apparaît en moyenne tous les mois et apporte à chaque fois des nouveautés avec l'implémentation de nouveaux standards, des corrections de bugs, de nouvelles fonctionnalités ou bien l'application de nouvelles règles dans l'affichage des sites internet. Le message d'erreur "Uncaught (in promise) DOMException: play() failed because the user didn't interact with the document first" est justement une nouvelle règle qui est apparue avec la version 66 du navigateur (autre astuce du JDN à lire sur Chrome : Comment accéder à un fichier local via Chrome ?).

Cette nouvelle règle concerne les vidéos en autoplay. Il s'agit de vidéos qui se lancent automatiquement dès l'affichage de la page Web, sans aucune interaction de l'utilisateur. Google a décidé de modifier sa gestion des vidéos en autoplay afin de rendre la navigation plus confortable pour l'utilisateur. Les vidéos en autoplay ne sont autorisées à se lancer sans que l'utilisateur n'interagisse avec la page qu'à une seule condition : que le son de la vidéo soit désactivé. Pour réaliser cela, vous devez ajouter sur votre balise vidéo l'attribut "muted" avec la valeur "muted". Si vous ne le faites pas, le message d'erreur va alors s'afficher sur votre site.

<video title="Publicité" src="http://lien/vers/la/video.mp4" autoplay="true" muted="muted"></video>

Le fait de jouer automatiquement une vidéo avec du son est cependant autorisé, mais sous certaines conditions. L'utilisateur doit avoir interagi avec la page Web, que ce soit avec un clic, un scroll, ou un geste dans le cas de la navigation tactile. La présence du son est également possible si l'utilisateur a déjà activé le son sur une vidéo du site. Chrome se sert alors du MEI (index d'engagement du média) pour le détecter. Le dernier cas est réservé aux smartphones et tablettes : la lecture du son sur une vidéo lancée automatiquement est possible pour un site que l'utilisateur a ajouté à son écran d'accueil.

Android