johnfactotum / foliate

Read e-books in style
https://johnfactotum.github.io/foliate/
GNU General Public License v3.0
6.42k stars 295 forks source link

Toggling Scroll Mode changes font weight unexpectedly #1404

Open guile-rc opened 1 month ago

guile-rc commented 1 month ago

Describe the bug When toggling Scroll Mode in Foliate, the font weight of the text changes unexpectedly.

To Reproduce Steps to reproduce the behavior:

  1. Open any book in Foliate.
  2. Toggle the Scroll Mode on and off.

Expected behavior The font weight should remain consistent across both modes (normal and scroll).

Screenshots Captura de tela de 2024-10-04 22-38-11 Captura de tela de 2024-10-04 22-38-26

Version:

Additional context The system font is configured without hinting and utilizes subpixel smoothing.

johnfactotum commented 1 month ago

The text does actually look bolded to me, rather than being some sort of rendering difference. I would say there's a media query in the book's stylesheet that changes the font weight. But that also seems unlikely.

Does it happen wit every book and every font? Does it happen in the online demo reader, https://johnfactotum.github.io/foliate-js/reader.html, in Firefox or Chrome?

guile-rc commented 1 month ago

In the app, it happens with every book, whether it’s from Amazon, Standard Ebooks or made by me. However, the issue doesn’t appear in the online demo reader.

johnfactotum commented 1 month ago

This is very peculiar. Does it happen if you use the online reader in Epiphany? And what font are you using? Have you tried using the inspector to see if there are extra styles applied in different modes?

guile-rc commented 1 month ago

The problem does occur in Epiphany. The font-weight property in the browser remains set to 400, however. I'm using Crimson Pro, but it happens with every font I've tested.

johnfactotum commented 1 month ago

Well, it must be a WebKitGTK bug, then.

Recently they replaced Cairo with Skia, which has resulted in some bugs related to font rendering. See https://blogs.igalia.com/carlosgc/2024/09/27/graphics-improvements-in-webkitgtk-and-wpewebkit-2-46/. If you're using WebKitGTK 2.46, that must be related to this.

I suppose you can try reporting this at https://bugs.webkit.org. Though it would be better if one can create a minimal example. It's probably either very wide multicolumn text (paginated mode) or very tall iframe (scrolled mode) that triggers the abnormal rendering. If it's the former, you would see bold text on most webpages. And it's probably something dependent on the hardware setup as well; at least I'm unable to reproduce this.

guile-rc commented 1 month ago

Made a bug report: https://bugs.webkit.org/show_bug.cgi?id=281824