Unicode fonts (utf-8) in Safari (iOS and OSX) error

[omeriko]

Hi guys

We are using the
jsPDF.text(text, x, y, optionsopt, transform)
in order to insert text to the pdf document.
Since we need to support Hebrew language we used the following api calls to add unicode fonts:

jsPDF.addFileToVFS("MyFont.ttf", myFont);
jsPDF.addFont("MyFont.ttf", "MyFont", "normal");
jsPDF.setFont("MyFont");

I downloaded *.ttf file with Hebrew fonts and it all works well on all major browsers: Chrome, Firefox & Edge.
However to my regret on Safari browser whether on iPhone or Macbook it gives me gibberish text... :-(

What should i do?

[HackbrettXXX]

Please provide a complete repro, so we can reproduce the issue.

[omeriko]

Hi Lukas,

here is a complete repro:

this.pdf_document = new jsPDF( {orientation: 'portrait', unit: 'pt', format: 'a4', compress: true } );
this.pdf_document.addFileToVFS('Assistant-ExtraBold-normal.ttf', 'AAEAAAAQAQAABAAAR0RFRgioCG4AAIXs...');
this.pdf_document.addFont('Assistant-ExtraBold-normal.ttf', 'Assistant-ExtraBold', 'normal');

this.pdf_document.addFileToVFS('Assistant-Medium-normal.ttf', 'AAEAAAAQAQAABAAAR0RFRgioC...');
this.pdf_document.addFont('Assistant-Medium-normal.ttf', 'Assistant-Medium', 'normal');

const text_row = element.querySelector(".text-field-placeholder");     
const top_pt = 500; 
const left_pt = 500;
const text = text_row.querySelector(".inner").innerText;
this.pdf_document.setFontSize(15);
this.pdf_document.setR2L(true);
    
 switch(text_row.style.fontWeight) {
    case "bold":                        
        this.pdf_document.setFont("Assistant-ExtraBold");
        break;
    case "normal":                        
        this.pdf_document.setFont("Assistant-Medium");
        break;
}  
                 
this.pdf_document.text(text, left_pt, top_pt, { align: "left", baseline: "middle"}, 0);           

[omeriko]

Is this repro adequate?

[HackbrettXXX]

Looks good at first glance, thanks. I haven't found the time to look into this so far, sorry.

[omeriko]

Ok,
I've simplified it a bit so when you have the time to look into it, its going to be easy.
similar issue: #2711 (comment)

[HackbrettXXX]

Does it only look broken when opening the PDF in Safari or the MacOS file preview? Or is the PDF generated in Safari different than when generated with Chrome? We've had similar issues in the past. Please try opening a file generated in Safari in Adobe Reader or Chrome. Also: which jsPDF version are you using?

[omeriko]

I'm using jsPDF version 2.1.1

The PDF generated in Safari desktop or Safari mobile (iPhone) is different than Chrome on desktop or Android device, Firefox on desktop or on Android device & Edge on desktop - in a way that utf-8 hebrew characters are displayed as gibberish.

[HackbrettXXX]

Please attach two files: one that's generated in Safari and is broken, one that's generated in Chrome and is not broken.

[HackbrettXXX]

Please also try updating to 2.3.1

[github-actions]

This issue is stale because it has been open 90 days with no activity. It will be closed soon. Please comment/reopen if this issue is still relevant.