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

Vous pouvez utiliser les Outils de développement intégrés au navigateur Chrome exécuté sur votre ordinateur 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ébogage à distance des 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 à partir des Outils pour les développeurs Chrome

Par défaut, la WebView de votre application n'active pas les connexions à partir des Outils pour les développeurs Chrome. Vous devez activer le débogage de la WebView dans le code de votre application.

  1. Assurez-vous d'être configuré pour exécuter votre application sur un appareil physique ou virtuel physique.
  2. Activez le débogage de la 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 builds de développement, et non en production. Ce paramètre s'applique à toutes les WebViews de votre application.

Le débogage de la 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 de la WebView uniquement lorsque l'indicateur debuggable est défini sur true, testez cet indicateur au moment de l'exécution, comme illustré 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

Une fois que vous avez activé le débogage de la WebView dans le code de votre application et que votre application est exécutée sur un appareil physique ou sur l'Android Emulator, connectez les Outils pour les développeurs 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étecter les appareils USB est cochée. Recherchez votre appareil dans la section Cible à distance.

    Page d'inspection des outils pour les développeurs Chrome affichant les cibles distantes disponibles pour le débogage
    Figure 1. Page d'inspection des Outils pour les développeurs 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, 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 des 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 à partir d'une WebView pour savoir comment vous y connecter depuis votre appareil ou votre émulateur. Pour résoudre les problèmes, consultez Déboguer à distance des appareils Android et Débogage à distance des WebViews.