Adobe Shadow: Remote-Debugging für den mobilen Browser

Adobe Shadow ist ein interessantes neues Tool von Adobe, das als Betaversion in den Adobe Labs heruntergeladen werden kann. Es ermöglicht eine Remote-Verbindung zu einem Browser auf iOS- oder Android-Devices. Außerdem kann man über die gewohnten Entwicklerwerkzeuge ein Remote-Debugging durchführen.

Was kann Adobe Shadow?

Die Devices zeigen die Webseite des Desktop-Browsers

Shadow ermöglicht eine Remote-Verbindung zu einem Browser auf dem mobilen Device. Konkret heißt dies: Man surft eine Seite im Browser des Desktop-Rechners an, worauf sich diese Seite automatisch im mobilen Browser öffnet. Dies funktioniert auch mit mehreren Devices, so dass man ein komplettes Gerät-Set „fernsteuern“ kann. Verantwortlich für die Synchronisierung ist eine Browser-Extension auf dem Desktop-Rechner.

Remote Debugging

Bei Bedarf kann man eine spezielle Variante des Web Inspectors starten, dem Pendant zu Firebug in der Webkit-Welt. Dadurch hat man wie gewohnt Zugriff z.B. auf den Quellcode oder die Styles. Manipuliert man etwas im HTML-Code, ändert man einen Style oder führt JavaScript-Code in der Konsole aus, lassen sich die Auswirkungen direkt auf dem Gerät beurteilen. Selbst das Hervorheben des UI-Elements beim Mouseover über ein HTML-Element im Quellcode funktioniert.

Wie funktioniert Shadow?

Shadow besteht aus 3 Teilen:

• Eine Browser-Extension für Chrome dient zur Steuerung. Das aktuelle Fenster wird mit den gewünschten Devices synchronisiert.
• Jedes Devices braucht eine App, die aus dem entsprechenden App-Store heruntergeladen werden kann. In dieser App wird dann die mobile Website angezeigt.
• Damit die Verbindung zwischen den Geräten im Netz aufgebaut werden kann, wird eine kleine Anwendung benötigt, die lediglich auf dem Desktop im Hintergrund laufen muss.

Link: Adobe Shadow