Publié le : 18 mars 2026
À partir de Chrome 142, les applications Web qui lisent de l'audio ou de la vidéo peuvent passer automatiquement en mode Picture-in-Picture si elles enregistrent un gestionnaire d'actions de session média. Cette fonctionnalité a été très utile pour les lecteurs de musique et de vidéo, mais elle nécessite que les développeurs l'implémentent explicitement.
Pour offrir une expérience de multitâche multimédia fluide et améliorer la visibilité du Picture-in-picture (PIP), Chrome introduit le PIP automatique initié par le navigateur. Cette fonctionnalité permet à Chrome d'ouvrir automatiquement une fenêtre PIP vidéo pour les sites qui n'ont pas enregistré de gestionnaire d'action de session multimédia. Cela permet de s'assurer que votre contenu multimédia reste visible lorsque vous changez d'onglet.
Instructions
- Utilisez Chrome 142 ou une version ultérieure sur ordinateur.
- Activez l'option "Browser initiated automatic picture in picture" (Picture-in-picture automatique initié par le navigateur) dans
chrome://flags/#browser-initiated-automatic-picture-in-picture, puis redémarrez Chrome. - Accédez à un site Web de vidéos et lancez la lecture d'une vidéo (exemple).
- Passez à un autre onglet Chrome pour déclencher une fenêtre PIP vidéo.
Fonctionnement
Lorsque vous lisez un contenu multimédia et que vous passez à un autre onglet, Chrome peut automatiquement le déplacer dans une fenêtre vidéo PIP toujours au premier plan. Contrairement à la fonctionnalité existante "PIP automatique pour la lecture multimédia", qui prend en charge le contenu vidéo ou HTML arbitraire (à l'aide de l'API Document Picture-in-Picture), les requêtes initiées par le navigateur ouvrent toujours une fenêtre PIP vidéo standard.
Pour garantir une expérience utilisateur de haute qualité et non intrusive, Chrome ne déclenche ce comportement que lorsqu'un ensemble strict de conditions est rempli :
- L'URL du frame supérieur est sécurisée selon le service de navigation sécurisée.
- Le contenu multimédia se trouve dans le frame supérieur.
- Le contenu multimédia était audible au cours des deux dernières secondes.
- Le contenu multimédia a la priorité audio et est en cours de lecture.
- Il existe un seul lecteur "normal", c'est-à-dire un élément multimédia dont le son n'est pas coupé, qui a été lu et qui n'utilise pas
MediaStream. - L'élément multimédia doit comporter une piste vidéo.
- Le site n'utilise pas activement la caméra ni le micro.
- Le seuil de l'index d'engagement média de l'utilisateur a été dépassé, ce qui indique une utilisation fréquente du site. Cette condition s'applique si l'utilisateur n'a pas explicitement autorisé ni refusé la fonctionnalité.
- Aucune fenêtre PIP n'est actuellement ouverte. Si une autre fenêtre PIP est déjà ouverte, Chrome ne déclenche pas de transition automatique.
enterpictureinpicture) et de la lecture automatique en mode Picture-in-picture pour la lecture de contenus multimédias (site ayant enregistré le gestionnaire).Contrôle et confidentialité des utilisateurs
La lecture automatique en mode PIP initiée par le navigateur respecte les mêmes autorisations et paramètres utilisateur que les requêtes initiées par le site. La première fois qu'un site passe automatiquement en mode Picture-in-picture, Chrome affiche une boîte de dialogue d'autorisation demandant aux utilisateurs s'ils souhaitent autoriser ce comportement pour le site à l'avenir.
Les utilisateurs peuvent également gérer ces autorisations à tout moment dans les paramètres du site.
Contrôle et désactivation par les développeurs
Bien que cette fonctionnalité soit conçue pour fonctionner de manière native sur la plupart des sites vidéo, vous pouvez la désactiver.
Implémenter votre propre gestionnaire
Si votre application Web enregistre déjà un gestionnaire d'actions de session média pour l'action enterpictureinpicture, votre implémentation est prioritaire et Chrome n'initie pas sa propre transition automatique.
Si vous souhaitez personnaliser le comportement lorsque Chrome estime qu'une transition est appropriée, le gestionnaire d'actions enterpictureinpicture inclut un reason dans MediaSessionActionDetails. Vous pouvez vérifier si reason est défini sur contentoccluded (ce qui signifie que le navigateur a lancé la requête, car l'onglet était masqué) et décider de la marche à suivre.
navigator.mediaSession.setActionHandler("enterpictureinpicture", (details) => {
if (details.reason === "contentoccluded") {
// The browser suggests entering Picture-in-Picture.
// You can choose to open a standard video PiP or a Document PiP window, or do
// nothing (effectively blocking browser-initiated Auto Picture-in-Picture).
}
});
Bonnes pratiques pour la session multimédia
Avec le mode Picture-in-picture automatique initié par le navigateur, la configuration de votre session multimédia aide Chrome à comprendre votre contenu et à interagir avec lui. Un MediaSession bien configuré garantit que la fenêtre PIP offre une expérience de haute qualité avec des commandes et des informations précises pour les utilisateurs.
Synchroniser la barre de progression
Si l'API setPositionState est utilisée et que la position de la session média n'est pas mise à jour correctement, les fenêtres PIP affichent une barre de progression inexacte lors de la lecture du contenu multimédia. Pour éviter cela, mettez toujours à jour ou supprimez position state à l'aide de navigator.mediaSession.setPositionState(), selon le cas (par exemple, lorsque la source multimédia change ou est réinitialisée), afin que la fenêtre PIP reflète la position correcte du contenu multimédia en cours de lecture.
const video = document.querySelector('video');
function updatePositionState() {
if ('setPositionState' in navigator.mediaSession) {
navigator.mediaSession.setPositionState({
duration: video.duration,
playbackRate: video.playbackRate,
position: video.currentTime,
});
}
}
// Update when metadata is loaded or when seeking happens.
video.addEventListener("loadedmetadata", updatePositionState);
video.addEventListener("seeked", updatePositionState);
Gérer les transitions de manière fluide
Si votre site lit automatiquement l'épisode suivant, assurez-vous que vos gestionnaires d'actions MediaSession et vos métadonnées restent actifs et précis tout au long de la transition. Si des gestionnaires d'actions sont supprimés ou non définis lors de la transition vers un élément "Suivant", il est possible que la fenêtre PIP perde les fonctionnalités fournies par le gestionnaire.
Activer le contrôle total
Au-delà des commandes de lecture et de pause de base, envisagez d'implémenter des gestionnaires pour seekto, previoustrack et nexttrack. Les utilisateurs peuvent ainsi parcourir votre contenu directement depuis la fenêtre PIP, sans revenir à l'onglet d'origine.
navigator.mediaSession.setActionHandler("seekto", (details) => {
if (details.fastSeek && "fastSeek" in video) {
video.fastSeek(details.seekTime);
return;
}
video.currentTime = details.seekTime;
});
Participer et envoyer des commentaires
Si vous avez des commentaires ou si vous rencontrez des problèmes avec ce comportement, partagez-les sur crbug.com.