Firefox and Web Fonts

[tuxaholic]

Hello,

I noticed that Firefox recently started displaying PDFs incorrectly. I’m not sure what I did to cause this but when I visit this public example PDF. After searching I found that it is related to the “Allow pages to choose their own fonts, instead of your selections above” check box in the “Advanced” dialogue of the “Fonts” settings.

This box is ticked on my system and instead of showing PDFs properly, most of the text is missing… Unchecking the box fixes it.

If I download the PDF and use Gnome’s document viewer, it works fine.

Does anyone know why Firefox does this on my system? I haven’t played with any settings in Firefox in a while, so I’m pretty sure this used to work.

I’m assuming that this has to do with Web Fonts and may cause issues with web sites that use them.

Here are the fonts installed on my system:

$ yay -Qq | egrep "font|ttf"
egrep: warning: egrep is obsolescent; using grep -E
adobe-source-code-pro-fonts
adobe-source-han-sans-cn-fonts
adobe-source-han-sans-jp-fonts
adobe-source-han-sans-kr-fonts
cantarell-fonts
fontconfig
fontforge
gsfonts
libfontenc
libxfont2
noto-fonts
opendesktop-fonts
ttf-bitstream-vera
ttf-dejavu
ttf-liberation
ttf-opensans
xorg-fonts-encodings

[BluishHumility]

Try using the using the font tab in Firefox’s Page Inspector to see what fonts are being loaded. You may be missing a font, or you may have a conflicting font which must be removed.

[tuxaholic]

Thank you @BluishHumility for the suggestion. I have managed to collect interesting information:

1. The problem seems to be only with PDF viewer. Using the font inspector I was able to verify that various pages I tried would download and use various fonts not installed on my system and those looked the same in other browsers (Chrome/Edge) as well as when trying the same pages in Windows. So in general this works well

2. I have screenshots of the linked document on page 13 showing how some monospace and even some regular text is displayed fine, but most of it is missing. In the <span> tags I identified I do not see something suspicious in the inspector for the part of the text that is visible and the part that is not visible.

I am attaching screenshots for my settings and the rendering problem from point (2).

Do you thing this could be a Firefox bug? Chromium shows the same document with no issues on the same EndeavourOS system. I tried Flatpak installation of Firefox and it seems to have the same issue…

Here is the invisible text with the span specifying the font as sans-serif:

Now here is some visible text that specified the exact same, but does not seem to have the issue:

I’m no web developer, but don’t see anything glaringly wrong.

[BluishHumility]

I tried to reproduce this, but in my case that same website shows up just fine. I normally use Librewolf, but I installed Firefox to test and still the page does not have blank areas like yours. I confirmed the “Allow pages to choose their own fonts” box is checked.

Here is my list of fonts if you would like to compare, although I am not convinced the issue is related to fonts that are installed or not installed:

pacman -Qq | grep -E "font|ttf"
adobe-source-code-pro-fonts
cantarell-fonts
fontconfig
gnu-free-fonts
gsfonts
libfontenc
libxfont2
otf-font-awesome
terminus-font
ttf-dejavu-nerd
ttf-liberation
xorg-fonts-encodings

Have you tried disabling browser extensions?

[tuxaholic]

Thanks for confirming this PDF shows correctly for you. This is clearly something broken on my system.

I used firefox -ProfileManager to run with a brand new profile, no extensions, all defaults. The problem persists…

I was missing the following from the package list you provided, but installing them did not fix things…

yay -Sy gnu-free-fonts otf-font-awesome terminus-font ttf-dejavu-nerd

I wonder what else to check… If I could bother you to list your /etc/fonts/conf.d? Maybe something that I have different there?

