Stetho — o que é, depuração de Android através do Chrome DevTools

O que é o Stetho e como funciona

Stetho é uma biblioteca Java que executa um servidor WebSocket local dentro do aplicativo Android. O Chrome DevTools se conecta a este servidor através de uma porta adb, obtendo acesso aos componentes internos do aplicativo: bancos de dados, requisições de rede, preferências e a hierarquia de views. Toda a comunicação passa pelo Protocolo Chrome DevTools, o que permite usar as ferramentas padrão do navegador sem instalar software adicional.

Arquitetura e componentes

A biblioteca é composta por módulos: stetho (núcleo), stetho-okhttp (interceptação de tráfego através do OkHttp), stetho-urlconnection (interceptação através do HttpURLConnection) e stetho-js-rhino (suporte a plugins JavaScript). O núcleo abre um socket UNIX, ao qual o Chrome se conecta através de adb forward. Cada inspetor é implementado como um plugin separado, registrado na inicialização do Stetho.

Requisitos e limitações

O Stetho suporta Android 4.4+ (API 19) e funciona apenas em builds de depuração. Em dispositivos com Android 11+ é necessária uma permissão INTERNET explícita no manifest. A biblioteca não é oficialmente suportada pelo Facebook desde 2020, mas o código permanece aberto e é usado em projetos legados. Para novos projetos o Google recomenda Android Studio Profiler e Network Inspector.

Conexão e configuração do Stetho em um projeto Android

Conexão é feita através de uma dependência Gradle com a flag debugImplementation para que o Stetho funcione apenas no build de depuração. A inicialização ocorre no método Application.onCreate() com uma única chamada a Stetho.initializeWithDefaults(this). Para o Network Inspector é necessária a integração com OkHttp através de um Interceptor.

// build.gradle (app) — adicionar Stetho
dependencies {
    debugImplementation 'com.facebook.stetho:stetho:1.6.0'
    debugImplementation 'com.facebook.stetho:stetho-okhttp3:1.6.0'
}

// Inicialização na classe Application
public class App extends Application {
    @Override
    public void onCreate() {
        super.onCreate();
        Stetho.initializeWithDefaults(this);
    }
}

Configuração do Network Interceptor

Para interceptar requisições de rede através do OkHttp, adicione StethoInterceptor à cadeia de interceptores. O Stetho registra automaticamente a URL, os cabeçalhos de requisição e resposta, o código de status e o tempo de execução. Os dados são exibidos na aba Network do Chrome DevTools após conectar o dispositivo através de chrome://inspect.

Network Inspector: interceptação de tráfego HTTP

O Network Inspector do Stetho exibe todas as requisições HTTP do aplicativo em ordem cronológica. Para cada requisição estão disponíveis: método, URL, código de status, cabeçalhos de requisição e resposta, corpo da requisição e da resposta (incluindo JSON e dados binários). A aba Preview mostra o corpo da resposta de forma formatada.

Filtragem e busca de requisições

O Chrome DevTools suporta filtragem de requisições por tipo (XHR, JS, CSS, Doc), código de status e domínio. O campo de busca filtra por URL e conteúdo. Para desenvolvimento mobile é útil agrupar requisições por domínio da API e verificar a sequência de chamadas ao testar as telas do aplicativo.

// Cliente OkHttp com interceptor Stetho
OkHttpClient client = new OkHttpClient.Builder()
    .addNetworkInterceptor(new StethoInterceptor())
    .build();

// Executar uma requisição
Request request = new Request.Builder()
    .url("https://api.example.com/users")
    .build();
client.newCall(request).enqueue(callback);

Database Inspector: trabalho com SQLite

O Database Inspector do Stetho se conecta aos bancos de dados SQLite do aplicativo através do Chrome DevTools. Na aba Resources → Web SQL são exibidos todos os bancos abertos, suas tabelas e conteúdos. Estão disponíveis a visualização da estrutura das tabelas, índices e a execução de consultas SQL arbitrárias.

Execução de consultas SQL através do DevTools

No console do Chrome DevTools você pode executar consultas SQL diretamente no banco do aplicativo: SELECT, INSERT, UPDATE, DELETE. Isso é útil para limpar dados antes dos testes, verificar a correção das migrações e corrigir manualmente registros incorretos sem reconstruir o aplicativo. Todas as alterações são imediatamente visíveis no dispositivo.

Dumpapp e plugins personalizados

Dumpapp é a interface de shell do Stetho que permite executar comandos personalizados através de adb. Os plugins Dumpapp são registrados na inicialização do Stetho e podem exportar qualquer estado do aplicativo: cache, configurações, estado do contêiner DI. Os comandos são executados como adb forward tcp:12345 localabstract:stetho_dumpapp.

