• Ramon Ferreira Silva

Como fazer a depuração de Aplicativos Híbridos no seu Aparelho

Atualizado: 10 de Jul de 2019



IONIC Framework, usado para criar aplicativo híbridos para mobile

Durante o desenvolvimento de um aplicativo híbrido, me deparei com a dificuldade de debugar o código que estava rodando no aparelho. Por se tratar de um aplicativo Híbrido, criado com o framework IONIC e rodando no aparelho através do phonegap, tive dificuldades em conseguir debugar o código.


Usando o Chrome para depurar Aplicativos Híbridos que estão rodando no Android


Procurando na Web encontrei várias solução com o usando o logcat, mas nenhuma me atendeu. Quando eu já estava desistindo me deparei com uma solução usando o Navegador Web Google Chrome.

Basta ir no navegador e digitar


chrome://inspect/#devices


Se o seu aparelho estiver ligado por USB ao computador e com o debug ativado você conseguirá debugar qualquer aplicativo híbrido que estiver rodando no seu aparelho.

Inspecionando aplicativos Híbridos que estão rodando no aparelho

Usando o IONIC livereload com ConsoleLogs


Uma segunda opção é usar o ionic live reload com a opção –consolelogs. Para isto basta rodar a aplicação com o comando

ionic run android --livereload --consolelogs

A opção –consolelogs só funciona com o aparelho ligado em debug por USB e em conjunto com a opção –livereload.

Visualização dos logs do aplicativo híbrido que está rodando no aparelho

Usando o Chrome para depurar Aplicativos Híbridos que estão rodando no Iphone


O Iphone também possui um suporte a depuração. Para isso devemos usar o depurador do Safari.

Conecte o seu iphone por USB no seu Mac (no windows não funciona). No seu aparelho vá em Configurações >> Safari >> Avançado >> Inspetor Web  e ligue-o.

Ligando o Inspetor Web do Iphone

Em seguida, no Safari do Mac, vá em Desenvolvedor >> [Seu_Aparelho] >> [Página_a_ser_depurada]


Depuração de Aplicativos Híbridos usando o Safari

Como isso você terá acesso ao console de erros do safari conectado ao aplicativos híbrido que está rodando no seu aparelho.


Finalizando


Debugar o javascript que está rodando no seu aplicativo híbrido nem sempre é fácil, mas o Android provê uma série de ferramentas para tornar esse trabalho possível, ainda estamos longe de uma cenários ideal, como por exemplo debugar linha a linha usando o chrome, mas com a evolução dessas ferramentas, nós só temos a ganhar.

Até a próxima.

#Dicas #phonegap #Debug #cordova #IONIC #Android #html #javascript

2 visualizações