browser.debugger

Descrição

A API chrome.debugger serve como um transporte alternativo para o protocolo de depuração remota do Chrome. Use chrome.debugger para anexar a uma ou mais guias para instrumentar a interação de rede, depurar JavaScript, modificar o DOM e o CSS e muito mais. Use a propriedade tabId de Debuggee para segmentar guias com sendCommand e rotear eventos por tabId de callbacks onEvent.

Permissões

debugger

É necessário declarar a permissão "debugger" no manifesto da extensão para usar essa API.

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

Restrições da política corporativa

Em dispositivos corporativos, algumas políticas podem impedir que as extensões anexem o depurador usando um modelo de tudo ou nada no momento da anexação (browser.debugger.attach()):

  • Restrições de host: se a política corporativa ExtensionSettings configurar hosts bloqueados (runtime_blocked_hosts) para uma extensão, browser.debugger.attach() será bloqueado em todos os destinos com o erro "Host access is restricted by policy.", mesmo que as origens individuais estejam em runtime_allowed_hosts.
  • Políticas de captura de tela e DLP: se a política corporativa DisableScreenshots desativar a captura de tela ou as regras de Prevenção contra perda de dados (DLP) forem aplicadas ao destino, browser.debugger.attach() vai falhar com o erro "Screenshot capture is restricted by policy.".

Conceitos e uso

Depois de anexada, a API browser.debugger permite enviar comandos do Chrome DevTools Protocol (CDP) para um determinado destino. Explicar o CDP em detalhes está fora do escopo desta documentação. Para saber mais sobre o CDP, confira a documentação oficial do CDP.

Destinos

Os destinos representam algo que está sendo depurado, como uma guia, um iframe ou um worker. Cada destino é identificado por um UUID e tem um tipo associado (como iframe, shared_worker e outros).

Em um destino, pode haver vários contextos de execução. Por exemplo, os iframes do mesmo processo não recebem um destino exclusivo, mas são representados como contextos diferentes que podem ser acessados em um único destino.

Domínios restritos

Por motivos de segurança, a API browser.debugger não oferece acesso a todos os domínios do Chrome DevTools Protocol. Os domínios disponíveis são: Acessibilidade, Auditorias, CacheStorage, Console, CSS, Banco de dados, Depurador, DOM, DOMDebugger, DOMSnapshot, Emulação, Busca, E/S, Entrada, Inspetor, Registro, Rede, Sobreposição, Página, Desempenho, Ambiente de execução, Armazenamento, Destino, Rastreamento, WebAudio e WebAuthn.

Trabalhar com frames

Não há um mapeamento de um para um de frames para destinos. Em uma única guia, vários frames do mesmo processo podem compartilhar o mesmo destino, mas usar um contexto de execução diferente. Por outro lado, um novo destino pode ser criado para um iframe fora do processo.

Para anexar a todos os frames, é necessário processar cada tipo de frame separadamente:

  • Detecte o evento Runtime.executionContextCreated para identificar novos contextos de execução associados aos mesmos frames de processo.

  • Siga as etapas para anexar a destinos relacionados para identificar frames fora do processo.

Depois de se conectar a um destino, talvez você queira se conectar a outros destinos relacionados, incluindo frames filhos fora do processo ou workers associados.

A partir do Chrome 125, a API browser.debugger oferece suporte a sessões simples. Isso permite adicionar outros destinos como filhos à sessão principal do depurador e enviar mensagens para eles sem precisar de outra chamada para browser.debugger.attach. Em vez disso, adicione uma propriedade sessionId ao chamar browser.debugger.sendCommand para identificar o destino filho para o qual você quer enviar um comando.

Para anexar automaticamente a frames filhos fora do processo, primeiro adicione um listener para o evento 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");
  }
});

Em seguida, ative a anexação automática enviando o comando Target.setAutoAttach com a opção flatten definida como true:

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

A anexação automática só é feita em frames que o destino conhece, o que é limitado a frames que são filhos imediatos de um frame associado a ele. Por exemplo, com a hierarquia de frames A -> B -> C (em que todos são entre origens), chamar Target.setAutoAttach para o destino associado a A resultaria na sessão também sendo anexada a B. No entanto, isso não é recursivo, então Target.setAutoAttach também precisa ser chamado para que B anexe a sessão a C.

Exemplos

Para testar essa API, instale o exemplo da API debugger do repositório chrome-extension-samples.

Tipos

Debuggee

Identificador do depurado. É preciso especificar tabId, extensionId ou targetId

