Greasy Fork

Replace string only works on load, changes back on navigation

Hi

I am trying to replace or hide some fields on a website, because I will show the website in a stream, but the information shouldn't be published. It works, but only if I reload the website. Every time I navigate, the old value appears.

Here is the code:

// ==UserScript==
// @name        Replace Username on Tutti.ch
// @namespace   ExtraBoost
// @version     0.1
// @description This might be only interesting for people, who are streaming or have others watching them on tutti.ch.
// @match       https://www.tutti.ch/*
// @copyright   maxmoon 2019+
// ==/UserScript==

function replaceUsername() {

    var innerHTMLString="<a href='http://extraboost.org' target='_blank'>maxmoon</a>";
    var usernameField=document.querySelector("span[class='_1S6NY']");

    usernameField.innerHTML=innerHTMLString;
}

window.addEventListener("load", replaceUsername, false);

I am very thankful for your help :smile:

The site uses dynamic navigation so you'll have to use MutationObserver or rerun replaceUsername periodically using setInterval.

Thanks a lot for your help. I've found other Observer examples of you in this forum, but I really struggle to get it work for my example. The following doesn't work :(

// ==UserScript==
// @name        Replace Username on Tutti.ch
// @namespace   ExtraBoost
// @version     0.1
// @description This might be only interesting for people, who are streaming or have others watching them on tutti.ch.
// @match       https://www.tutti.ch/*
// @copyright   maxmoon 2019+
// ==/UserScript==

function replaceUsername() {

    var innerHTMLString="<a href='https://www.twitch.tv/maxmoon2050' target='_blank'>maxmoon</a>";
    var usernameField=document.querySelector("span[class='_1S6NY']");

    usernameField.innerHTML=innerHTMLString;
}

const userName = document.querySelector("span[class='_1S6NY']");
new MutationObserver((mutations, observer) => {
var innerHTMLString="<a href='http://extraboost.org' target='_blank'>maxmoon</a>";
  if (userName) {
    userName.innerHTML=innerHTMLString;
    observer.disconnect();
    observer.callback(userName);
  }
}).observe(document, {subtree: true, childList: true});

window.addEventListener("load", replaceUsername, false);

@wOxxOm schrieb: The site uses dynamic navigation so you'll have to use MutationObserver or rerun replaceUsername periodically using setInterval.

What am I doing wrong with the Observer? Is it called in a wrong way?