userscript for getting rid of annoying notifications counter on title of pages like Facebook, Linkedin, etc

Question

I am trying to do a userscript rid of annoying notifications counter on title of pages like Facebook, Linkedin, etc.

Firstly I tried to use the extension "Rename Tab Title" https://chrome.google.com/webstore/detail/rename-tab-title/kppndhfiaenbiioipolacicknfmdcdep with my configuration described in the Support tab of that page, in the comment of user Sérgio Loureiro. But had no success.

What I mean is the "(1) " thing before the page title, that will be rendered on the respective tab. In this case I was doing it for the Vivaldi browser, that supports user script from the base, without any extension. I think this is also available for other browsers via tampermonkey or greasemonkey.

An example:

So I wrote an *.user.js file with the contents:

// ==UserScript==
// @match http://*/*
// @match https://*/*
// ==/UserScript==

(function () {
    document.title = document.title.replace(/^\(.*\) /, '');

    // Select the node that will be observed for mutations
    const targetNode = document.getElementById('title');

    // Options for the observer (which mutations to observe)
    const config = { characterData: true };

    // Callback function to execute when mutations are observed
    const callback = function(mutationsList, observer)
    {
        // Use traditional 'for loops' for IE 11
        for(const mutation of mutationsList)
        {
            document.title = document.title.replace(/^\(.*\) /, '');
        }
    };

    // Create an observer instance linked to the callback function
    const observer = new MutationObserver(callback);

    // Start observing the target node for configured mutations
    observer.observe(targetNode, config);
})();

and followed the process on https://forum.vivaldi.net/topic/66719/userscript-installation to get it added to the browser as an extension, but I continue to see this distracting counter. ☹️

So, my question, as a very lay person on javascript and user scripts is: What am I doing wrong?

I've wrote the mutation observer handler to catch when the server page is trying to change the page title out of a page load request operation, but it seems to me it is not working.

Answer 1

Derived from my own tests and @cactus12 experiences, here is a user script that seems to work.

One needs to follow the process in https://forum.vivaldi.net/topic/66719/userscript-installation using a script like the following:

// ==UserScript==
// @match http://*/*
// @match https://*/*
// ==/UserScript==

(function () {
    function cleanTitle()
    {
        const regex = /^\(.*\) /;

        if(document.title.match(regex) != null)
            document.title = document.title.replace(regex, '');
    }

    // Select the node that will be observed for mutations
    const titleNode = document.querySelector('title');

    // Options for the observer (which mutations to observe)
    const config = { childList: true };

    // Create an observer instance linked to the callback function
    const observer = new MutationObserver(cleanTitle);

    // Start observing the target node for configured mutations
    observer.observe(titleNode, config);

    //-----------------------------------------------------------------

    cleanTitle();   //initial clean
})();