10.2 Использование отладчика
Last updated
Last updated
Когда ваше приложение во время работы ведет себя не так, как ожидается, лучший способ проанализировать и исправить проблему заключается в том, чтобы по очереди зайти в каждое действие процесса и понять, где вычисляются неверные данные или где условие принимает неожиданное значение. Для этого и нужен отладчик.
Активация отладчика происходит с помощью добавления параметра debug_mode=true в конце URL при запуске приложения. Если в URL больше нет параметров, то ссылка будет выглядеть как
https://app.bubbleapps.io/index?debug_mode=true , а если есть, то будет
https://app.bubbleapps.io/index?param=value&debug_mode=true . Если вы заходите в приложение кликом на PREVIEW, отладчик автоматически запускается.
Для защиты вашего приложения и труда, отладчик доступен только если вы можете редактировать приложение. Если у вас нет доступа к приложению в редакторе, добавление debug_mode=true ничего не даст.
Обратите внимание, что на данный момент у Bubble нет отладчика для сенсорных устройств. Для доступа в отладчик вам нужно воспользоваться компьютером или ноутбуком.
Когда отладчик будет активирован, вы увидите его в нижней части страницы, с разделами, Отладчиком процессов и Инспектором элементов. Обратите внимание, что отладчик может расширяться и Bubble автоматически добавит место в нижней части страницы. Так происходит только в режиме отладки, а в живой версии этого не будет видно.
Левая часть отладчика - отладчик процессов. Здесь можно увидеть 3 кнопки, которые определяют, как будет работать отладчик при запуске процесса. Возможны три режима.
"Нормальный"/"normal" режим, в котором процесс работает без прерываний.
"Медленный"/"slow" режим, при котором добавляется пауза в одну секунду между каждыми последующими действиями.
Режим "Шаг за шагом"/"step-by-step", когда вы управляете ходом исполнения процесса. Этот режим вы будете использовать чаще всего.
При запуске процесса в медленном/пошаговом режиме вы увидите отображение процесса и вычисление полей при каждом действии. Каждое поле в списке параметров, отмеченное голубым, является динамическим (задаваемым в редакторе с помощью конструктора), и клик по нему даст вам понимание, почему значение именно такое. Подробности о вычислении выражений (!!!ЛНК!!!) смотрите ниже.
Ниже приведен пример того, как будет выглядеть процесс, который создает сущность (элемент в списке задач) и затем обновляет поля ввода, в "медленном" режиме. Пример взят из демо-приложения ToDoMVC(!!!ЛНК!!!).При выполнении более чем одного процесса, каждый из них будет запускаться последовательно, и все будут запускаться в одном и том же режиме работы отладчика. Это также применимо к пользовательским процессам, отладчик зайдет внутрь пользовательского процесса, и только после его окончания продолжит выполнение "внешнего" процесса. Статус отладчика сохраняется при обновлении страницы, если процесс переходит на другую страницу или запускает перезагрузку текущей, возобновленный процесс будет запускать последующие действия в том же режиме.
Если по какой-либо причине вам нужно ускорить исполнение процессов, вы можете перейти в режим "Нормальный", благодаря чему остальные действия будут работать с нормальной скоростью.
При работе над сложными страницами с большим количеством рабочих процессов, пошаговый режим может быть не лучшим выбором из-за слишком большого количества остановок. Если у вас есть особый процесс, работу которого вы хотели бы изучить, вы можете добавить контрольную точку, которая переключит отладчик в пошаговый режим при запуске этого действия или события. Это настраивается в Редакторе приложения и сохраняется в вашем приложении.
Обратите внимание, что эта настройка будет оказывать какой-либо эффект только когда включен отладчик (когда в URL есть debug_mode=true ) и не повлияет на работу приложения для пользователей.
Иногда нужно выяснить, почему элемент отображается именно так, особенно, если вы используете условия или выводите какие-то данные. В отладчике можно выбрать элемент на странице и увидеть список условий, полей и их значений в конкретный момент.
Если одно выражение принимает в качестве параметра другое выражение вы можете зайти в каждое выражение по очереди и проанализировать, откуда берутся данные. Если в выражении вы обращаетесь к каким-то элементам, наведение курсора на такой элемент в выражения подсветит элемент на странице.
Также в отладчике можно увидеть ошибки выполнения. Например, при совершении запроса по API к сервису, если сервис вернул сообщение с ошибкой из-за отсутствия входного параметра, данная ошибка отобразится. Когда ошибка возникает внутри рабочего процесса или элемента, его иконка становится красной и кликабельной. Кликнув можно увидеть список ошибок.
Кликните по кнопке "Обследовать"/"Inspect" для включения Инспектора элемента. Когда Инспектор включен, отладчик расширится и вы сможете выбрать элемент, который нужно обследовать. Выбрать элемент можно либо кликнув по нему (это не запустит связанный с элементом процесс), либо выбрав его в выпадающем меню. Это особенно нужно, когда элемент невиден (для понимания, почему его не видно). Мы можете найти элемент напечатав его имя в поле ввода.Когда элемент выбран справа вы увидите различные свойства и условия и их значения. Также в нижней части инспектора вы сможете видеть список пользовательских состояний (!!!ЛНК!!!) и другие значения, имеющиеся в контексте элементов (например, содержимое группы (!!!ЛНК!!!)). Ниже вы можете увидеть то, как выглядит в отладчике список приложений в Галерее Приложений (!!!ЛНК!!!). Видны различные поля и значения. Когда значение помечено синим, это динамическое выражение, кликнув по которому можно понять, как оно получилось. Подробности смотрите в следующем разделе (!!!ЛНК!!!). При использовании условий отладчик выделит зеленым условия, которые имеют значение "да", а красным - "нет". Здесь также можно узнать, как получилось такое значение, кликнув по выражению (см ниже).
Отладчик может помочь вам понять как вычисляется значение динамического выражения (!!!ЛНК!!!) во время работы. Оценщик в правой части отладчика отображает значение каждой части выражения при клике на неё. Он может отобразить результат поиска по базе данных, результат работы API процедуры и т.д.
Также отладчик полезен для отладки ошибок конфиденциальности. Правила конфиденциальности могут привести к сложностям при отладке, так как они могут скрывать некоторые поля или сущности. При клике в оценщике по сущности, скрытой правилами конфиденциальности, появится красное уведомление. Это следующим образом. Сравниваются два значения, значение, видимое текущему пользователю, и голые данные, когда правила конфиденциальности не применяются. Если два объекта отличаются, применяется правило конфиденциальности и показывается уведомление.
Когда вы столкнулись с ошибкой, в особенности при использовании сторонних сервисов и плагинов, первое, что нужно сделать - проверить, не является ли это ошибкой выполнения.
