Czy istnieje realne rozwiązanie do debugowania aplikacji cordova [zamknięty]

DLA ANDROIDA:

Musisz tylko włączyć "USB remote debugger" w urządzeniu z Androidem i podłączyć kabel USB. Następnie otwórz aplikację na urządzeniu. Chrome wykryje zdalną przeglądarkę i możesz zobaczyć konsolę w taki sam sposób, jak ją widzisz, gdy używasz Chrome lokalnie.

Użyj tego linku: chrome://inspect/#devices w przeglądarce Chrome (będziesz musiał wkleić go do paska nav).

Jeśli aplikacja ulegnie awarii na urządzeniu, musisz tylko zobaczyć dziennik konsoli twoja przeglądarka i zobacz, co się stanie. Możesz również dodawać funkcje, zmieniać zmienne i nadpisywać funkcje w taki sam sposób, jak robimy to w naszej lokalnej przeglądarce.

Przeczytaj ten artykuł aby uzyskać więcej informacji na temat kroków, które należy podjąć.

Będzie to działać tylko na urządzeniach z systemem Android 4.4+.

Dla iOS:

1.In urządzenie z systemem iOS przejdź do Ustawienia > Safari > zaawansowane > Web Inspector, aby włączyć Web Inspector

2.Otwórz Safari na urządzeniu z systemem iOS.

3.Podłącz go do komputera przez USB.

4.Otwórz Safari na komputerze.

5.In menu Safari, przejdź do Rozwijaj i poszukaj nazwy urządzenia.

6.Wybierz kartę, którą chcesz debugować.

Jeśli możesz używać urządzenia z Androidem 4.4+, możesz używać zdalnego debugowania Chrome nawet w wewnętrznym widoku sieci Web aplikacji. Jest to znacznie lepszy debugger niż Weinre, ale kluczem jest użycie najnowszej wersji Androida.

Ostatnie Cordova buduje automatycznie włączyć tego rodzaju debugowania tak długo, jak jest to kompilacji debugowania (to jest wyłączony w -- release buduje).

Najlepsze dla mnie jest dołączenie debuggera Chrome ' a.

Aby to zrobić, uruchom aplikację w emulatorze lub urządzenia (za pomocą $cordova emulować)

Następnie otwórz Google Chrome i przejdź do chrome://inspect/

Zobaczysz listę z uruchomionymi aplikacjami. Twoja aplikacja powinna tam być. Kliknij "Sprawdź".

Otworzy się nowe okno z narzędziami programistycznymi. Tam możesz kliknąć na "console", aby sprawdzić błędy

Jeśli aplikacja jest uruchomiony Cordova 3.3 + i urządzenie jest uruchomiony Android 4.4 + następnie można użyć Chrome zdalne debugowanie Webview do debugowania aplikacji Cordova.

Aby to zrobić, musisz najpierw włączyć debugowanie USB w telefonie.

Następnie otwórz zakładkę "inspect devices". W Chrome przejdź do Settings > Więcej narzędzi > Sprawdź urządzenia .

Jeśli uruchomisz aplikację na urządzeniu, gdy jest ona podłączona do komputera, Widok sieci Web powinien pojawi się na liście Urządzenia. Kliknij łącze "Sprawdź" widoku sieci Web, a pojawi się narzędzie do debugowania widoku sieci Web.

Oto artykuł w pełni wyjaśniający, jak to zrobić: http://geeklearning.io/apache-cordova-and-remote-debugging-on-android/

Próbowałeś 'GapDebug'? Jest wolny.

Wydaje się, że integruje wersje Safari Webkit Inspector i Chrome Dev Tools, aby zaoferować zintegrowane środowisko debugowania na OS X i Windows.

Inną opcją jest Visual Studio, który ma prerelease wsparcie dla debugowania aplikacji Cordova :

Unified debugging experience . Rozwój wieloplatformowy często wymaga innego narzędzia do debugowania każdego urządzenia, emulatora lub symulator. Różne narzędzia oznaczają różne przepływy pracy i utracone produktywność za każdym razem, gdy zmieniasz urządzenia. Dzięki Visual Studio możesz może używać tych samych światowej klasy narzędzi debugowania dla wszystkich wdrożeń cele, w tym Okna, emulator Androida, dołączony Android urządzenia, urządzenia iOS i emulatory oraz emulator Apache Ripple.

Teraz, gdy Microsoft wydał Visual Studio Community edition za darmo , możesz spróbować bez żadnych kosztów. Trzeba będzie pobrać zarówno Visual Studio, i Visual Studio Narzędzia dla Apache Cordova .