$ ls /etc/fonts/conf.d/
10-hinting-slight.conf                     40-nonlatin.conf            58-dejavu-lgc-sans.conf         69-urw-fallback-specifics.conf
10-scale-bitmap-fonts.conf                 44-source-han-sans-cn.conf  58-dejavu-lgc-sans-mono.conf    69-urw-gothic.conf
10-sub-pixel-rgb.conf                      44-source-han-sans-jp.conf  58-dejavu-lgc-serif.conf        69-urw-nimbus-mono-ps.conf
10-yes-antialias.conf                      44-source-han-sans-kr.conf  60-generic.conf                 69-urw-nimbus-roman.conf
11-lcdfilter-default.conf                  45-generic.conf             60-latin.conf                   69-urw-nimbus-sans.conf
20-unhint-small-dejavu-lgc-sans.conf       45-latin.conf               65-fonts-persian.conf           69-urw-p052.conf
20-unhint-small-dejavu-lgc-sans-mono.conf  48-spacing.conf             65-nonlatin.conf                69-urw-standard-symbols-ps.conf
20-unhint-small-dejavu-lgc-serif.conf      49-sansserif.conf           69-unifont.conf                 69-urw-z003.conf
20-unhint-small-dejavu-sans.conf           50-user.conf                69-urw-bookman.conf             75-yes-terminus.conf
20-unhint-small-dejavu-sans-mono.conf      51-local.conf               69-urw-c059.conf                80-delicious.conf
20-unhint-small-dejavu-serif.conf          57-dejavu-sans.conf         69-urw-d050000l.conf            90-synthetic.conf
20-unhint-small-vera.conf                  57-dejavu-sans-mono.conf    69-urw-fallback-backwards.conf  README
30-metric-aliases.conf                     57-dejavu-serif.conf        69-urw-fallback-generics.conf

[vazicebon]

Hello,

@tuxaholic

Thanks for confirming this PDF shows correctly for you. This is clearly something broken on my system.

Same here, shows fine, box ticked or not, I suppose the fonts are embedded in the document (edit: and I guess most of them don’t use external fonts), because the inspector says no fonts are used.
It might not be the best solution, but you can replace the internal pdf viewer with an external one.

View PDF files in Firefox or choose another viewer | Firefox Help

[BluishHumility]

@tuxaholic

If I could bother you to list your /etc/fonts/conf.d?

No bother, here we go:

exa /etc/fonts/conf.d
10-hinting-slight.conf      45-generic.conf    65-fonts-persian.conf           69-urw-fallback-specifics.conf   75-yes-terminus.conf
10-scale-bitmap-fonts.conf  45-latin.conf      65-nonlatin.conf                69-urw-gothic.conf               80-delicious.conf
10-sub-pixel-rgb.conf       48-spacing.conf    69-unifont.conf                 69-urw-nimbus-mono-ps.conf       90-synthetic.conf
10-yes-antialias.conf       49-sansserif.conf  69-urw-bookman.conf             69-urw-nimbus-roman.conf         README
11-lcdfilter-default.conf   50-user.conf       69-urw-c059.conf                69-urw-nimbus-sans.conf          
20-unhint-small-vera.conf   51-local.conf      69-urw-d050000l.conf            69-urw-p052.conf                 
30-metric-aliases.conf      60-generic.conf    69-urw-fallback-backwards.conf  69-urw-standard-symbols-ps.conf  
40-nonlatin.conf            60-latin.conf      69-urw-fallback-generics.conf   69-urw-z003.conf                 

I seem to have a couple fewer in mine.

@tuxaholic

I used firefox -ProfileManager to run with a brand new profile, no extensions, all defaults. The problem persists…

Hmm, that really is an odd one. I figured an extension was to blame, but I guess it must be something else…

Try making a new user on your system, log in as them and see if the problem persists.

[tuxaholic]

I created a new user account and am getting the same beha

Clearly this is something in my installed packages / system configuration… I am so curious now to find out what it could be…

[tuxaholic]

I have finally got to the bottom of this. It is a hardware rendering problem: turning off H/W acceleration in “Settings / General / Performance” fixes my rendering.

I had recently switched to using the VirtIO-GL driver for my VM about a month ago, but it seems that it is still buggy.

I’m now back to VirtIO-GPU and re-enabled hardware acceleration, as that works fine with this driver.

Thank you for your help narrowing this down @BluishHumility.

[kwg]

Edit: We posted at the same time. I’m glad you’ve found a solution.

Like others have reported above, I have no problem viewing your sample PDF document in my Firefox browser.

What strikes me in your screenshots is how Firefox is rendering this text:

Boxplots displaying wage as a function of education

Rendering ends after the e in education, yet the entire word resides in the same HTML element:

<span style="left: 65.78%; top: 40.67%; font-size: calc(var(--scale-factor)*8.97px); font-family: monospace; transform: scaleX(0.868517);" role="presentation" dir="ltr">education</span>

So every letter of the word uses the same font. I conclude, therefore, that the problem is not due to the fonts you have installed on your system, but perhaps rather with a malfunction of the PDF rendering engine, pdf.js, used by Firefox.

A similar issue to yours was reported (by a Windows user) last month, but a solution has not yet been offered:

Windows 10: PDF is not rendered correctly

Are you using the standard installation of firefox from the Arch repos?

$ pacman -Qi firefox
Name            : firefox
Version         : 117.0.1-1

If you uninstall firefox and then reinstall, does the problem persist?