Missing Favicon for Syncthing GUI Topic is solved

Talk about code development, features, specific bugs, enhancements, patches, and similar things.
Forum rules
Please keep everything here strictly on-topic.
This board is meant for Pale Moon source code development related subjects only like code snippets, patches, specific bugs, git, the repositories, etc.

This is not for tech support! Please do not post tech support questions in the "Development" board!
Please make sure not to use this board for support questions. Please post issues with specific websites, extensions, etc. in the relevant boards for those topics.

Please keep things on-topic as this forum will be used for reference for Pale Moon development. Expect topics that aren't relevant as such to be moved or deleted.
User avatar
mopani
Newbie
Newbie
Posts: 5
Joined: 2019-01-05, 00:56

Missing Favicon for Syncthing GUI

Unread post by mopani » 2021-04-25, 16:45

Windows 10 Pro 20H2, Pale Moon desktop/32 v29.1.1

Pale Moon is not loading the (dynamic) favicon for the Syncthing GUI. Confirmed this with a fresh Pale Moon profile and fresh install of Syncthing.

The favicon is dynamic based on scripting, but it appears that Pale Moon does not update the favicon after initially loading the page (the tab and URL bar only ever show the generic moon icon, the favicon never resolves). This is the case both for localhost browsing (http & https) and public (https) IP/URL installations.

The html source for the Syncthing GUI shows this for the favicon entry:

Code: Select all

<link rel="shortcut icon" href="assets/img/favicon-{{syncthingStatus()}}.png"/>


Chrome displays the favicon appropriately on first load and as it updates. FireFox fails to load the favicon initially, but it does update the tab and URL bar icon once the page has loaded.

See the workaround posted at https://forum.syncthing.net/t/fixing-sy ... efox/15726 for details.

User avatar
Moonchild
Pale Moon guru
Pale Moon guru
Posts: 35474
Joined: 2011-08-28, 17:27
Location: Motala, SE
Contact:

Re: Missing Favicon for Syncthing GUI

Unread post by Moonchild » 2021-04-25, 20:33

This isn't a bug; you're designing something around a specific Chrome-ism.
GUI favicons are not part of web content and are cached separately, for one. They also can't be treated as if they were part of web content since they are just meta data in the HTML. The components of an HTML document are loaded and parsed before any script is executed so it is correct that

Code: Select all

<link rel="shortcut icon" href="assets/img/favicon-{{syncthingStatus()}}.png"/>
does not show a later-dynamically-replaced icon.

If you want to replace the favicon then you have to do so through DOM manipulation which should work just fine. e.g. (not tested):

Code: Select all

const favicon = document.querySelector('[rel=icon]');

function eventHandler(yourEvent) {
  favicon.href = "https://link.to/yourdynamicfavicon.ico";
}
The main <link> element should have a valid temporary/generic icon listed.

That should be cross-browser compatible, but even so, there's no guarantee that anything will be updated dynamically because, as said, the GUI isn't part of page content.
"Sometimes, the best way to get what you want is to be a good person." -- Louis Rossmann
"Seek wisdom, not knowledge. Knowledge is of the past; wisdom is of the future." -- Native American proverb
"Linux makes everything difficult." -- Lyceus Anubite

User avatar
mopani
Newbie
Newbie
Posts: 5
Joined: 2019-01-05, 00:56

Re: Missing Favicon for Syncthing GUI

Unread post by mopani » 2021-04-26, 16:10

Thanks for the clear explanation.

I've filed a bug with Syncthing for this very fix (valid image in the initial HTML).

Locked