Cómo depurar javascript en webview en Android

Tengo una vista web que funciona bien en iOS, pero no en Android. ¿Hay alguna herramienta en la que pueda conectarme a la vista web de Android en el browser y depurarlo usando la console de Firefox o webkit? Actualmente no tengo idea de qué está causando que la vista web no funcione en Android.

En iOS, puedo abrir mi simulador de iPad o iPhone, abrir el panel de vista web y, en mi browser de escritorio, escucho el puerto 9999 y me muestra las herramientas que ves en la herramienta de desarrollo / herramientas de debugging de webkit.

Estoy buscando una herramienta similar para Android, o al less para comenzar a depurar.

Echa un vistazo a weinre . Proporciona herramientas parecidas a desarrolladores de Chrome para depurar desde browseres WebKit a browseres que se ejecutan en dispositivos remotos.

Si no estás usando Android 4.4 , de acuerdo con http://developer.android.com/guide/webapps/debugging.html vas a disfrutar de la vieja forma de depurar …

Si no tiene un dispositivo con Android 4.4 o superior, puede depurar su JavaScript usando las API de JavaScript de la console y ver los posts de salida para logcat.

Para Android 4.4 y mejor , disfrutará de la debugging remota, consulte https://developers.google.com/chrome-developer-tools/docs/remote-debugging#debugging-webviews.

Al iniciar Android 4.4 (KitKat), puede usar DevTools para depurar el contenido de Android WebViews dentro de las aplicaciones nativas de Android.

La forma más fácil de depurar WebView es conectar su dispositivo Android a la PC por USB e inspeccionar sus herramientas de desarrollo WebView by Chrome.

Entonces, necesitarás:

1) Active la debugging USB en nuestro dispositivo. Puede encontrarlo Settings >> Developer Options >> Debugging >> USB Debugging (active la checkbox)

2) Conecte su dispositivo a la computadora por USB

Nota: Si está desarrollando en Windows, instale el controller USB adecuado para su dispositivo. Consulte los controlleres OEM USB en el website de los desarrolladores de Android.

3) Abra el browser Chrome y escriba el campo URL: chrome://inspect/#devices

4) Confirme que 'Descubrir dispositivos USB' esté activado.

5) En su dispositivo, una alerta le solicita que permita la debugging de USB desde su computadora. Presiona Aceptar.

6) En la pantalla chrome: // inspecciona todos los dispositivos conectados. Haga clic en inspect para el dispositivo conectado y obtendrá la console.

El manual más detallado es la debugging de Android WebView

Si buscas una solución para depurar tu código javascript que se ejecuta dentro de una vista web, entonces echa un vistazo a jsHybugger, un depurador JavaScript / HTML5 / CSS para las visiones web de Android.

http://www.jshybugger.org

Estos son los pasos que uso para depurar un contenido de WebView en un dispositivo:

  1. Modo de desarrollador habilitado en su dispositivo
  2. Conecta el dispositivo a la PC y habilita la debugging del USB (instala el controller si es necesario)
  3. Agregue esta línea en su class de Application personalizada o en la Activity donde se carga la vista web.

     //if your build is in debug mode, enable inspecting of webviews if (0 != (getApplicationInfo().flags & ApplicationInfo.FLAG_DEBUGGABLE)) { WebView.setWebContentsDebuggingEnabled(true); } 
  4. Abra Chrome y vaya a chrome://inspect y debería ver su dispositivo en la list de destino remoto

  5. Comienza a depurar tu aplicación desde Android Studio
  6. Cuando se agregue un WebView al layout, en la pestaña que abrió aparecerá una captura de pantalla con un button de Inspección, haga clic allí y se abrirá una console de desarrollador de Chrome

He trabajado con una vista web usando javascript en mi proyecto anterior y encontré el mismo problema. No encontré una forma de depurar mi código directamente, pero utilicé una interfaz javascript para enviar información a mi actividad. De esta forma, puede registrar las actividades de su javascript o mostrar algunos posts de Toast.

Cuando no se llaman los methods de Java, generalmente significa que ha cometido algún tipo de error en su código JS.

Sé que esta no es una solución de alta tecnología para su problema, pero al less es algo, y funcionó para mí.

Buena suerte, Wottah

Intente acceder a ADB Logcat del dispositivo instalando adb en su escritorio …