Stetho — co to je, ladění Androidu přes Chrome DevTools

Co je Stetho a jak funguje

Stetho — Java knihovna, která spouští lokální server WebSocket uvnitř aplikace pro Android. Chrome DevTools se k tomuto serveru připojí přes port adb a získá přístup k vnitřním součástem aplikace: databázím, síťovým požadavkům, preferences a hierarchii view. Veškerá komunikace probíhá přes protokol Chrome DevTools Protocol, což umožňuje používat standardní nástroje prohlížeče bez instalace dalšího softwaru.

Architektura a součásti

Knihovna se skládá z modulů: stetho (jádro), stetho-okhttp (zachycení provozu přes OkHttp), stetho-urlconnection (zachycení přes HttpURLConnection) a stetho-js-rhino (podpora pluginů JavaScript). Jádro otevírá socket UNIX, ke kterému se Chrome připojuje přes adb forward. Každý inspektor je implementován jako samostatný plugin registrovaný při inicializaci Stetho.

Požadavky a omezení

Stetho podporuje Android 4.4+ (API 19) a funguje pouze v sestaveních debug. Na zařízeních s Android 11+ je vyžadováno výslovné oprávnění INTERNET v manifestu. Knihovna není od roku 2020 oficiálně podporována společností Facebook, ale kód zůstává otevřený a používá se v projektech legacy. Pro nové projekty Google doporučuje Android Studio Profiler a Network Inspector.

Připojení a konfigurace Stetho v projektu pro Android

Připojení se provádí přes závislost Gradle s příznakem debugImplementation, aby Stetho fungovalo pouze v sestavení debug. Inicializace probíhá v metodě Application.onCreate() jediným voláním Stetho.initializeWithDefaults(this). Pro Network Inspector je vyžadována integrace s OkHttp přes Interceptor.

// build.gradle (aplikace) — připojení Stetho
dependencies {
    debugImplementation 'com.facebook.stetho:stetho:1.6.0'
    debugImplementation 'com.facebook.stetho:stetho-okhttp3:1.6.0'
}

// Inicializace ve třídě Application
public class App extends Application {
    @Override
    public void onCreate() {
        super.onCreate();
        Stetho.initializeWithDefaults(this);
    }
}

Konfigurace Network Interceptor

Pro zachycení síťových požadavků přes OkHttp přidejte StethoInterceptor do řetězce interceptorů. Stetho automaticky zaznamenává URL, hlavičky požadavku a odpovědi, stavový kód a dobu provádění. Data se zobrazují na kartě Network v Chrome DevTools po připojení k zařízení přes chrome://inspect.

Network Inspector: zachycení HTTP provozu

Network Inspector nástroje Stetho zobrazuje všechny požadavky HTTP aplikace v chronologickém pořadí. Pro každý požadavek jsou k dispozici: metoda, URL, stavový kód, hlavičky požadavku a odpovědi, tělo požadavku a odpovědi (včetně JSON a binárních dat). Karta Preview zobrazuje tělo odpovědi ve formátované podobě.

Filtrování a hledání požadavků

Chrome DevTools podporuje filtrování požadavků podle typu (XHR, JS, CSS, Doc), stavového kódu a domény. Vyhledávací pole filtruje podle URL a obsahu. Pro mobilní vývoj je užitečné seskupovat požadavky podle domény API a kontrolovat pořadí volání při testování obrazovek aplikace.

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

// Provedení požadavku
Request request = new Request.Builder()
    .url("https://api.example.com/users")
    .build();
client.newCall(request).enqueue(callback);

Database Inspector: práce s SQLite

Database Inspector nástroje Stetho se připojuje k databázím SQLite aplikace přes Chrome DevTools. Na kartě Resources → Web SQL se zobrazují všechny otevřené databáze, jejich tabulky a obsah. K dispozici je prohlížení struktury tabulek, indexů a provádění libovolných dotazů SQL.

Provádění dotazů SQL přes DevTools

V konzoli Chrome DevTools lze provádět dotazy SQL přímo k databázi aplikace: SELECT, INSERT, UPDATE, DELETE. To je užitečné pro čištění dat před testováním, kontrolu správnosti migrací a ruční opravu nesprávných záznamů bez přestavby aplikace. Všechny změny jsou okamžitě viditelné na zařízení.

Dumpapp a vlastní pluginy