Z tego co wiem, jedynym produktywnym narzędziem do rzeczywistego debugowania w aplikacjach Cordova na Platformy Android od 2.2 do 4.3 jest jshybugger . Weinre jest inspektorem, a nie debuggerem. JsHybugger instrumentuje Twój kod, umożliwiając debugowanie wewnątrz widoku sieciowego Androida.

Chcę tylko dodać, że możesz debugować aplikacje na Androida za pomocą Genymotion. Jest o wiele szybszy niż zapasowy emulator Androida.

Możesz użyć Intel XDK IDE do tworzenia i debugowania na emulatorze lub na rzeczywistym urządzeniu

Znalazłem również Visual Studio 2015 RC narzędzia dla cordova bardzo dobry, z to ripple emulator

Jeśli używasz PhoneGap build, istnieje opcja włączenia debugowania.

Dla lokalnych kompilacji, można zainstalować weinre z npm: https://npmjs.org/package/weinre

I link do weinre docs: http://people.apache.org/~pmuellr/weinre/docs/latest /

I jest coś o nazwie Chrome remote debugging, ale nie wiem o tym zbyt wiele, możesz rzucić okiem na artykuł Raymonda Camdena : http://www.raymondcamden.com/index.cfm/2014/1/2/Apache-Cordova-33-and-Remote-Debugging-for-Android

Dokumenty do zdalnego debugowania chrome : https://developers.google.com/chrome-developer-tools/docs/remote-debugging (jeśli dobrze zrozumiałem, potrzebujesz urządzenia z Androidem z chrome jako domyślną przeglądarką) Może najbliższe twojemu wymarzonemu rozwiązaniu?

Na Androidzie 4.4 + w / SDK zainstalowany:

adb logcat chromium:D SystemWebViewClient:D \*:S

Jeśli jesteś za pomocą Cordova 3.3 lub wyższej i urządzenie jest z systemem Android 4.4 lub wyższym można użyć "zdalne debugowanie na Androida z Chrome". Pełne instrukcje są tutaj:

Https://developer.chrome.com/devtools/docs/remote-debugging

W podsumowaniu:

Podłącz urządzenie do komputera stacjonarnego za pomocą kabla USB]}
• Włącz debugowanie USB na swoim urządzeniu (na moim urządzeniu jest to w Ustawieniach > więcej > Opcje programisty > USB debugowanie)

lub, Jeśli używasz Cordova 3.3+ i nie masz fizycznego urządzenia z 4.4, można użyć emulatora, który używa Android 4.4+, aby uruchomić aplikację za pośrednictwem emulatora, na komputerze stacjonarnym.

• Uruchom aplikację Cordova na urządzeniu lub emulator
• W Chrome na komputerze stacjonarnym wprowadź chrome: / /inspect / #devices w pasku adresu
• Twoje urządzenie/emulator zostanie wyświetlony wraz z innymi rozpoznane urządzenia, które są podłączone do komputera, a pod urządzeniem będzie szczegóły Cordova " WebView "(w zasadzie aplikacja Cordova), który działa na urządzeniu / emulator (sposób Cordova działa jest to, że w zasadzie tworzy okno "Przeglądarka" na urządzeniu/emulator, w którym znajduje się "WebView", który jest uruchomiony HTML/JavaScript app)
• Kliknij link "inspect" pod sekcją "WebView", gdzie widzisz na liście swoje urządzenie / emulator. To przywołuje Narzędzia programistyczne Chrome, które umożliwiają teraz debugowanie aplikacji.
• wybierz "źródła" zakładka Chrome narzędzia programistyczne, aby wyświetlić JavaScript, że aplikacja Cordova na urządzeniu / emulator jest obecnie uruchomiony. W JavaScript można dodawać punkty przerwania, które umożliwiają debugowanie kodu.
• Możesz również użyć zakładki' console', aby wyświetlić błędy (które będą wyświetlane na czerwono), lub na dole konsoli pojawi się monit'>'. Tutaj możesz wpisać dowolne zmienne lub obiekty (np. obiekty DOM), które chcesz sprawdzić bieżącą wartość, a wartość zostanie wyświetlona.

Oto rozwiązanie przy użyciu PhoneGap Build. Dodaj następujące elementy do swojej konfiguracji.xml, aby móc sprawdzić za pomocą zdalnego debugowania Chrome Webview.

Najpierw upewnij się, że Twój znacznik widżetu zawiera xmlns: android="http://schemas.android.com/apk/res/android"

