Debuggable Browser

David Pertiller

Over deze app

Wat is het?
Gewoon een WebView voor foutopsporing, waarmee u Chrome's Developer Tools (uitgevoerd op uw pc of Mac) kunt gebruiken om uw web-app te inspecteren en te debuggen terwijl deze op uw daadwerkelijke apparaat wordt uitgevoerd .

Alleen bedoeld voor webontwikkelaars en webontwerpers
Deze app is gemaakt voor webontwikkelaars die de beste gebruikerservaring van hun web-app willen bieden aan Android-gebruikers. Als je geen webontwikkelaar of webontwerper bent die geïnteresseerd is in het debuggen van webapps, dan ben je waarschijnlijk beter af met een normale browser;)


Wat heeft het voor zin?
Als u ooit uw website in de Android-voorraadbrowser hebt geopend en een van de volgende problemen tegenkomt, kan deze app nuttig voor u zijn:
& # 8226; & # 8195; De lay-out of vormgeving van uw website lijkt verbroken wanneer bekeken in de Android-stockbrowser
& # 8226; & # 8195; Uw JavaScript -code heeft niet het verwachte resultaat opgeleverd of de berekening moet tijdens de uitvoering plotseling zijn gestopt (misschien is er een uitzondering opgetreden?)
& # 8226; & # 8195; Animaties zijn laggy of animeren niet zoals verwacht

Beschrijving
Het komt soms voor dat een webapp niet werkt in mobiele browsers, ook al werkt het prima in desktopbrowsers. Erger nog, soms treden defecten alleen op op (bepaalde) mobiele apparaten, dus u kunt het niet simuleren en reproduceren op een desktopbrowser. Dit is waar foutopsporing op afstand met Chrome's DevTools nuttig blijkt te zijn. Hoewel Chrome voor Android dit al perfect ondersteunt, doet de Android-stockbrowser dat niet. Dit is jammer, omdat veel Android-bugs alleen lijken te voorkomen in de standaardbrowser en sowieso niet in Chrome.
Dus met deze app kun je websites uitvoeren in de native browser (WebView), terwijl je de mogelijkheid hebt om inspecteer en debug de pagina met de Chrome DevTools.

Hoe kan ik debugging op afstand starten?
1. Schakel de ontwikkelaarsmodus in op uw Android-apparaat en sluit deze aan op uw pc / Mac
2. Open deze app en navigeer naar uw website door de URL in te voeren
3. Open Chrome op uw pc / Mac en typ "chrome: // inspect" in de adresbalk
4. Vink in Chrome "Discover USB Devices" aan en het zal de webpagina weergeven die je op je apparaat hebt geopend
5. Druk op inspecteren en geniet van het op afstand debuggen van de app met de Chrome Developer Tools

Lees voor meer informatie: https://www.pertiller.tech/blog/remote-debugging-the-android-native-browser

Wat is er nieuw

Integrated your feedback

- It's been exactly 1 year since the last release and I noticed that this app led to some confusion for a lot of people that misunderstood its use-case: it's built for web developers who want to optimize their web app with the power of Chrome's dev tools while running the page on an actual Android device (see updated notes).
- Besides, I got some lovely suggestions. So now you can start the app as intent from another app to start debugging a weblink right away!