У нас есть несколько сред нашего веб-приложения, например, разработка, контроль качества и производство. Одна из частых и рискованных ошибок, которую совершают люди, — изменение конфигурации в неправильной среде.
Есть ли какой-либо плагин Chrome, где я могу настроить URL-адрес среды, чтобы можно было различать страницы инструментов конфигурации по некоторым заметным изменениям, например цвету заголовка и т. д.?
Например, когда я нахожусь в производственной среде, заголовок становится красным, а в dev — зеленым. Так что я знаю, что я должен быть особенно осторожным, когда он красный.
Является ли URLColors тем расширением, которое вы ищете? https://chrome.google.com/webstore/detail/urlcolors/jjccpcminoppplpmcfghflolejbdkekm
Это больше не работает, так как оказалось, что в нем было вредоносное ПО.
ОБНОВЛЕНИЕ 17 августа 2022 г .: он снова находится в магазине Chrome без флагов вредоносных программ.
Меня удивляет, что вы задали этот вопрос, потому что 6 месяцев назад я решил создать это расширение (я собирался назвать его Tempeh), не найдя жизнеспособной альтернативы.
Шесть месяцев назад я обнаружил, что нет расширения Chrome, которое вело бы себя так, как вы описали. Когда я решил разработать его, я обнаружил несколько вещей
После очень тщательного поиска я нашел сообщение формы, в котором говорилось, что есть вызов API, который позволяет вам изменить цвет OmniBox. В посте также упоминался номер релиза, который удалил эту функциональность (у меня его нет — это был не основной релиз).
Итак, чтобы ответить на ваш вопрос напрямую - нет расширения, которое действует именно так, как вы хотите, потому что оно не разрешено через API. Кроме того, я не нашел расширения, которое использует какой-либо другой тип уведомлений, и я отказался от проекта, потому что я не являюсь разработчиком внешнего интерфейса, и все действия «уведомления», которые я написал (изменить цвет фона, установить тонкую рамку вокруг области просмотра и т. д. ) оказался уродливым и обескураживающим (изменение цвета омнибокса гораздо более элегантно, ИМО).
Однако, если вы готовы принять вызов, теперь я могу придумать достойный способ реализовать это. Я бы, вероятно, реализовал вкладку в devtools, используя API-интерфейс devtools, который позволял бы пользователю (разработчику) устанавливать веб-сайты в категории и назначать им цвет. Затем, когда одна из этих страниц посещается, вы каким-то образом уведомляете разработчика....
Настройте любой веб-сайт в соответствии со своей цветовой схемой в 1 клик, тысячи пользовательских стилей с красивыми темами, скинами и бесплатными фонами.
★ Дайте Reddit темный режим, используйте минималистичный Facebook или измените внешний вид Google, Twitter и любого из ваших любимых сайтов.
★ Настройка фона, цветовых схем, шрифтов и даже анимации
★ Легко отключайте, включайте, редактируйте или удаляйте любые установленные темы.
★ Создавайте свои собственные пользовательские стили (темы) с помощью редактора CSS Stylish и делитесь ими с миллионами пользователей Stylish.
Прост в использовании и позволяет указывать группы URL-адресов с помощью регулярного выражения или подстановочного знака.
Это чистый CSS, и он всегда переопределяет стили сайта, поэтому вам не нужно сомневаться, работает ли он. Супер просто.
Возможно, недостаток: он работает на клиенте, поэтому пользователю нужно будет включить и правильно настроить его, хотя экспортировать и импортировать стили достаточно просто.
Зачем ожидать, что Chrome сделает это за вас, и как насчет того, когда вы тестируете для других браузеров, вы , надеюсь, тестируете для других браузеров , когда вы можете сделать это самостоятельно с минимальными усилиями? Подключаемые модули браузера в основном предназначены для предоставления веб-функций тем, кто не может изменять сайты.
Если у вас есть механизм автоматического развертывания, например развертывание через Jenkins или git, вы можете автоматически изменять цвет фона всей страницы конфигурации в зависимости от этапа развертывания.
Сделайте цвет фона для страницы настроек на каждом сервере или в каждой среде цветом, загружаемым со страниц css, которые не являются частью развернутого приложения, но присутствуют, но отличаются на серверах тестирования и контроля качества для производства. сервер.
На странице настроек включите немного JavaScript, чтобы изменить фон или добавить водяной знак или предупреждение.
function setColourBasedOnServer(){
if(document.URL.indexOf("TestServer") >= 0){ // Use some string unique to test
document.body.style.background = 'green';
}
if (document.URL.indexOf("QAServer") >= 0){ // Use some string unique to QA
document.body.style.background = 'amber';
}
else { // NOT Test or QA
document.body.style.background = 'white'; // Or some sensible default colour
}
}
И вызовите его:
<BODY onload="setColourBasedOnServer();">
Я использовал Tempermonkey именно для этого варианта использования. У меня нет кода под рукой, но это было довольно просто. Просто напишите скрипт, чтобы добавить навигационную панель к странице и на основе загруженного URL-адреса изменить цвет и т. д. Я также добавил кнопки для открытия одной и той же страницы на разных этапах для сравнения.
Варун Шарма