<widget 
    xmlns="http://www.w3.org/ns/widgets" 
    xmlns:gap="http://phonegap.com/ns/1.0" 
    xmlns:android="http://schemas.android.com/apk/res/android"
    id="me.app.id" 
    version="1.0.0">

Następnie dodaj następujący

<gap:config-file platform="android" parent="/manifest">
     <application android:debuggable="true" />
</gap:config-file>

<preference name="phonegap-version" value="3.7.0" />

Zbuduj aplikację w PhoneGap Build, zainstaluj APK, podłącz telefon do USB, Włącz debugowanie USB w telefonie odwiedź chrome: / / sprawdź.

Źródło: https://www.genuitec.com/products/gapdebug/learning-center/configuration/

Użyj Monitora Urządzenia Z Systemem Android

Monitor Urządzenia z Androidem zawiera pakiety z zestawem SDK Androida, które wcześniej byś zainstalował. Na monitorze urządzenia można zobaczyć cały dziennik urządzenia, wyjątki, wiadomości wszystko. Jest to przydatne do debugowania awarii aplikacji lub innych takich problemów. Aby to uruchomić, przejdź do folderu Narzędzia / wewnątrz zestawu android sdk "/ var / android-sdk-linux / tools". Następnie uruchom następujące

chmod +x monitor
./monitor

Jeśli jesteś na windows, otwórz bezpośrednio monitor.plik exe. Poniżej znajduje się zakładka "LogCat", gdzie zobaczysz wszystkie wiadomości związane z urządzeniem. Zobaczysz tutaj wszystkie wiadomości, w tym wyjątki urządzeń z systemem android, które nie są widoczne chrome inspect device. Pamiętaj, aby utworzyć filtry za pomocą karty logcat"+", aby wyświetlać wiadomości tylko dla Twojej aplikacji.

Źródło: http://excellencenodejsblog.com/phonegap-debugging-your-android-application/

Możesz również debugować za pomocą chrome swoje aplikacje html5

Tworzę .bat otwiera chrome w trybie debugowania

cd C:\Program Files (x86)\Google\Chrome\Application
chrome.exe "file:///C:\Users\***.html" --allow-file-access-from-files --disable-web-security

Można debugować Cordova Android Aplikacje, które są zainstalowane w telefonie zdalnie z komputera za pomocą kabla USB (można również zdalnie kliknąć na aplikacji internetowej, jak gdybyś przeglądał aplikację internetową z komputera) z"Chrome zdalne debugowanie". Możesz również debugować aplikację internetową przeglądaną w przeglądarce Stock Android lub Chrome na Androidzie w ten sposób.

1. Włącz tryb programisty na urządzeniu z Androidem (przejdź do Ustawienia - > Informacje o telefonie - >stuknij 7x w numer kompilacji).

2. Podłącz komputer do telefonu za pomocą kabla USB.

3. Lunch Chrome na komputerze i przejdź do chrome: / / inspect i kliknij przycisk "Inspect" obok urządzenia zdalnego, które chcesz debugować (w zakładce "Urządzenia"). lub Kliknij prawym przyciskiem myszy w Chrome na komputerze -> Inspect -> Costumize and control DevTools (3 pionowe kropki - prawy górny róg narzędzi programistycznych) -> More tools - > Remote Devices - > w obszarze urządzenia po lewej stronie kliknij urządzenie, do którego jesteś podłączony przez USB - > kliknij przycisk Sprawdź dla żądanej aplikacji.

4. Następnie kliknij "Console" i możesz debugować JavaScript w taki sam sposób, jak w normalnej aplikacji internetowej za pomocą narzędzi programistycznych Chrome.

Kochałam weinre ' a! Jak go używać:

Najpierw załóż index.html (Upewnij się, że app.settings.debugUrl jest ustawione przed tym):

  <!-- Weinre debugging -->
  <script type="text/javascript">
    if (app.settings.debugUrl) {
      document.addEventListener("DOMContentLoaded", function(event) { 
        var s = document.createElement("script")
        s.setAttribute("src", app.settings.debugUrl+"/target/target-script-min.js#anonymous")
        document.getElementsByTagName("body")[0].appendChild(s)
      }); 
    }   
  </script>

Wtedy:

• zainstaluj: sudo npm install -g weinre
• run: weinre --boundHost -all-
• otwórz w przeglądarce: http://localhost:8080/client/#anonymous
Oglądaj cele pojawiające się podczas otwierania aplikacji]}

Na podstawie http://www.broken-links.com/2013/06/28/remote-debugging-with-weinre/

Urządzenia z Androidem https://www.npmjs.com/package/cordova-plugin-crosswalk-webview-pgb-adapt