Dumpapp — rozhraní shell nástroje Stetho, které umožňuje provádět vlastní příkazy přes adb. Pluginy Dumpapp se registrují při inicializaci Stetho a mohou exportovat libovolný stav aplikace: mezipaměť, nastavení, stav kontejneru DI. Příkazy se provádějí jako adb forward tcp:12345 localabstract:stetho_dumpapp.

Vytvoření vlastního pluginu Dumpapp

Plugin implementuje rozhraní DumperContext a registruje se přes Stetho.initialize s vlastním InspectorModules. Následující příklad ukazuje plugin pro dump SharedPreferences: data se serializují do JSON a zobrazí se v terminálu přes příkaz adb.

// Vlastní plugin Dumpapp pro 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: srovnání

Android Studio poskytuje vestavěné nástroje profilování: Network Profiler, Database Inspector a View Inspector, které se objevily v Android Studio 4.1+. Stetho bylo populární před zavedením těchto nástrojů a zůstává aktuální pro projekty používající OkHttp a vyžadující integraci s Chrome DevTools.

Kdy zvolit Stetho

Stetho je opodstatněné v projektech legacy, kde se OkHttp již používá a tým je zvyklý na Chrome DevTools. Pro nové projekty Android Studio Inspector pokrývá většinu scénářů ladění. Chrome DevTools je však stále pohodlnější pro dotazy SQLite: vestavěná konzole s automatickým doplňováním SQL je rychlejší než postupné klikání v IDE.

Kontrola View Hierarchy přes Stetho

View Hierarchy se v Stetho zobrazuje na kartě Elements v Chrome DevTools jako strom podobný DOM. Každý View je reprezentován jako prvek HTML s atributy: id, layout_width, layout_height, padding, margin, visibility a text. Změny ve stromu se synchronizují v reálném čase při otočení obrazovky nebo aktualizaci UI.

Prohlížení a změna vlastností

Výběrem prvku ve stromu lze prohlížet jeho vlastnosti na panelu Styles — podobně jako při kontrole webových stránek. Stetho zobrazuje vypočítané rozměry, mezery, barvu pozadí a stav (pressed, focused, enabled). Změna některých vlastností v DevTools se okamžitě použije na aplikaci, což urychluje výběr parametrů UI bez přestavby.

Hledání úniků paměti přes View Inspector

Stetho pomáhá odhalit úniky paměti související s View: pokud se Activity po finish() nezničí, její kořenový View zůstává ve stromu. Pravidelnou kontrolou karty Elements lze zaznamenat fantomové Activity a najít zdroj úniku — obvykle jde o statické odkazy na Context nebo neuzavřené dialogy.

Praktické techniky ladění

Stetho je účinné pro kontrolu serializace JSON před odesláním na server. Otevřete Network Inspector, najděte požadavek a prohlédněte si tělo v režimu Raw pro kontrolu struktury dat a správnosti polí.

Ladění SQLiteOpenHelper

Stetho zobrazuje všechny databáze vytvořené přes SQLiteOpenHelper. Pokud se databáze nezobrazuje v Chrome DevTools — ověřte, že getWritableDatabase() byl v kódu aplikace zavolán alespoň jednou.

Pořadí Interceptor v OkHttp

Stetho musí být posledním interceptor v řetězci OkHttp, aby viděl upravené požadavky. Správné pořadí: AuthInterceptor first, poté LoggingInterceptor, a na konci StethoInterceptor.

Praktické techniky ladění se Stetho

Stetho je účinné pro kontrolu správnosti serializace JSON před odesláním na server. Otevřete Network Inspector, najděte požadavek a prohlédněte si tělo požadavku v režimu Raw, abyste si ověřili správnost struktury polí a typů dat.

Ladění SQLiteOpenHelper a ContentProvider

Stetho zobrazuje všechny databáze vytvořené přes SQLiteOpenHelper. Pokud se databáze nezobrazuje v Chrome DevTools — ověřte, že metoda getWritableDatabase() byla v kódu aplikace zavolána alespoň jednou. Pro migrace proveďte ALTER TABLE přes konzoli SQL a výsledek zkontrolujte dotazem SELECT.

Pořadí Interceptor v řetězci OkHttp

Stetho musí být posledním interceptor v řetězci OkHttp, aby zobrazoval konečné upravené požadavky. Správná sekvence: AuthInterceptor první, poté LoggingInterceptor, a na konci StethoInterceptor pro správné protokolování.