Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Some accented characters are displayed incorrectly when using Google Fonts #1888

Open
2 tasks done
trollusk opened this issue Oct 12, 2024 · 3 comments
Open
2 tasks done

Comments

@trollusk
Copy link

trollusk commented Oct 12, 2024

accents.zip

Preflight Checklist

  • I agree to follow the Code of Conduct that this project adheres to.
  • I have searched the issue tracker for a feature request that matches the one I want to file, without success.

You must agree to search and the code of conduct. You must fill in this entire template. If you delete part/all or miss parts out your issue will be closed.

Describe the bug

The font of a text box can be changed to a custom font, for example one of the hundreds of available Google Fonts. If there is accented text in the preview on fonts.google.com when selecting a font, the accented character will be displayed correctly for some fonts, but missing ("?") for others.

However, even if a font is selected where the accented character appears correctly in the preview, in most cases the accented character will appear incorrectly in the draw.io app. It will appear as the correct character, but in what looks like a default Times New Roman font.

To Reproduce

Steps to reproduce the behavior:

  1. Create a text box, with text that contains a character with a macron such as ī, ā
  2. Select the text box, click on the Font dropdown box and choose "Custom".
  3. Click the question mark icon to the right of "Google Font". A page at fonts.google.com will appear where you can preview all the available Google Fonts.
  4. In the Preview Text box on that page, type in some text containing a character with macron.
  5. Scroll through the fonts. Find one that shows the accented character correctly.
  6. Go back to the font selection dialog in draw.io, select Google Font, and type in the name of the font (case sensitive). Click "Apply".
  7. Observe that (for many of the fonts, but not all) the accented character does not display correctly.

Expected behavior

Accented characters should have the same appearance in the text box, as they do in the font preview.

Screenshots

The Google Font selection page. The lowercase i with macron (ī) is displayed correctly in the "Annie Use Your Telescope" font, but shown as "?" in the other fonts.

image

Text box using the "Annie Use Your Telescope" font. The lowercase i with macron (ī) is shown in an incorrect font that does not match the rest of the text.

image

draw.io version (In the Help->About menu of the draw.io editor):

  • draw.io version 24.7.17

Desktop (please complete the following information):

  • OS: Windows 11
  • Browser: Microsoft Edge
@davidjgraph
Copy link
Contributor

Please attach the diagram file, zipped, to this issue.

@trollusk
Copy link
Author

Attached accents.zip.

@davidjgraph davidjgraph added wontfix blocked/need-repro Requires a complete test case that reproduces the problem and removed blocked/need-repro Requires a complete test case that reproduces the problem wontfix labels Oct 16, 2024
@davidjgraph
Copy link
Contributor

I can repeat, but this font isn't entirely reliable on Google Fonts site. The first time I set the value on https://fonts.google.com/specimen/Annie+Use+Your+Telescope?preview.text=M%C4%81ori I get:

Capture d’écran 2024-10-16 à 17 56 45

With a broken unicode character. If I refresh I get:

Capture d’écran 2024-10-16 à 17 56 57

So, even the google site doesn't always seem to get the timing correct. I would just go with a standard font as a workaround.

I can leave it open, but we don't really want to spend days chasing down a timing issue like this.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants