☕️ Прокачиваем арсенал QA — теперь в браузере
В 'https://t.me/rdclr_dev/332https://t.me/rdclr_dev/332' rel='nofollow'>прошлый раз мы собрали сайты, которые облегчат жизнь тестировщику. Но не все должно жить во вкладках — кое-что можно встроить прямо в браузер.
Мы собрали 12 расширений, которые экономят часы ручного тестирования. Они помогают быстро проверить верстку, куки, цвета, шрифты и даже записать баг — без миллиона кликов и DevTools.
1️⃣ PerfectPixel
Никаких гаданий «на глаз».
Этот плагин накладывает макет поверх страницы и сразу показывает, где верстка поехала. Пиксель в пиксель — и все становится очевидно.
2️⃣ SEO META in 1 CLICK
Быстрое рентген-зрение для страницы.
Показывает все мета-теги, заголовки, description, keywords — без похода в код. Один клик, и видно, чем живет страница. Полезно, когда нужно убедиться, что SEO не умеро при последнем релизе.
3️⃣ Cookie Editor
Если вы часто лазите в куки (а кто не лазит?), это — must-have.
Добавляйте, редактируйте и чистите куки без DevTools. Идеален, когда нужно быстро проверить авторизацию, логику входа или отловить странные состояния пользователя.
4️⃣ Clear Cache
Классика. Когда браузер упрямо показывает старую версию страницы — одно нажатие, и кэш очищен.
Можно выбрать, что именно чистить: куки, локалстор, историю, пароли. Работает быстрее, чем любая «жесткая перезагрузка».
5️⃣ ColorZilla
Пипетка, которая спасает нервы.
Навели курсор — получили код цвета. Никаких скриншотов в Figma и угадываний оттенков. Отличный способ проверить, совпадает ли брендовый синий с макетом.
6️⃣ Fake Filler
Если вы хоть раз вручную заполняли длинную форму, вы знаете, что боль существует.
Fake Filler заполняет все сам: имя, почту, телефон, дату рождения, даже индекс. Пара кликов — и форма готова к тесту.
7️⃣ WhatFont
Простой способ выяснить, каким шрифтом набран текст.
Навели — и сразу видно: семейство, размер, толщина. Когда дизайнер говорит «все как в макете», а вы подозреваете Roboto, а не Inter.
8️⃣ Page Ruler / Dimensions
Рулетка в браузере.
Измеряет расстояния между элементами и помогает ловить рассинхрон в отступах. Незаменимо, когда сетка вроде есть, но кнопка почему-то живет своей жизнью.
9️⃣ Window Resizer
Имитация разных разрешений.
Проверяйте адаптив прямо с десктопа: от айфона до телевизора. Никаких Device Toolbar — все переключается мгновенно.
1️⃣0️⃣ Width & Height Display
Показывает, в каком разрешении вы сейчас работаете.
Полезно, если тестите брейкпоинты и не хотите угадывать, почему все развалилось именно на 1024.
1️⃣1️⃣ Jam
Мечта любого QA. Делает скриншоты, записывает экран, логи, консоль и network — все в одном клике.
Можно даже посмотреть, что происходило за минуту до бага (если включена функция Instant Replay). Отправляете ссылку — и разработчик видит все сам, без «а что ты там нажимал».
Но не забываем про NDA — расширение хранит всю информацию у себя на сервере
1️⃣2️⃣ Netify
Карманный Charles прямо в DevTools.
Netify перехватывает и позволяет редактировать запросы прямо в браузере — без отдельного прокси и лишней возни. Можно фильтровать запросы по URL и методу, менять заголовки, тело ответа, коды статусов, добавлять задержки и даже отменять запросы.
Эти плагины экономят время, нервы и кофе.
С ними можно больше тестировать, меньше искать баги «на ощупь» и не тратить день на то, что решается парой кликов.
А какие расширения спасают вас на проектах?
Подписывайтесь 🔥 Red Collar | DEV
В 'https://t.me/rdclr_dev/332https://t.me/rdclr_dev/332' rel='nofollow'>прошлый раз мы собрали сайты, которые облегчат жизнь тестировщику. Но не все должно жить во вкладках — кое-что можно встроить прямо в браузер.
Мы собрали 12 расширений, которые экономят часы ручного тестирования. Они помогают быстро проверить верстку, куки, цвета, шрифты и даже записать баг — без миллиона кликов и DevTools.
1️⃣ PerfectPixel
Никаких гаданий «на глаз».
Этот плагин накладывает макет поверх страницы и сразу показывает, где верстка поехала. Пиксель в пиксель — и все становится очевидно.
2️⃣ SEO META in 1 CLICK
Быстрое рентген-зрение для страницы.
Показывает все мета-теги, заголовки, description, keywords — без похода в код. Один клик, и видно, чем живет страница. Полезно, когда нужно убедиться, что SEO не умеро при последнем релизе.
3️⃣ Cookie Editor
Если вы часто лазите в куки (а кто не лазит?), это — must-have.
Добавляйте, редактируйте и чистите куки без DevTools. Идеален, когда нужно быстро проверить авторизацию, логику входа или отловить странные состояния пользователя.
4️⃣ Clear Cache
Классика. Когда браузер упрямо показывает старую версию страницы — одно нажатие, и кэш очищен.
Можно выбрать, что именно чистить: куки, локалстор, историю, пароли. Работает быстрее, чем любая «жесткая перезагрузка».
5️⃣ ColorZilla
Пипетка, которая спасает нервы.
Навели курсор — получили код цвета. Никаких скриншотов в Figma и угадываний оттенков. Отличный способ проверить, совпадает ли брендовый синий с макетом.
6️⃣ Fake Filler
Если вы хоть раз вручную заполняли длинную форму, вы знаете, что боль существует.
Fake Filler заполняет все сам: имя, почту, телефон, дату рождения, даже индекс. Пара кликов — и форма готова к тесту.
7️⃣ WhatFont
Простой способ выяснить, каким шрифтом набран текст.
Навели — и сразу видно: семейство, размер, толщина. Когда дизайнер говорит «все как в макете», а вы подозреваете Roboto, а не Inter.
8️⃣ Page Ruler / Dimensions
Рулетка в браузере.
Измеряет расстояния между элементами и помогает ловить рассинхрон в отступах. Незаменимо, когда сетка вроде есть, но кнопка почему-то живет своей жизнью.
9️⃣ Window Resizer
Имитация разных разрешений.
Проверяйте адаптив прямо с десктопа: от айфона до телевизора. Никаких Device Toolbar — все переключается мгновенно.
1️⃣0️⃣ Width & Height Display
Показывает, в каком разрешении вы сейчас работаете.
Полезно, если тестите брейкпоинты и не хотите угадывать, почему все развалилось именно на 1024.
1️⃣1️⃣ Jam
Мечта любого QA. Делает скриншоты, записывает экран, логи, консоль и network — все в одном клике.
Можно даже посмотреть, что происходило за минуту до бага (если включена функция Instant Replay). Отправляете ссылку — и разработчик видит все сам, без «а что ты там нажимал».
Но не забываем про NDA — расширение хранит всю информацию у себя на сервере
1️⃣2️⃣ Netify
Карманный Charles прямо в DevTools.
Netify перехватывает и позволяет редактировать запросы прямо в браузере — без отдельного прокси и лишней возни. Можно фильтровать запросы по URL и методу, менять заголовки, тело ответа, коды статусов, добавлять задержки и даже отменять запросы.
Эти плагины экономят время, нервы и кофе.
С ними можно больше тестировать, меньше искать баги «на ощупь» и не тратить день на то, что решается парой кликов.
А какие расширения спасают вас на проектах?
Подписывайтесь 🔥 Red Collar | DEV