воскресенье, 23 февраля 2014 г.

Удаленная отладка Chrome для Android.

Недавно столкнулся с весьма интересной функцией Chrome 32 – удаленная отладка web-контента на Android. Доступна эта функция в Android 4.4 – KitKat. Полезна эта функция в первую очередь web-разработчикам для Android, и Android-разработчикам которые используют WebViews в своих приложениях.
Инструменты отладки сайтов в Android версии Chrome весьма скромные и вот здесь на помощь приходит удаленная отладка, которая помогает отладить мобильную версию web-контента для Android-устройства.
На самом деле все очень просто, единственное что вам понадобиться — Android-устройство с версией Chrome 32, usb-кабель, двайвера для Android-устройства и собственно компьютер с установленным на него Chrome 32 или более поздней версии, на котором и будет происходить отладка.
И так, подключаем устройство к компьютеру и в «режиме разработчика» включаем «отладку по USB». В зависимости от версии Android, «режим разработчика» может быть скрыт. В версиях Android 4.4 этот режим открывается после семи нажатий на «Номер сборки» в «Настройки/Об устройстве»
Теперь надо запустить Chrome на устройстве и на компьютере. В браузере устройства перейти на web-ресурс, контент которого надо отладить. Для примера я перешел на свой блог — notformat.blogspot.com. В Chrome который будет использоваться для удаленной отладки перейти в инспектор подключенных устройств. «Инструменты/Проверка устройств».
Устройство попросит разрешение на отладку с компьютера.
После этого доступна удаленная отладка Chrome на Android-устройстве и доступны вкладки открытые на устройстве, с описание какому процессу принадлежит вкладка, ее название и адрес ресурса. Каждую вкладку можно закрыть, перезагрузить, установить на нее фокус, и собственно отладить web-контент.
При выборе элемента в отладчике он автоматически подсвечивается на устройстве.
Есть возможность включить «трансляцию» с вкладки в окно отладки, это позволит не отвлекаться на устройство и отлаживать все в одном браузере.
Но не все заканчивается удаленной отладкой мобильной версии web-ресурса для Chrome. Так как WebView и Chrome основанный на webkit, то есть все возможности отлаживать контент отображаемый в этом элементе.
Как это делается на примере Android-приложения которое использует WebView. Создается обычное Android Application в ADT.
В версиях SDK указывается что используется API 19: Android 4.4 (KitKat).
А дальше можно все оставить как есть в стандартом проекте.
Так как приложение на основе WebView использует интернет, то в манифест следует добавить разрешение использовать подключение к интернету.
В activity_main.xml нужно добавить описание WebView через визуальный редактор или вручную редактируя файл activity_main.xml.
В событии onCreate для начала устанавливается адрес нужного web-ресурса, в данном случае это мой блог.
//установка нужного web-ресурса
WebView myWebView = (WebView) findViewById(R.id.webview);
myWebView.loadUrl("http://noTformaT.blogspot.com");
Далее идет включение поддержки JavaScript.
//включение JavaScript
WebSettings webSettings = myWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
Если теперь запустить проект и попытаться использовать удаленную отладку, браузер будет видеть устройство и процесс на нем, но доступа к отладке не будет.
Для доступа к удаленной отладке, приложению надо самостоятельно явно установить возможность отладки.
if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT)
{
 WebView.setWebContentsDebuggingEnabled(true);
}
Теперь после запуска приложения есть возможность удаленной отладки содержимого WebView.
Вот такой интересный функционал существует в Android 4.4 – KitKat, я уже говорил что функция полезная как web-разработчикам, так и для разработчикам для Android.
Это не единственная интересная функция Android 4.4 – KitKat, и в будущем я постараюсь рассказать о еще интересных функциях и возможностях. Исходный код тестового проекта доступен здесь.
Я уже два месяца использую Android 4.4 – KitKat, и покаместь очень доволен этой операционной системой, много нового и действительно полезного функционала.
Все. Всем удачи. Пока.