Déboguer à l'aide des outils pour les développeurs Chrome

Vous pouvez utiliser les outils pour les développeurs intégrés au navigateur Chrome exécuté sur votre machine de développement pour inspecter et déboguer à distance les WebViews exécutées dans votre application. Pour obtenir un guide détaillé sur le débogage à distance des WebViews, consultez Déboguer à distance les WebViews.

Pour en savoir plus sur les outils pour les développeurs, consultez Présentation des outils pour les développeurs Chrome.

Activer la connexion depuis les Outils pour les développeurs Chrome

Par défaut, la WebView de votre application n'autorise pas les connexions depuis les outils de développement Chrome. Vous devez activer le débogage WebView dans le code de votre application.

  1. Assurez-vous d'être prêt à exécuter votre application sur un appareil ou un appareil virtuel.
  2. Activez le débogage WebView dans le code de votre application en appelant setWebContentsDebuggingEnabled. Cette opération est généralement effectuée dans la classe Activity ou Application où la WebView est initialisée.

Nous vous recommandons d'encapsuler setWebContentsDebuggingEnabled dans une vérification conditionnelle afin que le débogage ne soit activé que dans les versions de développement, et non dans celles de production. Ce paramètre s'applique à toutes les WebViews de votre application.

Le débogage WebView n'est pas affecté par l'état de l'indicateur debuggable dans le fichier manifeste de l'application. Si vous souhaitez activer le débogage WebView uniquement lorsque l'indicateur debuggable est défini sur true, testez cet indicateur au moment de l'exécution, comme indiqué dans l'exemple suivant :

Kotlin

if (applicationInfo.flags and ApplicationInfo.FLAG_DEBUGGABLE != 0) {
     WebView.setWebContentsDebuggingEnabled(true)
}

Java

if (0 != (getApplicationInfo().flags & ApplicationInfo.FLAG_DEBUGGABLE)) {
     WebView.setWebContentsDebuggingEnabled(true);
}

Commencer à déboguer votre WebView

Après avoir activé le débogage WebView dans le code de votre application et que celle-ci s'exécute sur un appareil physique ou sur l'émulateur Android, connectez les outils de développement Chrome à votre WebView :

  1. Ouvrez Chrome sur votre ordinateur de développement.
  2. Accédez à chrome://inspect.

  3. Sur la page chrome://inspect, assurez-vous que l'option Découvrir les périphériques USB est cochée. Recherchez votre appareil dans la section Remote Target (Cible distante).

    Page d'inspection des outils de développement Chrome affichant les cibles distantes disponibles pour le débogage
    Figure 1. Page "Inspecter" des outils de développement Chrome affichant les cibles à distance disponibles pour le débogage.

  4. Sous le nom de votre appareil, Chrome liste toutes les WebViews compatibles avec le débogage qui s'exécutent sur cet appareil. Elles sont généralement identifiées par WebView dans, suivi du nom du package de l'application. Recherchez la WebView que vous souhaitez déboguer, puis cliquez sur le lien inspect (inspecter).

Une nouvelle instance d'outils de développement s'ouvre. Vous pouvez l'utiliser pour inspecter votre WebView.

Si vous diffusez du contenu à partir d'un serveur Web local sur votre ordinateur de développement, consultez Accéder à un serveur de développement local depuis WebView pour savoir comment vous y connecter depuis votre appareil ou votre émulateur. Pour le dépannage, consultez Déboguer à distance des appareils Android et Déboguer à distance des WebViews.