Расширение Chrome обнаруживает обновление поиска Google

Ответ 1

Поиск Google - это динамически обновляемая страница. Существует несколько известных методов обнаружения обновления: MutationObserver, основанный на таймере подход (см. waitForKeyElements wrapper) и событие, используемое сайтом, например pjax: end на GitHub.

К счастью, Google Поиск в браузере Chrome использует событие message, поэтому наш контент script:

window.addEventListener('message', function onMessage(e) {
    // console.log(e);
    if (typeof e.data === 'object' && e.data.type === 'sr') {
        onSearchUpdated();
    }
});

function onSearchUpdated() {
    document.getElementById('resultStats').style.backgroundColor = 'yellow';
}

Этот метод использует недокументированную функцию сайта, которая не работает в Firefox, например.

Более надежный метод crossbrowser, доступный для расширений Chrome и WebExtensions, предназначен для мониторинга изменений URL-адресов страниц, поскольку страница результатов поиска Google всегда обновляет хэш-часть URL-адреса. Нам понадобится фон/страница событий, chrome.tabs.onUpdated прослушиватель и messaging:

• background.js

  var rxGoogleSearch = /^https?:\/\/(www\.)?google\.(com|\w\w(\.\w\w)?)\/.*?[?#&]q=/;
  chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {
      if (rxGoogleSearch.test(changeInfo.url)) {
          chrome.tabs.sendMessage(tabId, 'url-update');
      }
  });
  

• content.js

  chrome.runtime.onMessage.addListener(function(msg, sender, sendResponse) {
      if (msg === 'url-update') {
          onSearchUpdated();
      }
  });
  
  function onSearchUpdated() {
      document.getElementById('resultStats').style.backgroundColor = 'yellow';
  }
  

• manifest.json: фон/страница событий и контент script, "tabs" permission.