Как увидеть ошибки JavaScript в приложении PhoneGap в Xcode?

Ответ 1

Самый элегантный способ просмотра и отладки ошибок JavaScript в вашем приложении Cordova/PhoneGap - это привязать веб-инспектора от браузера Safari к веб-представлению в вашем приложении iOS (но, как уже упоминалось, Том Кларксон, вам понадобится меньше iOS 6).

• На вашем iPad или iPhone используйте приложение "Настройки", чтобы включить "Веб-инспектор" в "Дополнительные настройки для Safari"
• Подключите устройство к Mac через USB (оно появится в меню "Разработка" Safari).
• Запустите приложение
• Перейдите в веб-представление, которое вы хотите отлаживать
• На Mac из меню Safari Develop выберите имя своего устройства и приложение (его HTML-страницу) из своего подменю
• Откроется окно Web Inspector, позволяющее просматривать DOM, устанавливать точки останова и т.д.

Документация яблок по настройке: https://developer.apple.com/library/content/documentation/AppleApplications/Conceptual/Safari_Developer_Guide/GettingStarted/GettingStarted.html

Тщательный сторонний учебник:
http://webdesign.tutsplus.com/tutorials/workflow-tutorials/quick-tip-using-web-inspector-to-debug-mobile-safari/

В качестве альтернативы вы можете подключить Chromes Web Inspector к устройствам iOS после установки прокси-сервера отладки: https://github.com/google/ios-webkit-debug-proxy/. Это также открывает возможность проводить проверку с Linux. Удаленный доступ к вашим iOS файлам HTML, CSS и JavaScript возможен даже из Windows с выделенным прокси-сервером Chrome: https://github.com/artygus/ios-webkit-debug-proxy-win32.

BTW, удаленная отладка с Safari Web Inspector работает в сочетании с iOS Simulator.

Минимальная версия Desktop Safari для версии iOS

Для каждой версии iOS вам потребуется определенная минимальная версия Desktop Safari для использования удаленного веб-инспекции, см. список ниже.

Ответ 2

Вставьте следующий код рядом с началом документа, чтобы он выполнялся перед любым другим вашим JavaScript.

<script type="text/javascript">
    window.onerror = function(message, url, lineNumber) {
        console.log("Error: "+message+" in "+url+" at line "+lineNumber);
    }
</script>

И наслаждайтесь просмотром деталей ваших ошибок Javascript в окне консоли Xcode.

ОБНОВЛЕНИЕ. Вышеупомянутый метод будет регистрировать ошибки, такие как переменные undefined. Но синтаксические ошибки, такие как отсутствующие запятые, по-прежнему будут прерывать весь script, не записывая ничего.

Поэтому вы должны добавить следующее в начало своей функции onDeviceReady:

console.log('Javascript OK');

Если вы не видите "JavaScript ОК", появляющийся в окне журнала при запуске приложения, это значит, что у вас есть синтаксическая ошибка.

Чтобы сохранить охоту за недостающими запятыми, проще всего вставить свой код в средство проверки Javascript, например, следующее:

http://www.javascriptlint.com/online_lint.php

и пусть он найдет для вас ошибку.

Надеюсь, это отчасти избавит вас от отладки.

Ответ 3

Обратите внимание, что с 0.9.2 (выпущенный сегодня) console.log был стандартизирован на всех платформах для ведения журнала (с устаревшим debug.log).

Существует функция, которая доступна на рабочем столе WebView, которая не отображается в iOS UIWebView, которая будет ловить все ошибки (я пытаюсь взломать эту функциональность в плагин, который использует частные API, но плагин будет только быть в разработке), но на данный момент сделать то, что предложил Крис выше, и поставить try catch блоки на код и использовать console.log

Чтобы быстро уловить возможные синтаксические ошибки, при разработке у меня есть страница, загруженная на рабочий стол Safari, и быстро обновляйте ее с помощью консоли просмотра веб-страницы.

Ответ 4

debug.log отправит сообщения в консоль XCode в Phonegap (позволяя вам либо регистрировать результат исключения, либо выполнять некоторую отладку), однако вы правы, что вам нужно отлаживать другие ошибки JavaScript в Safari (либо на рабочий стол или на iphone с включенной консолью отладки). Я еще не нашел ошибку Javascript, которая была вызвана запуском на iphone и отсутствовала при отладке с помощью консоли, включенной в Safari (хотя я знаю, что есть несколько различий между WebView и Safari на iphone).

Ответ 5

Для создания javascript-отладки в Xcode я хотел бы посмотреть следующее.

http://phonegap.com/2011/05/18/debugging-phonegap-javascript/
http://www.daveoncode.com/2010/01/12/debugging-phonegap-applications-using-xcode-console/

Как для дополнительного устранения неполадок...
Начнем с того, что вы можете запустить приложение в сафари на компьютере и использовать отладчик сафари (или хром, поскольку оба работают с похожими механизмами рендеринга). Это не повлияет на сложные логические ошибки и многие из ваших проблем с api, но это по крайней мере должно помочь в устранении многих проблем (базовый JavaScript, HTML5 и т.д.).

Ответ 6

Я просто наткнулся на Weinre

Это удаленный отладчик javascript для телефонного разговора. Вы можете либо настроить свой собственный сервер Weinre, либо использовать его в http://debug.phonegap.com/

Кажется, что он работает хорошо - очень впечатлен до сих пор.

Ответ 7

Если вы используете iOS 6, вы можете просто подключить веб-инспектор сафари (в меню разработки сафари для рабочего стола) к своему приложению и получить полную отладку javascript.

Есть несколько областей, где он немного ограничен - ошибки при запуске и вызовы плагинов - но он хорошо работает для всего, что угодно.

Ответ 8

Чтобы просмотреть все ошибки в консоли javascript, я согласен использовать этот прослушиватель событий

<script type="text/javascript">
    window.onerror = function(err,fn,ln) {alert("ERROR:" + err + ", " + fn + ":" + ln );};
    var errorVar = objectDoesntExists.properyDoesntExist;//this will simulate an error
</script>

Однако, если у вас нет плагина cordova, он не будет отображаться на консоли XCodes. Перейдите в папку проекта и введите следующее:

? cordova plugin add cordova-plugin-console

Это позволит отобразить на XCode команду javascript console.log('some string').

Обратите внимание, что вам понадобится git и т.д., но если вы редактируете проект phonegap в xcode, вы, скорее всего, получите его!

PS Убедитесь, что вы вставили плагин cordova.js script перед любым использованием console.log

<script type="text/javascript" src="/cordova.js"></script>

Ответ 9

Поместите это в начало вашего index.html

<script type="text/javascript">
    window.onerror = function(err,fn,ln) {alert("ERROR:" + err + ", " + fn + ":" + ln);};
    var errorVar = objectDoesntExists.properyDoesntExist;//this will simulate an error
</script>

Ответ 10

Вот простой способ, который работал у меня:

• cd в каталог, содержащий ваш файл index.html в терминале

• Запустите HTTP-сервер, используя python, вызывая (я использовал python 2.7):

  python -m SimpleHTTPServer

• Просмотрите страницу в сафари, указав адрес HTTPServer в браузере, для меня был URL:

  http://0.0.0.0:8000/
  

• Откройте инструменты разработчика:

  В chrome это alt + command + i. Просмотрите вкладку консоли, возможно, потребуется обновить страницу.

  В Safari: Safari → Настройки → Дополнительно → установите флажок "Показывать меню разработки". Развернуть меню → Показать консоль ошибок (или alt + command + c). Обновите страницу. Нажатие CTRL + 5 открывает вкладку проблем.