browser.debugger

Description

L'API chrome.debugger sert de transport alternatif pour le protocole de débogage à distance de Chrome. Utilisez chrome.debugger pour l'associer à un ou plusieurs onglets afin d'instrumenter l'interaction réseau, de déboguer JavaScript, de modifier le DOM et le CSS, et plus encore. Utilisez la propriété Debuggee tabId pour cibler les onglets avec sendCommand et acheminer les événements par tabId à partir des rappels onEvent.

Autorisations

debugger

Pour utiliser cette API, vous devez déclarer l'autorisation "debugger" dans le fichier manifeste de votre extension.

{
  "name": "My extension",
  ...
  "permissions": [
    "debugger",
  ],
  ...
}

Restrictions des règles d'entreprise

Sur les appareils d'entreprise, certaines règles peuvent empêcher les extensions d'associer le débogueur à l'aide d'un modèle tout ou rien au moment de l'association (browser.debugger.attach()) :

  • Restrictions d'hôte : si la règle d'entreprise ExtensionSettings configure des hôtes bloqués (runtime_blocked_hosts) pour une extension, browser.debugger.attach() est bloqué sur toutes les cibles avec l'erreur "Host access is restricted by policy." (même si des origines individuelles se trouvent dans runtime_allowed_hosts).
  • Règles de capture d'écran et de protection contre la perte de données : si la règle d'entreprise DisableScreenshots désactive la capture d'écran ou si des règles de protection contre la perte de données s'appliquent à la cible, browser.debugger.attach() échoue avec l'erreur "Screenshot capture is restricted by policy.".

Concepts et utilisation

Une fois l'API browser.debugger associée, elle vous permet d'envoyer des commandes du protocole Chrome DevTools (CDP) à une cible donnée. La description détaillée du CDP n'entre pas dans le cadre de cette documentation. Pour en savoir plus sur le CDP, consultez la documentation officielle sur le CDP.

Cibles

Les cibles représentent un élément en cours de débogage, par exemple un onglet, un iFrame ou un worker. Chaque cible est identifiée par un UUID et est associée à un type (par exemple, iframe, shared_worker, etc.).

Une cible peut comporter plusieurs contextes d'exécution. Par exemple, les iFrames d'un même processus n'obtiennent pas de cible unique, mais sont représentés par différents contextes accessibles à partir d'une seule cible.

Domaines restreints

Pour des raisons de sécurité, l'API browser.debugger ne permet pas d'accéder à tous les domaines du protocole Chrome DevTools. Les domaines disponibles sont les suivants : Accessibility, Audits, CacheStorage, Console, CSS, Database, Debugger, DOM, DOMDebugger, DOMSnapshot, Emulation, Fetch, IO, Input, Inspector, Log, Network, Overlay, Page, Performance, Runtime, Storage, Target, Tracing, WebAudio et WebAuthn.

Utiliser des frames

Il n'existe pas de mappage un à un des frames vers les cibles. Dans un même onglet, plusieurs frames d'un même processus peuvent partager la même cible, mais utiliser un contexte d'exécution différent. En revanche, une nouvelle cible peut être créée pour un iFrame hors processus.

Pour l'associer à tous les frames, vous devez gérer chaque type de frame séparément :

  • Écoutez l'événement Runtime.executionContextCreated pour identifier les nouveaux contextes d'exécution associés aux frames du même processus.

  • Suivez la procédure pour associer des cibles associées afin d'identifier les frames hors processus.

Après vous être connecté à une cible, vous pouvez vous connecter à d'autres cibles associées, y compris des frames enfants hors processus ou des workers associés.

À partir de Chrome 125, l'API browser.debugger est compatible avec les sessions plates. Cela vous permet d'ajouter des cibles supplémentaires en tant qu'enfants à votre session de débogage principale et de leur envoyer des messages sans avoir à appeler à nouveau browser.debugger.attach. À la place, vous pouvez ajouter une propriété sessionId lorsque vous appelez browser.debugger.sendCommand pour identifier la cible enfant à laquelle vous souhaitez envoyer une commande.

Pour l'associer automatiquement à des frames enfants hors processus, commencez par ajouter un écouteur pour l'événement Target.attachedToTarget :

browser.debugger.onEvent.addListener((source, method, params) => {
  if (method === "Target.attachedToTarget") {
    // `source` identifies the parent session, but we need to construct a new
    // identifier for the child session
    const session = { ...source, sessionId: params.sessionId };

    // Call any needed CDP commands for the child session
    await browser.debugger.sendCommand(session, "Runtime.enable");
  }
});

Ensuite, activez l'association automatique en envoyant la commande Target.setAutoAttach avec l'option flatten définie sur true :

await browser.debugger.sendCommand({ tabId }, "Target.setAutoAttach", {
  autoAttach: true,
  waitForDebuggerOnStart: false,
  flatten: true,
  filter: [{ type: "iframe", exclude: false }]
});

L'association automatique ne s'associe qu'aux frames dont la cible a connaissance, ce qui est limité aux frames qui sont des enfants immédiats d'un frame qui lui est associé. Par exemple, avec la hiérarchie de frames A -> B -> C (où tous sont interorigines), l'appel de Target.setAutoAttach pour la cible associée à A entraînerait également l'association de la session à B. Toutefois, cela n'est pas récursif. Target.setAutoAttach doit donc également être appelé pour que B associe la session à C.

Exemples

Pour essayer cette API, installez l'exemple d'API de débogueur à partir du dépôt chrome-extension-samples.