Propriedades

  • extensionId

    string opcional

    O ID da extensão que você quer depurar. A anexação a uma página de segundo plano de extensão só é possível quando a chave de linha de comando --silent-debugger-extension-api é usada.

  • tabId

    número optional

    O ID da guia que você quer depurar.

  • targetId

    string opcional

    O ID opaco do destino de depuração.

DebuggerSession

Chrome 125+ browser.* desde o Chrome 148

Identificador de sessão do depurador. É preciso especificar tabId, extensionId ou targetId. Além disso, é possível fornecer um sessionId opcional. Se sessionId for especificado para argumentos enviados de onEvent, isso significa que o evento vem de uma sessão de protocolo filho dentro da sessão de depuração raiz. Se sessionId for especificado quando transmitido para sendCommand, ele vai segmentar uma sessão de protocolo filho dentro da sessão de depuração raiz.

Propriedades

  • extensionId

    string opcional

    O ID da extensão que você quer depurar. A anexação a uma página de segundo plano de extensão só é possível quando a chave de linha de comando --silent-debugger-extension-api é usada.

  • sessionId

    string opcional

    O ID opaco da sessão do Chrome DevTools Protocol. Identifica uma sessão filha na sessão raiz identificada por tabId, extensionId ou targetId.

  • tabId

    número optional

    O ID da guia que você quer depurar.

  • targetId

    string opcional

    O ID opaco do destino de depuração.

DetachReason

Chrome 44+ browser.* desde o Chrome 148

Motivo do encerramento da conexão.

Enumeração

"target_closed"

"canceled_by_user"

TargetInfo

Informações de destino de depuração

Propriedades

  • sempre que o disco for anexado

    booleano

    Verdadeiro se o depurador já estiver anexado.

  • extensionId

    string opcional

    O ID da extensão, definido se type = "background_page".

  • faviconUrl

    string opcional

    URL do favicon de destino.

  • ID

    string

    ID de destino.

  • tabId

    número optional

    O ID da guia, definido se type == 'page'.

  • título

    string

    Título da página de destino.

  • Tipo de destino.

  • url

    string

    URL de destino.

TargetInfoType

Chrome 44+ browser.* desde o Chrome 148

Tipo de destino.

Enumeração

"page"

"background_page"

"worker"

"other"

Métodos

attach()

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

Anexa o depurador ao destino especificado.

Parâmetros

  • destino

    Depurado

    Destino de depuração ao qual você quer se conectar.

  • requiredVersion

    string

    Versão do protocolo de depuração necessária ("0.1"). Só é possível se conectar ao depurado com a versão principal correspondente e a versão secundária maior ou igual. A lista de versões do protocolo pode ser encontrada aqui.

Retorna

  • Promessa<void>

    Chrome 96+ browser.* desde o Chrome 148

    É resolvido quando a operação de anexação é concluída ou falha. A promessa é resolvida sem valor. Se a anexação falhar, a promessa será rejeitada.

detach()

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

Desconecta o depurador do destino especificado.

Parâmetros

  • destino

    Depurado

    Destino de depuração do qual você quer se desconectar.

Retorna

  • Promessa<void>

    Chrome 96+ browser.* desde o Chrome 148

    É resolvido quando a operação de desvinculação é concluída ou falha. A promessa é resolvida sem valor. Se a remoção falhar, a promessa será rejeitada.

getTargets()

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

Retorna a lista de destinos de depuração disponíveis.

Retorna

  • Promise<TargetInfo[]>

    Chrome 96+ browser.* desde o Chrome 148

sendCommand()

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

Envia o comando fornecido ao destino de depuração.

Parâmetros

  • destino

    DebuggerSession

    Destino de depuração para o qual você quer enviar o comando.

  • método

    string

    Nome do método. Precisa ser um dos métodos definidos pelo protocolo de depuração remota.

  • commandParams

    objeto optional

    Objeto JSON com parâmetros de solicitação. Esse objeto precisa estar em conformidade com o esquema de parâmetros de depuração remota para o método fornecido.

Retorna

  • Promise<object | undefined>

    Chrome 96+ browser.* desde o Chrome 148

    Corpo da resposta. Se ocorrer um erro ao postar a mensagem, a promessa será rejeitada.

Eventos

onDetach

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

Disparado quando o navegador encerra a sessão de depuração da guia. Isso acontece quando a guia está sendo fechada ou o Chrome DevTools está sendo invocado para a guia anexada.

Parâmetros

onEvent

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

Disparado sempre que o destino de depuração emite um evento de instrumentação.

Parâmetros

  • callback

    função

    O parâmetro callback é semelhante a: 

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