Как открыть devtools на маке

Чтобы открыть DevTools в браузере на компьютере Mac, необходимо выполнить следующие шаги в зависимости от используемого браузера, например:

Google Chrome:

1. Откройте браузер Google Chrome на вашем компьютере Mac
2. Перейдите на страницу, которую вы хотите отладить
3. Нажмите на иконку "Три точки" в правом верхнем углу браузера
4. Выберите "More Tools" -> "Developer Tools" в выпадающем меню
5. Или используйте горячие клавиши "Cmd+Option+I" на клавиатуре Mac для быстрого доступа к DevTools

Safari:

1. Откройте браузер Safari на вашем компьютере Mac
2. Перейдите на страницу, которую вы хотите отладить
3. Убедитесь что devtools включены - стоит галочка: Safari > Preferences > Advanced > Show Develop menu in menu bar
4. Далее нажмите "Develop" в верхней панели меню и выберите "Show Web Inspector" в выпадающем меню
5. Или используйте горячие клавиши "Cmd+Option+C" на клавиатуре Mac для быстрого доступа к DevTools

В Chrome, Яндекс Браузере, Edge и Firefox на Mac DevTools открывает сочетание Cmd + Option + I. В Safari его сначала нужно включить в настройках.

Сочетания клавиш

Ещё один способ в любом браузере: правый клик по элементу страницы → Просмотреть код (в Safari — Проверить элемент). DevTools откроются сразу на этом элементе.

F12, как в Windows, на Mac обычно не работает: на клавиатуре Mac это клавиша громкости.

Как включить DevTools в Safari

1. Safari → Настройки (Cmd + ,).
2. Вкладка Дополнения.
3. Отметьте Показывать функции для веб-разработчиков. В старых версиях Safari пункт называется Показывать меню «Разработка» в строке меню.

В строке меню появится пункт Разработка, а сочетание Cmd + Option + I начнёт работать.

Через меню

• Chrome: три точки → Другие инструменты → Инструменты разработчика.
• Яндекс Браузер: три полоски → Дополнительно → Дополнительные инструменты → Инструменты разработчика.
• Safari: Разработка → Показать веб-инспектор.

Отладка iPhone с Mac

В Safari на Mac можно открыть DevTools для страницы на iPhone. На iPhone: Настройки → Safari → Дополнения → Веб-инспектор. Подключите iPhone кабелем, затем на Mac: Разработка → имя iPhone → нужная вкладка.

Режим телефона в Chrome

Откройте DevTools и нажмите Cmd + Shift + M. Страница покажется в размере выбранного телефона.

Работу с DevTools в тестировании разбирают в бесплатном курсе «Основы тестирования» и на профессии «Инженер по ручному тестированию».