Website favicons can be very mangled

mohitgarg68

The favicon sometimes displays correctly but mostly looks very weird for some websites. It is reproducible after restarting. Attaching a screenshot for https://news.ycombinator.com/news.

I don't know how to attach the right favicon but probably can be extracted by viewing the website in a different browser.

Orion Version 0.99.127.3-beta; macOS Sonoma 14.5 build 23F79

Sonoma (14)

Vlad

mohitgarg68 Can you provide steps to reproduce from a new clean Orion profile?

mohitgarg68

Vlad Hi Vlad, I can confirm that the issue is fixed in a clean profile. I am not able to pin-point what caused it in the first place since I tried running the website in Compatibility Mode and after disabling all the extensions.

On a side note, is there a quick way to change profile of all my saved windows so that I can fix this issue?

Siebjee

mohitgarg68 It does not clarify how you got to the mangled favicons.

Can you provide exact steps eg:

Open browser
Goto [url]
Note the favicon being mangled (screenshot)

And also what you would expect?

That said, did some digging my self,

Orion browser
Optional: Tabs vertical setting enabled
Open urls, github.com, ycombinator.com and news.ycombinator.com

Horizontal tabs, just for completeness.

Note github and Y Combinator have correct icons, but hackernews does not.

Where in Safari:

Or chrome:

Is this what you have as well @mohitgarg68 ?

Edit:
Orion favorites:

Note: Icons here are normal.

CC: @Vlad

mohitgarg68

Hey folks, I tried again and this time I was able to repro the issue. Steps:

Create a clean profile with "Clean Profile" template.
Ignore the prompt to choose a default search engine.
Enable vertical tabs.
Visit news.ycombinator.com. The favicon is not displayed correctly.
Press "Show the previous page" button, then press "Show the next page" button, then reload. Now the favicon loads correctly.

I expect the favicon to be displayed correctly as it happens after Step 4. Notably, I have not seen this issue on other websites so far so maybe hacker news is doing something peculiar?

Please let me know if I need to provide more information. Thanks again!

Siebjee

I can confirm the "back" and "forward" does indeed "fix" the issue for that tab, that website. However, in the screen recording I took it's the same on all tabs. You even see the icon flash in it's correct form and then beaks (3rd tab).

Siebjee

The difference between kagi.com and news.ycombinator.com is that HN has a svg.

<head>
  <link rel="icon" href="y18.svg">
</head>

And kagi.com uses a icon.

<head>
    <link rel="apple-touch-icon" sizes="180x180" href="https://assets.kagi.com/v2/apple-touch-icon.png?v=ac011564ec30415537879cb454f81062e6e78308" />
    <link rel="icon" type="image/png" sizes="32x32" href="https://assets.kagi.com/v2/favicon-32x32.png?v=ac011564ec30415537879cb454f81062e6e78308" />
    <link rel="icon" type="image/png" sizes="16x16" href="https://assets.kagi.com/v2/favicon-16x16.png?v=ac011564ec30415537879cb454f81062e6e78308" />
    <link rel="mask-icon" href="https://assets.kagi.com/v2/safari-pinned-tab.svg?v=ac011564ec30415537879cb454f81062e6e78308" color="#FFB319" />
</head>

Not sure if this matters, but that's what I see in difference between the two and others.

mohitgarg68

Siebjee I am glad that we could confirm the issue. Nice observation on the svg! I am really curious as to why the svg loads when you go back and then forward. That's really weird...