Знакомство с Chrome DevTools
Chrome DevTools — это набор инструментов разработчика, встроенных в браузер Google Chrome для отладки веб-приложений. Они предоставляют возможность в реальном времени просматривать и изменять HTML, CSS на веб-страницах и выполнять отладку JavaScript-кода.
Новая система интерфейса игры «Мир Танков» построена с использованием Coherent Gameface на основе веб-технологий (HTML, CSS, JavaScript). Благодаря этому, к интерфейсу игры можно подключить Chrome DevTools.
Подключение DevTools к игре
Официальная поддержка DevTools в игре отключена, но можно воспользоваться модификацией wotstat.chrome-devtools-protocol, которая реализует протокол удалённой отладки Chrome DevTools.
Установка модификации
- Скачайте и установите мод wotstat.chrome-devtools-protocol
- Скачайте и установите мод
net.openwg.gameface, он необходим для работы всехGameface-модов:- Для
WGиз официального репозитория - Для
Lestaнужна пропатченная версия из репозитория wotstat
- Для
- Запустите игру (при первом запуске игра один раз перезагрузится для инициализации модов, подробнее...)
Подключение DevTools
- Запустите
Google Chrome - В адресной строке введите
chrome://inspectи нажмитеEnter - Убедитесь, что у вас стоит галочка
Discover network targets - Нажмите кнопку
Configure...и убедитесь, что в списке указан адресlocalhost:9222(если нет, добавьте его)
Настройки DevTools
- Спустя несколько секунд в разделе
Remote Targetпоявятся все активные вкладки игры
На одном экране игры может быть сразу несколько окон (вкладок), каждое из которых независимое и ведёт себя как отдельная веб-страница
- Нажмите кнопку
inspectнапротив нужной вкладки, чтобы открытьDevToolsдля этой вкладки
Обзор возможностей DevTools
Модификация не полностью реализует протокол DevTools, но основные возможности для отладки интерфейса игры доступны:
- Вкладка
Elements— просмотр HTML и CSS страницы- Поддерживается функционал
Overlay, который обводит в игре выбранный в DevTools элемент, а так же позволяет выбирать элементы на странице кликом по ним в игре
- Поддерживается функционал
- Вкладка
Console— просмотр логов и выполнение JavaScript-кода в среде страницы - Вкладка
Sources(частично) – предоставляет доступ к редактированию специальногоoverride.cssфайла для внесения изменений в стили страницы
Учтите, что для подключения доступны только те страницы, которые фактически присутствуют на экране игры, если вы перейдёте в другое окно интерфейса, то существующие вкладки будут уничтожены, а новые появятся в списке Remote Target.
Внимание!
Функционал DevTools используется только для просмотра и отладки интерфейса, он не предоставляет возможности "сохранить" сделанные изменения или сгенерировать мод автоматически. Все изменения, внесённые через DevTools, будут потеряны после перезагрузки страницы или игры.
Andrei Soprachev