1891971 - viewer.joomag.com - Setting browser.display.use_document_fonts to 0 causes the interpage boundaries to render the text behind them

Status: RESOLVED INVALID

(Core :: Layout: Text and Fonts, defect)

Description

[Raul Bucata]

From github: https://github.com/webcompat/web-bugs/issues/135863.

<!-- @browser: Firefox 124.0 -->
<!-- @ua_header: Mozilla/5.0 (X11; Linux x86_64; rv:124.0) Gecko/20100101 Firefox/124.0 -->
<!-- @reported_with: unknown -->

1. Metadata

<table><tr>
<th>URL</th>
<td><a href="https://viewer.joomag.com/cyberspace-communications-specialist/0108549001648711834?short">https://viewer.joomag.com/cyberspace-communications-specialist/0108549001648711834?short</a></td>
</tr><tr>
<th>Browser/Version</th>
<td><a href="https://kojipkgs.fedoraproject.org//packages/firefox/124.0.2/2.fc40/x86_64/firefox-124.0.2-2.fc40.x86_64.rpm">https://kojipkgs.fedoraproject.org//packages/firefox/124.0.2/2.fc40/x86_64/firefox-124.0.2-2.fc40.x86_64.rpm</a></td>
</tr><tr>
<th>Operating System</th>
<td><a href="https://download.fedoraproject.org/pub/fedora/linux/releases/test/40_Beta/Spins/x86_64/iso/Fedora-KDE-Live-x86_64-40_Beta-1.10.iso">https://download.fedoraproject.org/pub/fedora/linux/releases/test/40_Beta/Spins/x86_64/iso/Fedora-KDE-Live-x86_64-40_Beta-1.10.iso</a></td>
</tr><tr>
<th>Tested Another Browser</th>
<td>Yes Chrome</td>
</tr></table>

1. What seems to be the trouble?

<blockQuote>

<table><tr>
<th>Problem type</th>
<td>Design is broken</td>
</tr><tr>
<th>Description</th>
<td>Items are overlapped
</tr></table>

</blockQuote>

• [ ] Desktop site instead of mobile site
• [ ] Mobile site is not usable
• [ ] Video doesn't play
• [x] Layout is messed up
• [x] Text is not visible
• [ ] Something else (Add details below)

1. Steps to Reproduce

2. Apply typographic configuration for the DE(/OS):

   kcmshell6 kcm_fonts
   

3. Install Firefox:

   sudo dnf install 'https://kojipkgs.fedoraproject.org//packages/firefox/124.0.2/2.fc40/x86_64/firefox-124.0.2-2.fc40.x86_64.rpm' # https://koji.fedoraproject.org/koji/buildinfo?buildID=2432055#:~:text=rpm%20(info)%20(download)-,x86_64,64.rpm%20(info)%20(download),-firefox-langpacks-124
   

4. Configure Firefox:

   firefox 'about:config'
   

5. Apply typographic configuration:

6. Apply browser.display.use_document_fonts as 0.

7. Visit the URI:

   firefox 'https://viewer.joomag.com/cyberspace-communications-specialist/0108549001648711834?short&'
   

8. Behaviour

9. Expected

   Firefox should wrap the text correctly.

10. Actual

    Using https://koji.fedoraproject.org/koji/buildinfo?buildID=2432055#:~:text=rpm%20(info)%20(download)-,x86_64,64.rpm%20(info)%20(download),-firefox-langpacks-124, setting browser.display.use_document_fonts to 0 via firefox about:config causes the interpage boundaries to render the text behind them. This does not occur on Chrome, I expect because (as https://superuser.com/revisions/1209191/3#:~:text=I'd%20like,by%20the%20website describes) this doesn't appear to be possible to enable on Chrome (without utilizing an extension).

11. Screenshots

12. Chrome

13. Firefox

From webcompat.com with ❤️

Change performed by the Move to Bugzilla add-on.

Comment 1

[`{third: "Beedell", first: "Roke"}`{.JSON5}]

https://bugzilla.mozilla.org/show_bug.cgi?id=1891971#c0

[e-mail], being the original reporter of https://github.com/webcompat/web-bugs/issues/135863#issue-2240796424, might I be able to gain modification rights for the issue? If not, please set https://wiki.mozilla.org/BMO/UserGuide/BugFields#rep_platform to Firefox 125 on Linux x86-64.

Comment 2

[Raul Bucata]

The issue was reported via the webcompat.com reporter. Since the issue is related to a changed pref, we have moved the issue. Please feel free to move the issue to the correct Product and Component.

Comment 3

[Jonathan Kew [:jfkthame]]

The page in question appears to be presenting its content as an SVG image, with the text having predetermined positions and line-breaks; there is no opportunity for the browser to rewrap the text or otherwise reflow content here.

Comment 4

[`{third: "Beedell", first: "Roke"}`{.JSON5}]

https://bugzilla.mozilla.org/show_bug.cgi?id=1891971#c3

[e-mail], should this be closed and then put to Joomla, then?

Comment 5

[`{third: "Beedell", first: "Roke"}`{.JSON5}]

Joomag, rather. Oops.

Comment 6

[Jonathan Kew [:jfkthame]]

I think so. Arguably their content is problematic for people requiring accessibility affordances (such as the ability to override the font used).

Closing as Invalid from the Firefox point of view; the browser can't reflow text that's presented as a picture.

(I suppose you could argue that user font prefs simply shouldn't be applied to text within an SVG image; that would avoid garbling the content by messing up the size of the text objects. But that wouldn't help someone who needs a way to improve the legibility, and depending on the kind of image, sometimes overriding the font might be OK -- e.g. for a few individual labels on a diagram, it might work well.)

Comment 7

[Jonathan Kew [:jfkthame]]

In https://bugzilla.mozilla.org/show_bug.cgi?id=568794#c0, the reporter suggested that use-document-fonts should be configurable per-site, which would provide some added control around this issue.