cockpit-zfs-manager
cockpit-zfs-manager copied to clipboard
45Drives
Missing icons on Cockpit 277-1
I'm running Cockpit from Ubuntu 22.04's repositories. The normal repositories package Cockpit 264-1, and this issue is not present there.
Upon upgrading to the version available in backports (277-1), as per Cockpit's website recommendation, icons disappeared on the ZFS manager:
Table headers also look weirdly styled. In general this looks to be some sort of CSS problem.
Happens on Firefox 109 and Chromium 108.
Looks like some fonts are failing to load:
When I try to manually open fontawesome on the browser:
I am using Cockpit 283-1 and have (had) the same problem. But I found a quick and dirty fix: I just copied /usr/share/cockpit/base1/fonts/ from an old Cockpit-Installation (239-1) to the new one and after a page-reload the icons are properly displayed again.
# ls -l /usr/share/cockpit/base1/fonts/
total 150
-rw-r--r-- 1 root root 98024 Mar 3 2021 fontawesome.woff
-rw-r--r-- 1 root root 23424 Mar 3 2021 glyphicons.woff
-rw-r--r-- 1 root root 38952 Mar 3 2021 patternfly.woff
We also have an affected system, the workaround from h4fn1x worked for me as well.
In order to help with a proper fix, I did narrow down when these woff files were removed, it was between 272 (last version to have them) and 273 (removed). Some further digging lead to this commit: https://github.com/cockpit-project/cockpit/commit/e4b963b158e0a4dc1802bbcf9a72c7db95fdef88 My understanding of how this font handling is supposed to work is too limited at this point to say what a fix would look like. Or is the expectation that these fonts are provided by the OS somehow? In that case, it might be more of a packaging question.
Just in case it makes a difference, here are the machine and package infos.
OS: Debian bullseye Cockpit: 284 from bullseye backports and the cockpit plugins from 45drives.com
apt-cache policy cockpit
cockpit:
Installed: 284-1~bpo11+1
Candidate: 284-1~bpo11+1
Version table:
*** 284-1~bpo11+1 100
100 http://deb.debian.org/debian bullseye-backports/main amd64 Packages
100 /var/lib/dpkg/status
250.1.1-1 500
500 http://repo.45drives.com/debian focal/main amd64 Packages
239-1 500
500 http://ftp.debian.org/debian bullseye/main amd64 Packages
237.2-1focal 500
500 http://repo.45drives.com/debian focal/main amd64 Packages
237.1-1focal 500
500 http://repo.45drives.com/debian focal/main amd64 Packages
cockpit-zfs-manager:
Installed: 1.3.0-3focal
Candidate: 1.3.0-3focal
Version table:
*** 1.3.0-3focal 500
500 http://repo.45drives.com/debian focal/main amd64 Packages
100 /var/lib/dpkg/status
1.3.0-2focal 500
500 http://repo.45drives.com/debian focal/main amd64 Packages
1.2.3focal-3 500
500 http://repo.45drives.com/debian focal/main amd64 Packages
1.2.2-1focal 500
500 http://repo.45drives.com/debian focal/main amd64 Packages
1.2.1focal-2 500
500 http://repo.45drives.com/debian focal/main amd64 Packages
1.2.0focal-1 500
500 http://repo.45drives.com/debian focal/main amd64 Packages
The workaround doesn't quite fix all though:
The headers on the dataset list table as you can see don't look right - perhaps some of the styles gone on the commit @RolfWojtech unearthed
I am using Cockpit 283-1 and have (had) the same problem. But I found a quick and dirty fix: I just copied
/usr/share/cockpit/base1/fonts/from an old Cockpit-Installation (239-1) to the new one and after a page-reload the icons are properly displayed again.# ls -l /usr/share/cockpit/base1/fonts/ total 150 -rw-r--r-- 1 root root 98024 Mar 3 2021 fontawesome.woff -rw-r--r-- 1 root root 23424 Mar 3 2021 glyphicons.woff -rw-r--r-- 1 root root 38952 Mar 3 2021 patternfly.woff
Hi h4fn1x, I'm using Cockpit 287-1~bpo11+1, but I didn't see the fonts folder under /usr/share/cockpit/base1 (as shown below),
root@pve:/usr/share/cockpit/base1# ls -l
total 104
-rw-r--r-- 1 root root 16324 Apr 15 15:26 cockpit.js.gz
-rw-r--r-- 1 root root 139 Apr 15 15:26 manifest.json
-rw-r--r-- 1 root root 1115 Apr 15 15:26 po.cs.js.gz
-rw-r--r-- 1 root root 1005 Apr 15 15:26 po.de.js.gz
-rw-r--r-- 1 root root 990 Apr 15 15:26 po.es.js.gz
-rw-r--r-- 1 root root 1002 Apr 15 15:26 po.fi.js.gz
-rw-r--r-- 1 root root 1007 Apr 15 15:26 po.fr.js.gz
-rw-r--r-- 1 root root 1103 Apr 15 15:26 po.he.js.gz
-rw-r--r-- 1 root root 959 Apr 15 15:26 po.it.js.gz
-rw-r--r-- 1 root root 1161 Apr 15 15:26 po.ja.js.gz
-rw-r--r-- 1 root root 1242 Apr 15 15:26 po.ka.js.gz
-rw-r--r-- 1 root root 1119 Apr 15 15:26 po.ko.js.gz
-rw-r--r-- 1 root root 925 Apr 15 15:26 po.nb_NO.js.gz
-rw-r--r-- 1 root root 935 Apr 15 15:26 po.nl.js.gz
-rw-r--r-- 1 root root 1112 Apr 15 15:26 po.pl.js.gz
-rw-r--r-- 1 root root 1003 Apr 15 15:26 po.pt_BR.js.gz
-rw-r--r-- 1 root root 1351 Apr 15 15:26 po.ru.js.gz
-rw-r--r-- 1 root root 1038 Apr 15 15:26 po.sk.js.gz
-rw-r--r-- 1 root root 944 Apr 15 15:26 po.sv.js.gz
-rw-r--r-- 1 root root 1021 Apr 15 15:26 po.tr.js.gz
-rw-r--r-- 1 root root 1422 Apr 15 15:26 po.uk.js.gz
-rw-r--r-- 1 root root 1074 Apr 15 15:26 po.zh_CN.js.gz
-rw-r--r-- 1 root root 1033 Apr 15 15:26 po.zh_TW.js.gz
nor in the package of version 239 (as shown below).
Directory of C:\Users\user\Desktop\cockpit-239\pkg\base1
05/24/2023 03:24 PM <DIR> .
05/24/2023 03:24 PM <DIR> ..
03/03/2021 11:37 PM 148,793 cockpit.js
03/03/2021 11:37 PM 139 manifest.json
03/03/2021 11:37 PM 2,023 test-base64.js
03/03/2021 11:37 PM 4,396 test-browser-storage.js
03/03/2021 11:37 PM 3,000 test-cache.js
03/03/2021 11:37 PM 28,946 test-chan.js
03/03/2021 11:37 PM 592 test-dbus-address.js
03/03/2021 11:37 PM 56,426 test-dbus-common.js
03/03/2021 11:37 PM 3,098 test-dbus-framed.js
03/03/2021 11:37 PM 29,488 test-dbus.js
03/03/2021 11:37 PM 3,465 test-echo.js
03/03/2021 11:37 PM 1,413 test-events.js
03/03/2021 11:37 PM 3,921 test-external.js
03/03/2021 11:37 PM 18,246 test-file.js
03/03/2021 11:37 PM 6,329 test-format.js
03/03/2021 11:37 PM 2,883 test-framed-cache.js
03/03/2021 11:37 PM 3,438 test-framed.js
03/03/2021 11:37 PM 14,627 test-http.js
03/03/2021 11:37 PM 7,797 test-journal-renderer.js
03/03/2021 11:37 PM 10,459 test-locale.js
03/03/2021 11:37 PM 8,869 test-location.js
03/03/2021 11:37 PM 3,297 test-metrics.js
03/03/2021 11:37 PM 1,080 test-no-jquery.js
03/03/2021 11:37 PM 1,927 test-permissions.js
03/03/2021 11:37 PM 496 test-promise.js
03/03/2021 11:37 PM 3,546 test-protocol.js
03/03/2021 11:37 PM 15,419 test-series.js
03/03/2021 11:37 PM 9,445 test-spawn-proc.js
03/03/2021 11:37 PM 12,246 test-spawn.js
03/03/2021 11:37 PM 2,576 test-user.js
03/03/2021 11:37 PM 4,712 test-utf8.js
03/03/2021 11:37 PM 2,474 test-websocket.js
32 File(s) 415,566 bytes
2 Dir(s) 146,528,526,336 bytes free
Any further detailed advise would be appreciated!
I am using Cockpit 283-1 and have (had) the same problem. But I found a quick and dirty fix: I just copied
/usr/share/cockpit/base1/fonts/from an old Cockpit-Installation (239-1) to the new one and after a page-reload the icons are properly displayed again.# ls -l /usr/share/cockpit/base1/fonts/ total 150 -rw-r--r-- 1 root root 98024 Mar 3 2021 fontawesome.woff -rw-r--r-- 1 root root 23424 Mar 3 2021 glyphicons.woff -rw-r--r-- 1 root root 38952 Mar 3 2021 patternfly.woff
I wasn't able to locate the cockpit version with the fonts, had to download them and put them in this directory and it works 👍
leaving the links here:
https://github.com/h5p/font-awesome/blob/master/fontawesome-webfont.woff https://github.com/twbs/bootstrap-sass/blob/master/assets/fonts/bootstrap/glyphicons-halflings-regular.woff https://github.com/patternfly/patternfly-sass/blob/master/assets/fonts/patternfly/PatternFlyIcons-webfont.woff
I downloaded the fonts and renamed them according to above and it still doesn't work. I restarted cockpit, is there anything else I need to do?
Seeing stuff like this in the dev console:
@tcouey nothing else, make sure that the fonts are in here:
ls -l /usr/share/cockpit/base1/fonts/
I only tried in ubuntu 22.10 oh also you might need to clear cache in the browser?
grabbed the fonts, working on debian 12, cockpit 299 correctly.
only thing, on my system some other fonts missing, cant find where they should be displayed. but idk.
nice poolsize @tcouey did u created fonts directory? on debian there isnt any fonts directory in base1 folder. had to create it, copied & renamed it. no problem.
@h1ght : Here's what I'm trying:
[root@astra fonts]# pwd
/usr/share/cockpit/base1/fonts
[root@astra fonts]# wget https://github.com/h5p/font-awesome/blob/master/fontawesome-webfont.woff
[root@astra fonts]# mv fontawesome-webfont.woff fontawesome.woff
[root@astra fonts]# wget https://github.com/twbs/bootstrap-sass/blob/master/assets/fonts/bootstrap/glyphicons-halflings-regular.woff
[root@astra fonts]# mv glyphicons-halflings-regular.woff glyphicons.woff
[root@astra fonts]# wget https://github.com/patternfly/patternfly-sass/blob/master/assets/fonts/patternfly/PatternFlyIcons-webfont.woff
[root@astra fonts]# mv PatternFlyIcons-webfont.woff patternfly.woff
[root@astra fonts]# ls -l
total 32
-rw-r--r--. 1 root root 4610 Aug 25 15:11 fontawesome.woff
-rw-r--r--. 1 root root 6547 Aug 25 15:12 glyphicons.woff
-rw-r--r--. 1 root root 13735 Aug 25 15:12 patternfly.woff
[root@astra fonts]# systemctl restart cockpit.service
This isn't doing anything. Did I miss something?
grabbed the fonts, working on debian 12, cockpit 299 correctly. only thing, on my system some other fonts missing, cant find where they should be displayed. but idk.
nice poolsize @tcouey did u created fonts directory? on debian there isnt any fonts directory in base1 folder. had to create it, copied & renamed it. no problem.
I am on Ubuntu 22.04 but there was no fonts directory for me either so I created it.
Moved the fonts into that directory making sure they are named correctly and the permissions fit.
Did the same for the apparently missing OpenSans-Semibold-webfont.woff in the directory /usr/share/cockpit/static/fonts:
https://github.com/braintree/braintree_slim_example/blob/main/static/fonts/open-sans/OpenSans-Semibold-webfont.woff
Also copied the RedHat* fonts from /usr/share/cockpit/static/fonts into the directories:
/usr/share/cockpit/zfs/assets/fonts/RedHatDisplay
/usr/share/cockpit/zfs/assets/fonts/RedHatText
Renamed them from *.woff2 to *.woff
@MSommer95 Thanks for the info. Tried that too, still no-go. I suspect this is a RHEL 9 problem. I'll keep looking into it though.
Okay, I got it figured out. After getting everything in the right places with the right names I was seeing errors in the console about the downloadable fonts being "rejected by sanitizer." So here's how I fixed that: I re-downloaded the fonts with a browser. Lesson here: DO NOT USE wget to download fonts. The "[text/plain]" tag should've clued me in sooner, but eh... live and learn.
There's probably a way to get wget to save them as binary files, but I didn't want to waste any more time on this. Thanks for everyone's help.
Just copy and paste this in your terminal as workaround:
sudo mkdir -p /usr/share/cockpit/base1/fonts/
sudo wget -O /usr/share/cockpit/base1/fonts/fontawesome.woff https://github.com/h5p/font-awesome/raw/master/fontawesome-webfont.woff
sudo wget -O /usr/share/cockpit/base1/fonts/glyphicons.woff https://github.com/twbs/bootstrap-sass/raw/master/assets/fonts/bootstrap/glyphicons-halflings-regular.woff
sudo wget -O /usr/share/cockpit/base1/fonts/patternfly.woff https://github.com/patternfly/patternfly-sass/raw/master/assets/fonts/patternfly/PatternFlyIcons-webfont.woff
sudo wget -P /usr/share/cockpit/static/fonts https://github.com/braintree/braintree_slim_example/raw/main/static/fonts/open-sans/OpenSans-Semibold-webfont.woff
sudo mkdir -p /usr/share/cockpit/zfs/assets/fonts/RedHatDisplay/
sudo cp -v /usr/share/cockpit/static/fonts/*Display*.woff2 /usr/share/cockpit/zfs/assets/fonts/RedHatDisplay/
for f in /usr/share/cockpit/zfs/assets/fonts/RedHatDisplay/*; do sudo mv -v -- "$f" "${f%.woff2}.woff"; done
sudo mkdir -p /usr/share/cockpit/zfs/assets/fonts/RedHatText/
sudo cp -v /usr/share/cockpit/static/fonts/*Text*.woff2 /usr/share/cockpit/zfs/assets/fonts/RedHatText/
for f in /usr/share/cockpit/zfs/assets/fonts/RedHatText/*; do sudo mv -v -- "$f" "${f%.woff2}.woff"; done
sudo systemctl restart cockpit
Workaround worked great! But had to create directory fonts in /usr/share/cockpit/base1/ first, as it wasn't there on my system.
add this to the beginning of @faustinoaq code
sudo mkdir -p /usr/share/cockpit/base1/fonts/
Workaround worked great! But had to create directory fonts in /usr/share/cockpit/base1/ first, as it wasn't there on my system. add this to the beginning of @faustinoaq code
sudo mkdir -p /usr/share/cockpit/base1/fonts/
Done! @PipeL1n3 Thank you, I edited my comment above ✨
I needed the commands above in a script and also made instructions on how to use it for my personal docuWiki. This thread needs a bump and the work is already done so here you go.
Create the script
sudo nano fixCockpitfonts.sh
File Contents
#!/bin/bash
mkdir -p /usr/share/cockpit/base1/fonts/
wget -O /usr/share/cockpit/base1/fonts/fontawesome.woff https://github.com/h5p/font-awesome/raw/master/fontawesome-webfont.woff
wget -O /usr/share/cockpit/base1/fonts/glyphicons.woff https://github.com/twbs/bootstrap-sass/raw/master/assets/fonts/bootstrap/glyphicons-halflings-regular.woff
wget -O /usr/share/cockpit/base1/fonts/patternfly.woff https://github.com/patternfly/patternfly-sass/raw/master/assets/fonts/patternfly/PatternFlyIcons-webfont.woff
wget -P /usr/share/cockpit/static/fonts https://github.com/braintree/braintree_slim_example/raw/main/static/fonts/open-sans/OpenSans-Semibold-webfont.woff
mkdir -p /usr/share/cockpit/zfs/assets/fonts/RedHatDisplay/
cp -v /usr/share/cockpit/static/fonts/*Display*.woff2 /usr/share/cockpit/zfs/assets/fonts/RedHatDisplay/
for f in /usr/share/cockpit/zfs/assets/fonts/RedHatDisplay/*; do sudo mv -v -- "$f" "${f%.woff2}.woff"; done
mkdir -p /usr/share/cockpit/zfs/assets/fonts/RedHatText/
cp -v /usr/share/cockpit/static/fonts/*Text*.woff2 /usr/share/cockpit/zfs/assets/fonts/RedHatText/
for f in /usr/share/cockpit/zfs/assets/fonts/RedHatText/*; do sudo mv -v -- "$f" "${f%.woff2}.woff"; done
systemctl restart cockpit
Make the script excutiable
sudo chmod 744 ./fixCockpitfonts.sh
Run the script
sudo ./fixCockpitfonts.sh
Clean up by removing the script.
sudo rm ./fixCockpitfonts.sh
45drives knows about the issue and is ignoring it. They have a script in their scripts repo that is super close to what we are doing.
https://github.com/45Drives/scripts/blob/main/cockpit_font_fix/fix-cockpit.sh