Перейти к основному содержимому

Тестирование мини-приложений

warning

Эта страница переведена сообществом на русский язык, но нуждается в улучшениях. Если вы хотите принять участие в переводе свяжитесь с @alexgton.

Использование ботов в тестовой среде разработки​

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

  • iOS: нажмите 10 раз на значок Настройки > Учетные записи > Вход в другую учетную запись > Тест.
  • Telegram Desktop: откройте ☰ Настройки > Shift + Alt + щелкните правой кнопкой мыши на 'Add Account' и выберите 'Test Server'.
  • macOS: нажмите 10 раз на значок "Настройки", чтобы открыть меню отладки, ⌘ + нажмите "Добавить учетную запись" и войдите в систему по номеру телефона.

Тестовая среда полностью отделена от основной. Вам нужно будет создать новый аккаунт пользователя и нового бота, используя @BotFather.

После получения токена бота, отправляйте запросы в Bot API в следующем формате:

https://api.telegram.org/bot<token>/test/METHOD_NAME

Примечание: При работе с тестовой средой вы можете использовать HTTP-ссылки без TLS для тестирования Вашего мини-приложения.

Режим отладки для мини-приложений​

Используйте следующие инструменты для выявления проблем, связанных с вашими мини-приложениями:

Android​

  • Включить USB-отладку на Вашем устройстве.
  • В настройках Telegram прокрутите страницу до конца вниз, нажмите номер версии два раза и удерживайте.
  • Выберите Включить отладку WebView в настройках отладки.
  • Подключите телефон к компьютеру и откройте chrome://inspect/#devices в Chrome - вы увидите там ваше мини-приложение, когда запустите его на телефоне.

iOS​

Для отладки iOS webview требуется десктопный браузер Safari и macOS.

На устройстве iOS:

  • Перейдите в раздел Настройки.
  • Найдите значок Safari и нажмите на него.
  • Прокрутите вниз и нажмите Дополнительно.
  • Включите опцию Веб-инспектор.

На macOS:

  • Откройте браузер Safari.
  • Откройте Настройки (⌘ + ,).
  • Выберите вкладку Дополнительно.
  • Отметьте внизу опцию Показать возможности для веб-разработчиков.

Следующие шаги:

  • Подключите iOS-устройство к Mac с помощью кабеля.
  • Откройте мини-приложение в клиенте Telegram для iOS.
  • Откройте вкладку Разработка в строке меню в Safari на macOS.
  • Выберите подключенный iPhone.
  • Опционально: выберите Подключение по сети и отсоедините кабель.
  • Выберите открытый URL-адрес webview в блоке Telegram.

Telegram Desktop в Windows, Linux и macOS​

  • Загрузите и запустите последнюю версию Telegram Desktop на Windows, Linux или macOS (на момент написания этой статьи доступна версия 5.0.1).
  • Перейдите в Настройки > Дополнительно > Экспериментальные настройки > Включить проверку webview.
  • В Windows и Linux щелкните правой кнопкой мыши на WebView и выберите Проверить (Inspect).
  • На macOS Вам необходимо получить доступ к Inspect через Меню Разработчика Safari , а функция Inspect недоступна через контекстное меню, вызываемое правой кнопки мыши.

Telegram macOS​

  • Скачайте и запустите Бета-версию Telegram macOS.
  • Быстро нажмите 5 раз на значок "Настройки", чтобы открыть меню отладки и включить "Отладку мини-приложений".

Щелкните правой кнопкой мыши в мини-приложении и выберите Inspect Element.

Тестирование с Eruda​

Eruda - это инструмент, предоставляющий веб-консоль для отладки и проверки веб-страниц на мобильных устройствах и в десктопных браузерах. Вот пошаговое руководство по использованию Eruda в проектах мини-приложений Telegram.

1

Шаг 1: Включите библиотеку Eruda​

Для начала добавьте библиотеку Eruda в свой HTML-файл. Вы можете загрузить ее из CDN:

<!-- Include Eruda from CDN (Recommended) -->
<script src="https://cdn.jsdelivr.net/npm/eruda"></script>

Или Вы можете получить его на npm.

npm install eruda --save

Шаг 2: Инициализируйте Eruda​

Затем инициализируйте Eruda при загрузке веб-страницы. Если Вы используете Eruda с CDN, сделайте следующее:

<script src="https://cdn.jsdelivr.net/npm/eruda"></script>
<script>
  // Initialize Eruda
  eruda.init();
</script>

Если Вы предпочитаете последние версии инструментов и пакетов, добавьте этот скрипт в свой проект:

import eruda from 'eruda'

eruda.init()

Шаг 3: Запустите Eruda​

После развертывания вашего мини-приложения запустите его и просто нажмите на значок Eruda, чтобы начать отладку!

concept image concept image