Полезные фичи Chrome DevTools
Открываем еженедельную рубрику, в которой будем делиться полезными советами. Они могут пригодиться как начинающим специалистам, так и более опытным коллегам 👨💻
Наш старший разработчик, Ирина, раскрывает тонкости меню состояний элемента Chrome DevTools 👀
Часто разработчики и тестировщики сталкиваются с тем, что нужно получить доступ к стилям, привязанным к определенному состоянию элемента💬
Что делать, если нужно посмотреть/отредактировать стили выпадающих списков в реальном времени, но при переключении на инструменты разработчика браузера фокус со страницы уходит, и элемент скрывается? Или нужно проверить корректное отображение стилей при определенных состояниях элемента❓
Chrome DevTools позволяют нам сделать и то, и другое с помощью меню состояния элемента. Найти это меню можно на панели действий в разделе Элементы > Стили при нажатии кнопки :hov.
Для быстрого поиска эмуляции фокуса страницы можно также воспользоваться поиском: нажимаем Cmd+Shift+P (Ctrl+Shift+P), в появившемся поиске вводим "Эмулировать страницу в фокусе" ("Emulate page focus") 🤔
На следующей неделе предложим альтернативное решение, которое позволит проверить состояние элементов страницы в определенный момент времени 👍
🔥 - классный совет, буду использовать
👍 - жду еще полезных советов
🤔 - база, и до этого знал
#devtools #frontend #qa
Открываем еженедельную рубрику, в которой будем делиться полезными советами. Они могут пригодиться как начинающим специалистам, так и более опытным коллегам 👨💻
Наш старший разработчик, Ирина, раскрывает тонкости меню состояний элемента Chrome DevTools 👀
Часто разработчики и тестировщики сталкиваются с тем, что нужно получить доступ к стилям, привязанным к определенному состоянию элемента
Что делать, если нужно посмотреть/отредактировать стили выпадающих списков в реальном времени, но при переключении на инструменты разработчика браузера фокус со страницы уходит, и элемент скрывается? Или нужно проверить корректное отображение стилей при определенных состояниях элемента
Chrome DevTools позволяют нам сделать и то, и другое с помощью меню состояния элемента. Найти это меню можно на панели действий в разделе Элементы > Стили при нажатии кнопки :hov.
Для быстрого поиска эмуляции фокуса страницы можно также воспользоваться поиском: нажимаем Cmd+Shift+P (Ctrl+Shift+P), в появившемся поиске вводим "Эмулировать страницу в фокусе" ("Emulate page focus") 🤔
На следующей неделе предложим альтернативное решение, которое позволит проверить состояние элементов страницы в определенный момент времени 👍
🔥 - классный совет, буду использовать
👍 - жду еще полезных советов
🤔 - база, и до этого знал
#devtools #frontend #qa
Please open Telegram to view this post
VIEW IN TELEGRAM
👍21🔥14 5🤔3❤1