Update available - get CSS or TagName of DIV about dark-whatsapp HOT 4 OPEN

I have to add now, that without the Timeout function, after start of ferdium, the Update message keeps displaying. So I added again the timeout. All code now in user.js for WhatsApp service:

module.exports = (config, Ferdium) => {
  [data-testid="chat-butterbar"]:has([data-icon="alert-update"]) {
    display: none !important;
  }
  // 2023-05-26: von: https://github.com/TheGoddessInari/hamsket/issues/75#issuecomment-1555946206
  const interval = setInterval(hideUpdateMessage, 1000);
  function hideUpdateMessage() {
    const updateMessage = document.querySelector('span[data-testid="chat-butterbar"]');
    if (updateMessage !== undefined) {
      updateMessage.style.display = "none";
      clearInterval(interval);
    };
  };  
};

I changed my code to the one from @jschiefner because it is much better 👍 thanks, Jonas ❤️
Read it there: Whatsapp update available #75

from dark-whatsapp.

Now I noticed, that I can indeedly look into the real code of WhatsApp Web in Ferdium, with:
View > Toggle Service Developer Tools (ALT+CTRL+SHIFT+I) and indeed I found the Update message in the chat-butterbar!
But my code didnt help, so I changed it in the service's user.js to:

module.exports = (config, Ferdium) => {
  // Write your scripts here
  // 2023-03-25: warten bis Seite fertig geladen ist...
  window.addEventListener("load", (event) => {
    document.querySelectorAll('[data-testid="chat-butterbar"]')[0].style.display = "none";
  });  
  // zur Sicherheit noch mal mit Timeout (delay in ms)
  let timeout;
  let delay = 15000;
  function waTimeout() {
    timeout = setTimeout(hideUpdateMessage, 15000);
  }
  function hideUpdateMessage() {
    document.querySelectorAll('[data-testid="chat-butterbar"]')[0].style.display = "none";
  }
};

So first the display none should wait till the site is fully loaded and then (to be sure) again the same display none after 15 sec. with setTimeout function.
I cannot say if it works yet, because always when reload the service the Update nagscreen is gone (not for good), so I have to wait.
Will tell if it works here and at other spots, where I asked in vain for hints about that 😄
Strange that never anybody told me about the Service Dev Tools, I was sure I could not see inside the html of the webview element!
See ferdium issue #572 for the working code (with setInterval).

from dark-whatsapp.

It's probably not ideal to hide all alerts. In that case, I suggest injecting a simple style element which contains the following CSS code:

[data-testid="chat-butterbar"]:has([data-icon="alert-update"]) {
    display: none !important;
}

That makes this workaround pretty trivial. I tested it from my browser and everything worked pretty well.

from dark-whatsapp.

It's probably not ideal to hide all alerts. In that case, I suggest injecting a simple style element which contains the following CSS code:

[data-testid="chat-butterbar"]:has([data-icon="alert-update"]) {
    display: none !important;
}

That makes this workaround pretty trivial. I tested it from my browser and everything worked pretty well.

Is it possible to add this into the official releases? I'm not sure how to do add it to the CSS myself.

from dark-whatsapp.