Wie debuggen Sie CSS im nativen Android-Browser?

Ich baue eine Hybrid-App mit Cordova für Android. Das HTML5/CSS3 wird ordnungsgemäß mit Chrome für Desktop und Chrome für Android gerendert.Wie debuggen Sie CSS im nativen Android-Browser?

Durch Cordova wird HTML5/CSS3 jedoch mit dem nativen Browser (die Anwendung namens "Internet") gerendert. Und es scheint, dass es einige Probleme mit der CSS-Interpretation gibt.

Firefox hat Firebug, und Chrome hat ein Entwickler-Panel, das auf dem Desktop für Remote-Debugging verfügbar ist. Kennen Sie ein ähnliches Tool, das ich verwenden könnte, um das CSS effizient den mobilen nativen Browser zu debuggen?

Quelle

2013-05-21 Yako

fand ich endlich Weinre. Diese Lösung gehört zum Cordova-Projekt. http://people.apache.org/~pmuellr/weinre/docs/latest/

Quelle

2013-05-25 08:32:07 Yako

Fehler 404? Github: https://github.com/apache/cordova-weinre – dragoeco

Letzte Veröffentlichung in GitHub von Weinre ist ** vom Oktober 2014 **. Ich habe geschrieben, wie ** Chrome Entwickler Tools Window ** [hier] (https://stackoverflow.com/questions/16678239/how-to-debug-css-in-android-native-browser/40569745#40569745) – JavierFuentes

-3

Verwendung Konsole JavaScript API click here for more information

Quelle

2013-05-21 21:08:27 Haben

Diese Ressource behandelt JS-Konsole. Mich würde vor allem der CSS-Status interessieren: Welche Stile werden auf bestimmte DOM-Elemente angewendet ... – Yako

Sie können auch Chrome für Android Remote Debugging verwenden [siehe dieses Video] (http://www.youtube.com/watch?v = n_7Wyj6DciY) – Haben

+10

Ich befürchte, dass dies mit Chrome funktioniert und nicht mit dem nativen Browser. Diese Lösung wurde auch in der ursprünglichen Frage zitiert. – Yako

Ich habe versucht, weinre auf Android 2.2 Lager Browser und es funktioniert gut

es einzurichten,

sudo npm install -g weinre 

// make it available to external (than just localhost) 
weinre --boundHost -all- 

// include this line (change to your IP address) to every page to be tested 
<script src="http://xxx.xxx.x.xxx:8080/target/target-script-min.js#anonymous"></script>

Mehr Details von dieser Website Remote debugging with weinre

Quelle

2014-09-28 10:23:04 ken

Plus eine für die Bereitstellung von Schritten. –

einfach zu geben eine neuere Option.

Sie können auch BrowserSync verwenden. Momentan ist Weinre bereits integriert.

# Using a local.dev vhost 
$ browser-sync start --proxy 

# Using a local.dev vhost with PORT 
$ browser-sync start --proxy local.dev:8001 

# Using a localhost address 
$ browser-sync start --proxy localhost:8001 

# Using a localhost address in a sub-dir 
$ browser-sync start --proxy localhost:8080/site1

http://www.browsersync.io/docs/command-line/

Quelle

2015-06-09 16:57:09 Ventura

-1

Dies scheint an anderer Stelle gestellt werden, aber vielleicht nicht so genau Frage. Unabhängig davon, ich habe diese Antwort gefunden (Is there a kind of Firebug or JavaScript console debug for Android?), um hilfreich zu sein, aber anstatt Cordova, in Kombination mit meinem Kommentar, mit Xamarin Android Player.

Quelle

2015-11-04 07:29:15

Erstens ich betreibe meine Android Virtual Device Konsole mit $ android avd und meine konfiguriert Android 4.4.2 Emulation starten nur mit nativen Browser installiert.

Als nächstes ich betreibe meine Chrome v54.0 für Desktop-in meinem Laptop, öffnen Sie Google-Entwickler-Tools/Top-Rechts-Kontext-Menü/More-Tools/Fern Devices ...

Dort sehe ich mein virtuelles Gerät in verbunden Zustand, so kann ich in klicken Sie auf Knopf einer beliebigen Seite meiner Ionic2 App.

Diese Aktion, öffnet eine neue Chrome-Entwickler-Tools schwebenden Fenster, wo ich CSS, HTML und Javascript in der gleichen Weise wie ich in meinen Web-Anwendungen überprüfen kann.

Hoffe, das kann jemand helfen.

Quelle

2016-11-13 01:55:32 JavierFuentes

Wie debuggen Sie CSS im nativen Android-Browser?

Antwort

Verwandte Themen