Школа
Веб-разработка

Как отлаживать странное? Вторая часть

Как отлаживать странное? Например, сайт на медленном интернете, на реальном айфоне через Зум или в безголовом Хроме?

Василий
13 апр 2023
👁 3350   🗩1
Веб-разработка

Как отлаживать странное? Вторая часть

Как отлаживать странное? Например, сайт на медленном интернете, на реальном айфоне через Зум или в безголовом Хроме?

Василий
13 апр 2023
👁 3350   🗩1
Василий Половнёв
Технический директор бюро
Полезно
 7
7
Непонятно
  
Войдите в Бюросферу, чтобы голосовать

Проще всего отладить сайт на медленном интернете с помощью тротлинга в веб‑инспекторе. В Хроме и Сафари это выпадайка во вкладке Network:

В Сафари тротлинг пока считают экспериментом. Его нужно включить в настройках веб‑инспектора: Settings — Experimental — Network — Allow throttling

Чтобы отладить проблему, которая появляется на реальном айфоне, который есть у вашего коллеги где‑нибудь в Казахстане или Грузии, расшарьте экран его компьютера через Зум или Телеграм, подключите айфон и стримьте через QuickTime: File — New Movie Recording — Camera — iPhone

Вы увидите то же, что и ваш коллега при работе с телефоном

Если вместо голого Хрома используете Browserless, сразу открывайте встроенный отладчик

Чтобы отладить страницу в безголовом Хроме, запустите его с флагом --remote-debugging-port=9222, откройте в обычном Хроме страницу chrome://inspect и подключитесь:

Если вместо голого Хрома используете Browserless, сразу открывайте встроенный отладчик

При отладке автоматизации иногда проще посмотреть вживую на то, что делает браузер. В таком случае лучше выключить безголовый режим. Если используете puppeteer, то это headless: false

P. S. Это был совет о веб‑разработке. Хотите знать всё о коде, тестах, фронтенд‑разработке, цеэсэсе, яваскрипте, рельсах и джейде? Присылайте вопросы.

Веб‑разработка
Полезно
 7
7
Непонятно
  
Войдите в Бюросферу, чтобы голосовать
Отправить
Поделиться
Поделиться
Запинить
Твитнуть

Комментарии

Чтобы увидеть то, что видит коллега при работе со своим телефоном, достаточно попросить коллегу записать скринкаст и скинуть видео в мессенджер. Это быстрее и не нужно будет заставлять коллегу садиться за комп и объяснять ему, как стримить через QuickTime. Ведь коллега — это не обязательно компьютерщик, он может быть и маркетологом, и вообще у него может не быть мака.

Вообще, увидеть проблему своими глазами — этого мало для отладки. Если уж мы заставили коллегу сесть за компьютер и постримить видео с айфона, то можем попросить его настроить и инструменты отладки. Для этого нужно в настройках Сафари на айфоне выбрать Advanced / Web Inspector, а в Сафари на маке — выбрать айфон в списке устройств в меню «Разработка»:

Цель рубрики — обсуждение вопросов дизайна, веб-разработки, переговоров, редактуры и управления.
Комментарии модерируются. Мы публикуем комментарии, которые добавляют к уже сказанному новые мысли и хорошие примеры.

Рекомендуем другие советы