Умные пользовательские скрипты

1Что такое умные пользовательские скрипты?#

Умные пользовательские скрипты — это отдельные именованные скрипты, у каждого из которых свои:
🌐 шаблоны URL (на каких страницах запускать)
⏱ момент запуска (до, во время или после загрузки)
✅ переключатель «Включить/Выключить»

Они работают как Greasemonkey или Tampermonkey в браузерах на компьютере, но встроены прямо в ваше приложение.

✅ Отлично подходит для:

• Автовход ТОЛЬКО на странице /login
• Скрывать рекламу ТОЛЬКО на страницах статей (https://news.com/article/*)
• Отслеживайте изменения DOM с помощью MutationObserver
• Внедрять до отрисовки страницы (document-start), чтобы избежать вспышки

Главное отличие от быстрого внедрения:
Быстрое внедрение = один и тот же CSS/JS на ВСЕХ страницах
Умные пользовательские скрипты = управление для каждого скрипта, каждого URL и момента запуска

2Где это найти#

Шаг 4 (Разрешения) → прокрутите вниз → карточка 🤖 Умные пользовательские скрипты.

Нажмите «+ Добавить», чтобы создать новый скрипт. У каждого скрипта есть:

• Название — отображается в списке менеджера
• Шаблоны URL — по одному в строке (поддерживается подстановочный знак *)
• Момент запуска — document-end / document-start / document-idle
• Код — ваш JavaScript
• Переключатель «Включено»

Нажмите на любую строку, чтобы изменить или удалить скрипт.

3Примеры шаблонов URL#

Шаблоны определяют, на каких страницах запускается скрипт. Используйте * как подстановочный знак:

# Run on every page of every site
*://*/*

# Run only on example.com (any path)
https://example.com/*

# Run on ALL pages of ANY .com domain
https://*.com/*

# Run only on the /login path
https://example.com/login
https://example.com/login/*

# Run on news article pages
https://news.example.com/article/*

4Момент запуска: объяснение#

• document-end (по умолчанию)

Запускается ПОСЛЕ завершения загрузки страницы. Безопасно и наиболее совместимо. Подходит для скрытия элементов, добавления кнопок, отслеживания.

• document-start ⚡ (расширенный)

Запускается ДО отрисовки страницы. Внедряет скрипт в исходный HTML через shouldInterceptRequest. Удаляет заголовки CSP. Подходит для CSS тёмной темы или принудительной настройки viewport до отрисовки макета.

• document-idle ⏱

Запускается через 1,5 секунды после загрузки страницы. Подходит для контента AJAX, который подгружается поздно, или окон, появляющихся с задержкой.

5Пример 1: автоматический вход только на /login#

Совпадение: https://myapp.com/login
Запуск: document-end

// Auto-fill login form
(function() {
  var email = document.querySelector('input[type=email], input[name=email]');
  var pass  = document.querySelector('input[type=password]');
  if (email) email.value = '[email protected]';
  if (pass)  pass.value  = 'mypassword';
  // Uncomment to auto-submit:
  // var form = document.querySelector('form');
  // if (form) form.submit();
})();

6Пример 2: скрыть платные стены на страницах статей#

Совпадение: https://news.site.com/article/*
Запуск: document-end

// Hide paywall overlay and restore scroll
(function() {
  var overlay = document.querySelector('.paywall-overlay, .metered-content, #paywall');
  if (overlay) overlay.remove();
  document.body.style.overflow = 'auto';
  document.documentElement.style.overflow = 'auto';
})();

7Пример 3: отслеживание динамического контента (MutationObserver)#

Совпадение: *://*/*
Запуск: document-end
Для элементов, которые появляются ПОСЛЕ загрузки страницы (отложенно загружаемые окна, реклама):

// Remove any modal/popup that appears dynamically
(function() {
  var sel = '.modal, .popup, .overlay, [class*="modal"], [class*="popup"]';
  // Remove existing ones first
  document.querySelectorAll(sel).forEach(function(el) { el.remove(); });
  // Watch for new ones
  var obs = new MutationObserver(function() {
    document.querySelectorAll(sel).forEach(function(el) { el.remove(); });
  });
  obs.observe(document.body, { childList: true, subtree: true });
  // Stop watching after 30 s to save battery
  setTimeout(function() { obs.disconnect(); }, 30000);
})();

8Пример 4: принудительная тёмная тема до отрисовки (document-start)#

Совпадение: *://*/*
Запуск: document-start
Внедряет CSS до отрисовки страницы — без белой вспышки:

// Inject dark theme before page renders
(function() {
  var s = document.createElement('style');
  s.id = '__force_dark__';
  s.textContent = [
    'html { filter: invert(1) hue-rotate(180deg) !important; }',
    'img,video,canvas,svg { filter: invert(1) hue-rotate(180deg) !important; }'
  ].join('\
');
  (document.head || document.documentElement).appendChild(s);
})();

9Пример 5: собственная аналитика / отслеживание событий#

Совпадение: https://myshop.com/*
Запуск: document-idle
Отправляйте собственные события, когда страница полностью загрузилась:

// Track page views + button clicks
(function() {
  // Page view
  console.log('[Analytics] Page: ' + location.href);

  // Track all CTA button clicks
  document.querySelectorAll('button, .btn, a[href]').forEach(function(el) {
    el.addEventListener('click', function() {
      console.log('[Analytics] Clicked: ' + (el.textContent || el.href));
      // Replace with your own tracker call, e.g. gtag('event', ...)
    });
  });
})();

10Безопасность и ограничения#

⚡ document-start удаляет заголовки Content-Security-Policy для подходящей страницы. Используйте только на сайтах, которыми вы владеете или которым явно доверяете.

🔒 Политика одного источника: JS не имеет доступа к iframe с другого источника (PayPal, Stripe, вход через Google). Это ограничение браузерного движка, обойти его нельзя.

📵 Только HTTPS: API вроде геолокации или камеры во внедряемых скриптах требуют HTTPS.

✅ Защита от двойного запуска: каждый скрипт защищён флагом window, поэтому выполняется только один раз на страницу.

✅ Работает офлайн: умные пользовательские скрипты также запускаются в офлайн-приложениях из ZIP.