1669289 - [Bug] SVG image incorrectly renders text as a solid black shape

Status: NEW

(Core :: Graphics, defect, P3)

Description

[Kevin Brosnan [Ex-Mozilla]]

From github: https://github.com/mozilla-mobile/fenix/issues/15691.

Steps to reproduce

1. Navigate to https://raphlinus.github.io/ui/druid/2019/11/22/reactive-ui.html.
2. Scroll down to the image under the section "Tree transformations".
3. Notice the image renders wrong.

Expected behavior

The image should render fine, as it does when opened on its own tab https://raphlinus.github.io/assets/reactive-ui-trees.svg.

Actual behavior

It shows a a solid black shape where the text should be:

Device information

• Android device: Redmi Note 6 Pro (custom ROM)
• Fenix version: Nightly 201004 17:02 (Build #2015767755)
  AC: 62.0.20201002143132, d96b23188
  GV: 83.0a1-20201001094020
  AS: 63.0.0

Comment 1

[Kevin Brosnan [Ex-Mozilla]]

Attachment: 95081023-40f05080-0719-11eb-899c-b978f55edbb7[1].png

Comment 2

[Kevin Brosnan [Ex-Mozilla]]

I was able to reproduce on Nightly with a Pixel 3.

Comment 3

[Jonathan Kew [:jfkthame]]

That "black shape" looks to me like the bottom left corner of an enormous "A". Note that the right-hand part of the image is a <foreignobject> that contains an HTML block, whose last line of text reads "Pop A". My guess: for some reason we're getting the scaling of this block drastically wrong, and trying to render it with a huge font size. As a result, the lines all wrap at any available spaces, leaving the final "A" alone on the last line; and given the huge size of the text, that's the only bit that is visible within the viewbox.

I don't know why the scaling would be so crazy, though.

Comment 4

[Jonathan Kew [:jfkthame]]

Interestingly, this doesn't seem to reproduce for me in a local GeckoView build on an emulator; the SVG looks fine whether rendered within the blog post or as a standalone image.

Comment 5

[Kris Taeleman (:ktaeleman)]

@jnicol: Any idea what could be going wrong here?

Comment 6

[Jamie Nicol [:jnicol] out of office until 6th Jan]

I can reproduce on both a Pixel 2 and Samsung S9 in Fenix nightly. But I cannot reproduce on either device in geckoview example. (I tried the exact build used by Fenix nightly, as well as the latest build).

It happens in both webrender and non-webrender. I'm not sure how to go about debugging this without being able to reproduce in GVE.