web-dev-qa-db-fra.com

Déboguez iOS 6 + 7 Mobile Safari à l'aide de Chrome DevTools

iOS 6 est livré avec un support intégré pour le débogage à distance ( screencast 1 minute ). Il joue Nice avec le nouveau Safari Web Inspector qui semble être un fork de 1 an de WebKit Inspector. Il manque certaines fonctionnalités telles que l'édition JS et l'inspection des cadres WebSocket.

L'inspecteur Web de Safari utilise le protocole de débogage à distance WebKit. Cependant, Safari n'utilise pas TCP/HTTP comme couche de transport, ce qui le rend incompatible avec Chrome.

dit Timothy Hatcher (alias Xenon), Apple employe

  • Qu'est-ce que Safari utilise pour la couche de transport?
  • Puis-je créer un proxy à partir de cette mystérieuse couche de transport vers HTTP pour le faire fonctionner avec Chrome DevTools?
iossafarimobile-safarigoogle-chrome-devtoolsweb-inspector
78
NVI

Le projet iOS WebKit Debug Proxy permet cela.

screenshot

Pour commencer, installez avec homebrew:

brew install ios-webkit-debug-proxy

Exécutez le simulateur (si vous exécutez le simulateur):

SIM_DIR=/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer
  "$SIM_DIR/Applications/iPhone Simulator.app/Contents/MacOS/iPhone Simulator" \
  -SimulateApplication \
  $SIM_DIR/SDKs/iPhoneSimulator6.1.sdk/Applications/MobileSafari.app/MobileSafari

Exécutez le proxy:

ios_webkit_debug_proxy

Vérifier les erreurs

Recherchez sur l'appareil un message d'erreur:

Impossible de se connecter à lockdownd. Sortie: Aucun fichier ou répertoire de ce type. Impossible de joindre l'inspecteur ios_webkit_debug_proxy

Ensuite, vérifiez l'appareil pour une invite comme ceci (exemple iOS 7:)

Faire confiance à l'ordinateur actuellement connecté?

Choisissez "Trust" et essayez de relancer le proxy:

ios_webkit_debug_proxy

Ouvrir les devtools par défaut

Ouvrez ensuite http://localhost:9221

Les DevTools sont, par défaut, une version plus ancienne (de Chrome 18 vers mars 2012).

Essayez les devtools modernes

En raison de protocole changements, certaines parties du frontend DevTools moderne peuvent ne pas fonctionner complètement. Vous pouvez essayer en ouvrant

chrome-devtools://devtools/bundled/inspector.html?ws=localhost:9222/devtools/pag‌​e/2

où les valeurs port et page sont les valeurs que vous voyez à partir de http://localhost:9221. Encore une fois, cela peut en effet être buggé.

Lisez plus de documents sur la page du projet ios-webkit-debug-proxy .

Mise à jour: Cela fonctionne avec iOS7 également . Mise à jour : Ajout de nouvelles instructions frontales devtools via patrick .. Mise à jour : Changement de devtools.html en inspector.html pour Chrome 45 , et le nouveau ws hack via Scheintod.

93
NVI

Selon https://github.com/andydavies/node-iosdriver ,

Safari utilise les mêmes commandes de débogage que Chrome mais enveloppé sous forme de listes binaires sur RPC plutôt que JSON sur les websockets.

Donc, oui, il serait possible d'écrire un proxy.

J'ai trouvé ce fil en regardant ce que TCP connexions Safari faisait en étant connecté à l'inspecteur MobileSafari, voyant qu'il était connecté à un processus appelé webinspectord et googler que:

# pgrep -lf /Applications/Safari.app
33170 /Applications/Safari.app/Contents/MacOS/Safari -psn_0_21144617
# lsof -p 33170 | grep TCP
Safari  33170 ryan   16u    IPv6 0x799d5f43b472a241       0t0      TCP localhost:54892->localhost:27753 (ESTABLISHED)
# lsof -i :27753
COMMAND     PID USER   FD   TYPE             DEVICE SIZE/OFF NODE NAME
launchd     371 ryan   42u  IPv6 0x799d5f43b472aa01      0t0  TCP localhost:27753 (LISTEN)
Safari    33170 ryan   16u  IPv6 0x799d5f43b472a241      0t0  TCP localhost:54892->localhost:27753 (ESTABLISHED)
webinspec 33182 ryan    6u  IPv6 0x799d5f43b472aa01      0t0  TCP localhost:27753 (LISTEN)
webinspec 33182 ryan    7u  IPv6 0x799d5f43b181a621      0t0  TCP localhost:27753->localhost:54892 (ESTABLISHED)
# ps p 33182
  PID   TT  STAT      TIME COMMAND
33182   ??  S      0:00.28 /Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimulator6.1.sdk/usr/libexec/webinspectord
3
also