1502648 - mutation observer and favicon changes are not working together

Status: RESOLVED INVALID

(Firefox :: Tabbed Browser, defect)

Description

[hellscyth]

User Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:63.0) Gecko/20100101 Firefox/63.0

Steps to reproduce:

Steps:

1. Open https://www.reddit.com/

2. Pull up the console with inspect element

3. Enter the js (I apologize for the long png encoding) document.querySelector('link[rel="icon"]').href = "data:image/png;base64,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";

4. Open a new reddit tab (e.g. right click on the r/all link and open it in a new tab)

--The favicon will revert back to reddit's new favicon--

Also, with the following javascript entered into the terminal, perform the same process

var targetNode = document.querySelector('link[rel="icon"]');

var config = { attributes: true };

var callback = function(mutationsList, observer) {
    for(var mutation of mutationsList) {
        if (mutation.type == 'attributes') {
             if (mutation.attributeName == 'href')
               {
                 console.log("href changed");
               }
        }
    }
};

var observer = new MutationObserver(callback);

observer.observe(targetNode, config);

The favicon changes, but there is no mutation event found.


Actual results:

I am trying to make a userscript that changes reddit's favicon. All the pieces of the script work as expected when entered into the console directly. After the favicon is changed, a new reddit tab being opened causes the favicon to revert to what it was previously. There is no mutation event that can be caught by an observer. Also, trying to use the mutation observer to change the favicon back is impossible because it creates an infinite loop.


Expected results:

The favicon for the current page should not change because a new tab with the same domain was opened.

When the favicon href does change, it should create a mutation event for an observer.

Mutation events should have some way of modifying the element they're meant to watch without it being recorded as another change to that element that the observer has to handle.

I just want to change a websites favicon

Comment 1

[u554753]

I'm not sure if this is intended behavior or an enhancement request. Can you clarify?

Comment 2

[hellscyth]

I think the intended behaviour should be firefox doesn't silently change the favicon, or at least give a mutation event when it does.

Comment 3

[Olli Pettay [:smaug][[e-mail]]]

Does the attribute value actually change? Since if not, there isn't any DOM mutation happening.

Comment 4

[Olli Pettay [:smaug][[e-mail]]]

(this sounds like a Firefox UI issue)

Comment 5

[Dão Gottwald [:dao]]

The link element is one-way communication. It's not supposed to change when the browser chooses to display another icon.