Как обновить значок расширения Chrome данными из API на каждой новой вкладке?

Question

Я хочу, чтобы значок обновлялся данными из API. Мне удалось обновить значок с помощью сценария в popup.html, но я не могу сделать это с помощью background.js

Манифест включает в себя:

"background": {
    "scripts": ["background.js"],
    "persistent": false
  },

Если я открою всплывающее окно расширений, которое вызывает файл .js, который работает нормально, и это код в этом файле .js:

$.getJSON('url', function(data) {
    var downloads = data.downloads;
    chrome.browserAction.setBadgeText({text:downloads});
});

Но я попробовал это в background.js, и это не сработало

chrome.tabs.onUpdated.addListener(function(tabId,changeInfo,tab) {
    fetch('url').then(response => {
      let data = response.json();
      var downloads = data.downloads
      chrome.browserAction.setBadgeText({"text":downloads});
    });
});

Я опустил функцию округления чисел, чтобы они соответствовали значку, но я учел это.

Что я делаю не так, не могли бы вы мне посоветовать?

Answer 1

Мне удалось решить проблему, возникла проблема с тем, как я использовал fetch. Найден этот ресурс , который помог мне исправить это.

Новый код background.js выглядит следующим образом

chrome.tabs.onUpdated.addListener(function(tabId,changeInfo,tab) {
  fetch(url)
    .then(response => response.json())
    .then(data => {
      console.log(data);
      var downloads = data.downloads;
      chrome.browserAction.setBadgeText({text:downloads});
    })
    .catch(console.error);
});