Criação de um plugin Dumpapp personalizado

O plugin implementa a interface DumperContext e é registrado através de Stetho.initialize com um InspectorModules personalizado. O exemplo abaixo mostra um plugin para despejar SharedPreferences: os dados são serializados em JSON e exibidos no terminal através de um comando adb.

// Plugin Dumpapp personalizado para SharedPreferences
public class PrefsDumper implements DumperContext {
    @Override
    public String getName() {
        return "prefs";
    }
    @Override
    public void dump(DumperContext ctx) {
        SharedPreferences sp = ctx.getContext()
            .getSharedPreferences("app_prefs", Context.MODE_PRIVATE);
        ctx.getStdout().println(sp.getAll().toString());
    }
}

Stetho vs Android Studio Inspector: comparação

O Android Studio fornece ferramentas de criação de perfil integradas: Network Profiler, Database Inspector e View Inspector, introduzidas no Android Studio 4.1+. O Stetho foi popular antes da introdução dessas ferramentas e continua relevante para projetos que usam OkHttp e exigem integração com o Chrome DevTools.

Quando escolher o Stetho

O Stetho é justificado em projetos legados onde o OkHttp já é usado e a equipe está acostumada ao Chrome DevTools. Para novos projetos o Android Studio Inspector cobre a maioria dos cenários de depuração. No entanto, o Chrome DevTools continua mais conveniente para consultas SQLite: o console integrado com autocompletar de SQL é mais rápido que cliques sequenciais na IDE.

Inspeção da hierarquia de views através do Stetho

A View Hierarchy no Stetho é exibida na aba Elements do Chrome DevTools como uma árvore semelhante ao DOM. Cada View é representada como um elemento HTML com atributos: id, layout_width, layout_height, padding, margin, visibility e texto. As alterações na árvore são sincronizadas em tempo real ao girar a tela ou atualizar a UI.

Visualizar e alterar propriedades

Ao selecionar um elemento na árvore, você pode visualizar suas propriedades no painel Styles, de forma semelhante à inspeção de páginas web. O Stetho exibe tamanhos calculados, preenchimentos, cor de fundo e estado (pressed, focused, enabled). Alterar algumas propriedades no DevTools é aplicado imediatamente ao aplicativo, o que acelera a seleção de parâmetros de UI sem reconstruir.

Busca de vazamentos de memória com o View Inspector

O Stetho ajuda a detectar vazamentos de memória relacionados a View: se uma Activity não é destruída após finish(), sua View raiz permanece na árvore. Através da verificação regular da aba Elements você pode notar Activities fantasmas e encontrar a fonte do vazamento — geralmente referências estáticas a Context ou diálogos não fechados.

Técnicas práticas de depuração

O Stetho é eficaz para verificar a serialização JSON antes de enviá-la ao servidor. Abra o Network Inspector, encontre a requisição e visualize o corpo no modo Raw para verificar a estrutura dos dados e a correção dos campos.

Depuração de SQLiteOpenHelper

O Stetho exibe todos os bancos criados através de SQLiteOpenHelper. Se o banco não aparecer no Chrome DevTools, verifique se getWritableDatabase() foi chamado pelo menos uma vez no código do aplicativo.

Ordem dos interceptores no OkHttp

O Stetho deve ser o último interceptor na cadeia do OkHttp para ver requisições modificadas. A ordem correta: AuthInterceptor primeiro, depois LoggingInterceptor, depois StethoInterceptor por último.

Técnicas práticas de depuração com Stetho

O Stetho é eficaz para verificar a correção da serialização JSON antes de enviá-la ao servidor. Abra o Network Inspector, encontre a requisição e visualize o corpo da requisição no modo Raw para garantir a correção da estrutura dos campos e dos tipos de dados.

Depuração de SQLiteOpenHelper e ContentProvider

O Stetho exibe todos os bancos de dados criados através de SQLiteOpenHelper. Se o banco não aparecer no Chrome DevTools, verifique se o método getWritableDatabase() foi chamado pelo menos uma vez no código do aplicativo. Para migrações, execute ALTER TABLE através do console SQL e verifique o resultado com uma consulta SELECT.

Ordem dos interceptores na cadeia do OkHttp

O Stetho deve ser o último interceptor na cadeia do OkHttp para exibir as requisições modificadas finais. A sequência correta: AuthInterceptor primeiro, depois LoggingInterceptor, depois StethoInterceptor por último para um registro correto.