mozilla-mobile / firefox-ios

Firefox for iOS
Mozilla Public License 2.0
12.26k stars 2.95k forks source link

[Favicons refactor] - `IMDb.com` favicon is blurry in widgets #21996

Open abodea opened 2 months ago

abodea commented 2 months ago

Steps to reproduce

  1. Open www.imdb.com.
  2. Observe the favicon in widgets.

    Expected behavior

    The favicon is correctly displayed.

    Actual behavior

    IMDb.com favicon is blurry in widgets.

    Device & build information

    • Device: iPad Pro (18)
    • Build version: v131 (45309)
    • First seen version: N/A

      Notes

      Attachments:

image

┆Issue is synchronized with this Jira Task

data-sync-user commented 2 months ago

➤ ih-codes commented:

Related to https://mozilla-hub.atlassian.net/browse/FXIOS-9985 ( https://mozilla-hub.atlassian.net/browse/FXIOS-9985|smart-link )

Norberto Andres Furlan We can make the widget items smaller. Let me know if we should do that, or if we need to check with UX. Not sure if any a11y issues but this would be using the iOS guidelines for minimum tappable size:

Before:

!Screenshot 2024-09-16 at 3.31.12 PM.png|width=566,height=1075,alt="Screenshot 2024-09-16 at 3.31.12 PM.png"!

After:

!Screenshot 2024-09-16 at 3.32.46 PM.png|width=566,height=1075,alt="Screenshot 2024-09-16 at 3.32.46 PM.png"!

Also, we can make the images even smaller, but add a tappable rectangle around the images so functionally they’re still easy to use.

data-sync-user commented 2 months ago

➤ ih-codes commented:

Norberto Andres Furlan

I also figured out why the Facebook icon is wrong. It’s coming from https://static.xx.fbcdn.net/rsrc.php/yb/r/hLRJ1GG_y0J.ico ( https://static.xx.fbcdn.net/rsrc.php/yb/r/hLRJ1GG_y0J.ico ) instead of using our bundled images.

The widget code in the app is SwiftUI and does not check our bundled assets. This is something that would need to be added (probably a new ticket item). It’s also why the Google G is blurry and YouTube is blurry.

nbhasin2 commented 2 months ago

Blurry icons will be moving to S4 category and referencing the following PRs for it which improves it a bit on widget side https://github.com/mozilla-mobile/firefox-ios/pull/22056 - Widget Only https://github.com/mozilla-mobile/firefox-ios/pull/22101 - Widget + App