Types

Debuggee

Identifiant du débogué. Vous devez spécifier tabId, extensionId ou targetId

Propriétés

  • extensionId

    chaîne facultatif

    ID de l'extension que vous souhaitez déboguer. L'association à une page d'arrière-plan d'extension n'est possible que lorsque le commutateur de ligne de commande --silent-debugger-extension-api est utilisé.

  • tabId

    number facultatif

    ID de l'onglet que vous souhaitez déboguer.

  • targetId

    chaîne facultatif

    ID opaque de la cible de débogage.

DebuggerSession

Chrome 125+ browser.* depuis Chrome 148

Identifiant de session du débogueur. Vous devez spécifier tabId, extensionId ou targetId. Vous pouvez également fournir un ID de session facultatif. Si sessionId est spécifié pour les arguments envoyés depuis onEvent, cela signifie que l'événement provient d'une session de protocole enfant au sein de la session de débogage racine. Si sessionId est spécifié lorsqu'il est transmis à sendCommand, il cible une session de protocole enfant dans la session racine de l'application déboguée.

Propriétés

  • extensionId

    chaîne facultatif

    ID de l'extension que vous souhaitez déboguer. L'association à une page d'arrière-plan d'extension n'est possible que lorsque le commutateur de ligne de commande --silent-debugger-extension-api est utilisé.

  • sessionId

    chaîne facultatif

    ID opaque de la session du protocole Chrome DevTools. Identifie une session enfant dans la session racine identifiée par tabId, extensionId ou targetId.

  • tabId

    number facultatif

    ID de l'onglet que vous souhaitez déboguer.

  • targetId

    chaîne facultatif

    ID opaque de la cible de débogage.

DetachReason

Chrome 44+ browser.* depuis Chrome 148

Motif de la fin de la connexion.

Énumération

"target_closed"

"canceled_by_user"

TargetInfo

Informations sur la cible de débogage

Propriétés

  • associé

    booléen

    "True" si le débogueur est déjà associé.

  • extensionId

    chaîne facultatif

    ID de l'extension, défini si type = "background_page".

  • faviconUrl

    chaîne facultatif

    URL du favicon cible.

  • id

    chaîne

    ID de la cible.

  • tabId

    number facultatif

    ID de l'onglet, défini si type == 'page'.

  • titre

    chaîne

    Titre de la page cible.

  • Type de cible.

  • url

    chaîne

    URL cible.

TargetInfoType

Chrome 44+ browser.* depuis Chrome 148

Type de cible.

Énumération

"page"

"background_page"

"worker"

"other"

Méthodes

attach()

browser.debugger.attach(
  target: Debuggee,
  requiredVersion: string,
): Promise<void>

Associe le débogueur à la cible donnée.

Paramètres

  • Cible de débogage à laquelle vous souhaitez vous associer.

  • requiredVersion

    chaîne

    Version du protocole de débogage requise ("0.1"). Vous ne pouvez vous associer qu'au programme de débogage avec une version majeure correspondante et une version mineure supérieure ou égale. La liste des versions du protocole est disponible sur cette page.

Renvoie

  • Promise<void>

    Chrome 96+ browser.* depuis Chrome 148

    Se résout une fois que l'opération d'association a réussi ou échoué. La promesse est résolue sans valeur. Si l'association échoue, la promesse sera rejetée.

detach()

browser.debugger.detach(
  target: Debuggee,
): Promise<void>

Dissocie le débogueur de la cible donnée.

Paramètres

Renvoie

  • Promise<void>

    Chrome 96+ browser.* depuis Chrome 148

    Se résout une fois que l'opération de dissociation a réussi ou échoué. La promesse est résolue sans valeur. Si l'opération échoue, la promesse est rejetée.

getTargets()

browser.debugger.getTargets(): Promise<TargetInfo[]>

Renvoie la liste des cibles de débogage disponibles.

Renvoie

  • Promise<TargetInfo[]>

    Chrome 96+ browser.* depuis Chrome 148

sendCommand()

browser.debugger.sendCommand(
  target: DebuggerSession,
  method: string,
  commandParams?: object,
): Promise<object | undefined>

Envoie la commande donnée à la cible de débogage.

Paramètres

  • Cible de débogage à laquelle vous souhaitez envoyer la commande.

  • method

    chaîne

    Nom de la méthode. Il doit s'agir de l'une des méthodes définies par le protocole de débogage à distance.

  • commandParams

    objet facultatif

    Objet JSON avec les paramètres de la requête. Cet objet doit être conforme au schéma des paramètres de débogage à distance pour la méthode donnée.

Renvoie

  • Promise<object | undefined>

    Chrome 96+ browser.* depuis Chrome 148

    Corps de la réponse. Si une erreur se produit lors de la publication du message, la promesse sera rejetée.

Événements

onDetach

browser.debugger.onDetach.addListener(
  callback: function,
)

Déclenché lorsque le navigateur met fin à la session de débogage de l'onglet. Cela se produit lorsque l'onglet est fermé ou que les Outils pour les développeurs Chrome sont appelés pour l'onglet associé.

Paramètres

onEvent

browser.debugger.onEvent.addListener(
  callback: function,
)

Se déclenche chaque fois que la cible de débogage émet un événement d'instrumentation.

Paramètres

  • callback

    fonction

    Le paramètre callback se présente comme suit : 

    (source: DebuggerSession, method: string, params?: object) => void