New issue
Advanced search Search tips

Issue 863364 link

Starred by 1 user

Issue metadata

Status: WontFix
Owner: ----
Closed: Jul 13
Components:
EstimatedDays: ----
NextAction: ----
OS: Windows
Pri: 2
Type: Compat



Sign in to add a comment

SVG Rendering: In handwritten font connecting line, which connects letters 'H', 'O', 'T' in the word 'Screenshot' is not rendering.

Reported by gold...@gmail.com, Jul 13

Issue description

UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36

Example URL:

Steps to reproduce the problem:
1. Visit a site with specific SVG - check attached file number 1
2. 
3. 

What is the expected behavior?
The connecting line in handwritten font Pacifico should render.

What went wrong?
The connecting line, which connects letters 'H', 'O', 'T' together in the handwritten font Pacifico didn't render due to drop shadow in specific word: 'Screenshot'.

Does it occur on multiple sites: N/A

Is it a problem with a plugin? No 

Did this work before? N/A 

Does this work in other browsers? Yes

Chrome version: 67.0.3396.99  Channel: stable
OS Version: 10.0
Flash Version: 

I have tried rendering this SVG in other browsers such as: Internet Explorer, Edge, Firefox, Opera and the connecting line rendered in almost all browsers expect Opera. 
You can see Firefox and Google Chrome SVG rendering comparation in attached file number 2.

I have generated this SVG using Adobe Illustrator.
 
bug.svg
18.0 KB Download
browser_comparation.png
135 KB View Download
Whoops, a typo: I meant 'except Opera'.
Components: Blink>SVG
I don't have the "Pacifico" font available to do any deeper checking with, but I guess that these "connections" are (discretionary) ligatures?

If that's the case then I think that the Blink rendering is correct, because the spec says:

  "Ligature formation should not be enabled when characters are in different text chunks."

  (https://svgwg.org/svg2-draft/text.html#FontsGlyphs)

and the 'o' (and 't') are wrapped in <tspan>s which have 'x' specified - and thus form (new) text chunks.

You can try to edit the file to remove the <tspan>s around the 'o' and the 't' to see if that fixes the issue. (I suspect that those 'x' adjustments aren't actually needed/have little visual impact.)

I.e change:

Screensh<tspan class="cls-4" x="238.52295" y="0">o</tspan><tspan x="268.98584" y="0">t</tspan>

into just:

Screenshot
Oh I see... Thank you, it worked!
Status: WontFix (was: Unconfirmed)
Thanks for verifying. Closing as this is working as intended.

Sign in to add a comment