Unable to find what's wrong in my code as I'm getting "Failed to execute 'observe' on 'MutationObserver': parameter 1 is not of type 'Node'" error.

I need to find if the data-count changes, if it does - print out that value to the console.

However, didn't manage a way on how to do that.

EDIT: it looks like that my script works, after the first attempt (getting error on page load, then going to another tab and comming back it prints out the correct value).

foreground.js:

var ember = document.getElementsByClassName("ember-view c-tab__list__item publicConversation");
var elementToWatch;

for(item of ember){
  if(item.getAttribute("data-test-id") === "public-conversation" && item.getAttribute("data-count") != 0)
  {
    console.log(item.getAttribute("data-count"));
    elementToWatch = item.getAttributeNode("data-count");

  }
}

var config = {attributeFilter: ['data-update']};

var observer = new MutationObserver(function(mutations) {
  mutations.forEach(function(mutation) {
    if (mutation.target.dataset.update == 'true') {
      console.log('Attribute value updated', mutation);
    }
  });
});
observer.observe(elementToWatch, config);

background.js:

chrome.tabs.onUpdated.addListener(function(id, info, tab){
    if (tab.status !== "complete"){
        return;
    }
    if(tab.url.indexOf("tickets") != -1){
       chrome.tabs.executeScript(tab.id, {"file": "foreground.js"});
       console.log("injected");
    }
});

manifest.json:

{
"manifest_version": 2,
"name": "extension",
"version": "1.69",
"description": "Does things:)",

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

"content_scripts": [
    {
        "matches": ["https://exampleweb.com/tickets/*"],
        "js": ["foreground.js"]
    }
]
}

HTML example:

<li id="ember7026" class="ember-view c-tab__list__item publicConversation" data-test-id="public-conversation" data-count="0" aria-expanded="false" aria-selected="false"><span class="is_new_flag">NEW</span>Public
</li>