Nouveautés de Chrome 116 pour les extensions

Chrome 116 est désormais disponible en version bêta et inclut de nombreuses mises à jour intéressantes pour les développeurs d'extensions Chrome. Découvrons ensemble les nouveautés.

Sebastian Benz
Sebastian Benz

Ouvrir un panneau latéral par programmation

Le panneau latéral est l'une des fonctionnalités les plus demandées des extensions Chrome. Il est disponible dans Chrome depuis la version 114. Après avoir lancé l'API Side Panel, l'un des premiers commentaires que nous avons reçu est que les développeurs voulaient pouvoir ouvrir un panneau latéral de façon programmatique. Et voilà: chrome.sidePanel.open est maintenant disponible en version bêta. Elle vous permet d'ouvrir le panneau latéral de l'extension par programmation en réponse à une interaction de l'utilisateur, par exemple un clic sur le menu contextuel:

chrome.contextMenus.onClicked.addListener((info, tab) => {
  if (info.menuItemId === 'openSidePanel') {
    // This will open the panel in all the pages on the current window.
    chrome.sidePanel.open({ windowId: tab.windowId });
  }
});

Compatibilité de WebSocket avec les service workers

La compatibilité avec WebSocket est essentielle à la migration de nombreuses extensions vers Manifest V3. Chrome 116 améliore encore la compatibilité de WebSocket avec les service workers, car toute l'activité WebSocket réinitialise le délai d'inactivité du service worker de 30 secondes. Cela signifie que tant que votre WebSocket est actif, le service worker reste actif.

Vous pouvez l'utiliser pour implémenter un mécanisme de message keepalive garantissant que votre service worker reste actif pendant que vous attendez des messages de votre serveur, même si le prochain message n'arrive pas dans les 30 secondes:

function keepAlive() {
  const keepAliveIntervalId = setInterval(
    () => {
      if (webSocket) {
        webSocket.send('keepalive');
      } else {
        clearInterval(keepAliveIntervalId);
      }
    },
    // It's important to pick an interval that's shorter than 30s, to
    // avoid that the service worker becomes inactive.
    20 * 1000
  );
}

Pour en savoir plus, consultez notre nouveau guide et exemple WebSocket.

Keepalive fort pour les Service Workers

Concernant le cycle de vie des service workers, une autre mise à jour importante est disponible: un message keepalive efficace pour les API nécessitant une interaction utilisateur. Les API qui nécessitent une interaction de l'utilisateur disposeront de messages "keepalives solides" pour les service workers d'extension (en d'autres termes, ils lui permettront de prendre plus de cinq minutes sur cette tâche):

Enregistrement audio et vidéo en arrière-plan

Un autre fossé entre Manifest V2 et Manifest V3 a été comblé: vous pouvez enregistrer des contenus audio et vidéo en arrière-plan à l'aide de tabCapture et de documents hors écran. Utilisez l'API chrome.tabCapture dans un service worker pour obtenir un ID de flux suite à un geste de l'utilisateur. Il peut ensuite être transmis à un document hors écran pour démarrer l'enregistrement.

Consultez notre nouveau guide tabCapture pour en savoir plus sur son fonctionnement ou, pour un exemple pratique, consultez l'exemple Capture d'onglet – Enregistreur.

Nouvelle API: Runtime.getContexts()

La nouvelle API runtime.getContexts() vous permet d'extraire des informations sur les contextes actifs associés à vos extensions. Par exemple, vous pouvez l'utiliser pour vérifier si un document hors écran est actif:

const existingContexts = await chrome.runtime.getContexts({});
const offscreenDocument = existingContexts.find(
    (c) => c.contextType === 'OFFSCREEN_DOCUMENT'
  );

Nouveau motif hors écran: GEOLOCATION

geolocation a été ajouté comme une autre raison valide d'utilisation d'un document hors écran. Pour savoir comment obtenir la position géographique de l'extension à l'aide de l'API Offscreen, consultez notre guide sur l'utilisation de la géolocalisation.

chrome.action.setBadgeText()

action.setBadgeText a été mis à jour pour corriger une incohérence entre Manifest V2 et Manifest V3. Si vous transmettez une chaîne vide ou null à action.setBadgeText, le texte du badge est effacé de l'onglet spécifié et le texte global du badge est utilisé par défaut.

action.setBadgeText({tabId: tabId, text: ''});

Résumé: une nouvelle étape vers Manifest V3

Grâce à l'amélioration de la prise en charge à vie des service workers et à la mise à jour de l'API TabCapture, nous avons continué à progresser sur notre objectif : combler l'écart de fonctionnalités entre Manifest V2 et V3. Consultez la page des problèmes connus pour connaître l'état actuel.