Opened 18 months ago
Last modified 9 months ago
#18439 assigned bug
Gerrit site not showing icons anymore
| Reported by: | humdinger | Owned by: | nephele |
|---|---|---|---|
| Priority: | normal | Milestone: | Unscheduled |
| Component: | Kits/Web Kit | Version: | R1/beta4 |
| Keywords: | Cc: | ||
| Blocked By: | Blocking: | #18787 | |
| Platform: | All |
Description
Probably since an update to our Gerrit site early June 2023, the icons are missing and only text like "arrow_drop_down" is shown instead. Still works with Web (Epiphany), not with WebPositive.
Putting the noto-emoji icons from https://fonts.google.com/noto/specimen/Noto+Emoji into /boot/system/non-packaged/data/fonts/ttf didn't solve the issue.
Attachments (3)
Change History (18)
comment:1 by , 18 months ago
comment:3 by , 18 months ago
I'd say we should definetely ship whatever we need, and not rely on foreign ressources that can track users by their downloads. So that'd either be patching gerrit to behave normally or include that font.
comment:4 by , 18 months ago
The fonts are served from the gerrit instance itself, so no tracking.
The font is Material Symbols Outlined, and it abuses ligatures so that, for example, the text arrow_drop_down is rendered as one glyph with the drop down arrow. So no luck in nightlies either: #17414.
by , 17 months ago
| Attachment: | remove-icon-ligatures.js added |
|---|
Gerrit js plugin to replace icon names with their corresponding characters
comment:5 by , 17 months ago
We can have an ugly workaround from within gerrit. It would only work for our instance, of course.
Dropping the attached file in ${GERRIT_SITE}/plugins injects js that watches the content for icons and replaces the texts with the private characters. The font is a variable type served as woff2, so we also need a version in a format we support. I tried putting that into ${GERRIT_SITE}/static, but it is served as text/html and rejected by the browser, so I'm pointing to my own server. If accepted feel free to keep it as is or to download the font and serve it from somewhere more appropriate.
comment:6 by , 15 months ago
The script seems fine. Why do you need to ship a font though? wouldn't it be enough to use equivalent already existing emoji we have via noto emoji already?
For example drop down would be ⏷ play would be ▶️ Etc.
If you want i'd start replacing some of them with apropriate emoji, commenting out the other ones and we'd add new ones later as they are needed?
comment:7 by , 10 months ago
| Blocking: | 18787 added |
|---|
comment:8 by , 9 months ago
The plugin is now deployed, for reference I used this command:
ssh -l pulkomandy review.haiku-os.org gerrit plugin install -n remove-icon-ligatures.js - < ./remove-icon-ligatures.js
I'm not sure if I need to make some changes to the infrastructure repository to make this persistent?
comment:9 by , 9 months ago
Current noto fonts package (2014) resolved some of the font rendering issue for Gerrit - the drop down arrows are small boxes - but the basic text is rendering a lot better (no longer distorted text (i.e. more conformant)).
comment:10 by , 9 months ago
It's completely unrelated to the Noto font, I just deployed Madmax's Gerrit plugin to replace the ligature based font with another solution.
comment:11 by , 9 months ago
Ok. I still see an issue with woff2 font handling when using WebPositive dealing with Material Symbols and Icons on Haiku x64 (hrev56578+95). Gerrit's web page rendering seems fine when using Dooble web browser.
comment:12 by , 9 months ago
Looks fine to me...
What's "woff and woff2 font handling"? Got a screenshot?
by , 9 months ago
| Attachment: | webpositive_gerrit_page.jpeg added |
|---|
Haiku's Gerrit page rendering using WebPositive_618.1.10 on HaikuR1B4_x64
comment:13 by , 9 months ago
Web Open Font Format v2 (compressed Opentype/TrueType fonts w/metadata (including symbols/icons/CSS). You mentioned something is working fine for you now (i.e. WebPositive ?!?). I attached the picture which shows the WebPositive/HaikuWebKit 618.1.10 rendering issue with "right arrow" symbol in the Owners/Review column. ALso, the 'green' (+1, +2) or rejected (-1) code-review checkboxes and the 'orange-colored unresolved comments' symbol in the Status column.
There were some remaining issues with Cascading Style Sheets with WebPositive/HaikuWebKit.
comment:14 by , 9 months ago
Again nothing to do with what you are saying.
App-private fonts is a new feature only available in nightlies, you'll have to wait for beta5. As a workaround, you can download the font and install it system-wide, putting it in ~/config/non-packaged/data/fonts will do. You can get it here.
comment:15 by , 9 months ago
Thanks, madmax. Using material-icons v1.13.12, I installed material-icons.woff2. Failed. I installed material-icons.woff. Passed - all icons, symbols, and text rendering on Gerrit looks conformant now on Haiku R1B4 x64 (hrev56578+95) using WebPositive (HaikuWebKit 1.9.11 (WebKit 618.1.10)).
by , 9 months ago
| Attachment: | WebPositive_Gerrit_material-icons_cocobean.jpeg added |
|---|
Haiku's Gerrit page rendering using WebPositive_618.1.10 on HaikuR1B4_x64 w/material-icons.woff v1.13.12
I think you need FontAwesome rather than Noto Emoji. It is recognizable because it uses a hack based on ligatures to replace words like "arrow_drop_down" with icons, whereas Noto Emoji only provides Unicode Emojis (so if it was missing, it would show invalid characters or empty squares "mojibake").
Also, in nightlies, font downloading is supported, and I don't think there are plans to backport this in beta4 app_server. So, this should work out of the box in nightlies, and there is nothing more to do in this ticket.