Совкомбанк Технологии

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