Jspdf: Error in IE when user custom font

Created on 23 Feb 2019  ·  24Comments  ·  Source: MrRio/jsPDF

ERROR: jsPDF PubSub Error Object doesn't support property or method 'toString' TypeError: Object doesn't support property or method 'toString'.

I have my code
const pdf = new jsPDF('l', 'mm', 'a3');
let base64Str = 'AAEAAAANAIAAAwBQRkZUTXas8jIADxLYAAAAHEdERUYAKR.....';
pdf.addFileToVFS('NotoSansCJKjp-Regular.ttf', base64Str);
pdf.addFont('NotoSansCJKjp-Regular.ttf', 'NotoSansCJKjp', 'normal');
pdf.setFont('NotoSansCJKjp');
pdf.setFontSize(12);
pdf.text('取引報告書及び仮想通貨管理明細簿兼残高報告書', 15, 20);
pdf.save('test.pdf');

base64Str i get in https://raw.githubusercontent.com/sphilee/jsPDF-CustomFonts-support/master/dist/default_vfs.js

please help me

Most helpful comment

I have identified the root cause of this issue. It is in the function toUnicodeCmap in jsPDF source code. It is looping in the codes array and one of the entries is key "objectOnly". In IE this object is undefined:

error

The script is then expecting each element to be an actual object:
unicode = ('0000' + **map[code].toString(16)**).slice(-4);

Method .toString(16) will cause that error in IE: jsPDF PubSub Error Object doesn't support property or method 'toString'. Because of this, the further execution is aborted and PDF definition of fonts at the bottom of the file is not valid.

I have fixed the code like this:
if((map[code] != null) && (map[code] != undefined)) {
unicode = ('0000' + map[code].toString(16)).slice(-4);
code = ('0000' + (+code).toString(16)).slice(-4);
range.push("<" + code + "><" + unicode + ">");
}

It will simply check for NULL or UNDEFINED and not continue to the critical section. Now the generated PDF will is exactly the same as the one from Chrome. Before the fix, the file was approx 1KB smaller because of the missing section.

All 24 comments

I see it error on function pdf.save
detail is font.metadata.toUnicode in ie have _f,_i,_l,_s,_t. in other brower not have it (_f,_i,_l,_s,_t)
version 1.5.3 is error but version 1.4.1 is ok.
but i must used version 1.5.3 because i used pdf.autotable
How to fix it!
12345

I user it but it same error ERROR: jsPDF PubSub Error Object doesn't support property or method 'toString' TypeError: Object doesn't support property or method 'toString'.

image
I try used version 1.4.1 it ok. why that version 1.5.3 err? :(

please use jspdf.debug.js to give more information

comment number 2
I see it error on function pdf.save
detail is font.metadata.toUnicode in ie have _f,_i,_l,_s,_t. in other brower not have it (_f,_i,_l,_s,_t)
version 1.5.3 is error but version 1.4.1 is ok.
but i must used version 1.5.3 because i used pdf.autotable
I had sent img

Check this topic:
https://github.com/MrRio/jsPDF/issues/2259
Maybe it will help you

thanks for support.
May be I will used version 1.4.1 for this isue.

If you would supply your code, I could test it locally and provide a solution.

I have identified the root cause of this issue. It is in the function toUnicodeCmap in jsPDF source code. It is looping in the codes array and one of the entries is key "objectOnly". In IE this object is undefined:

error

The script is then expecting each element to be an actual object:
unicode = ('0000' + **map[code].toString(16)**).slice(-4);

Method .toString(16) will cause that error in IE: jsPDF PubSub Error Object doesn't support property or method 'toString'. Because of this, the further execution is aborted and PDF definition of fonts at the bottom of the file is not valid.

I have fixed the code like this:
if((map[code] != null) && (map[code] != undefined)) {
unicode = ('0000' + map[code].toString(16)).slice(-4);
code = ('0000' + (+code).toString(16)).slice(-4);
range.push("<" + code + "><" + unicode + ">");
}

It will simply check for NULL or UNDEFINED and not continue to the critical section. Now the generated PDF will is exactly the same as the one from Chrome. Before the fix, the file was approx 1KB smaller because of the missing section.

Can you create a Pullrequest, please?

Expanding on @plodik's comment:

Checking for null and undefined is not enough, some objects apparently don't have the toString method on IE11. I had to add && typeof map[code].toString === "function" to the check in order for it to work properly on IE11.

2318 Here's a PR

Merged PR

I'm still seeing this issue when installing using npm install git://github.com/MrRio/jsPDF.git#master. Has the fix been merged into the distribution build?

In case anyone else comes here, although the fix is applied to master, note that the dist files have not been re-built.

I've forked this project, added the fix to 1.5.3 release (the latest master branch was not stable for me), and updated the dist files. You can use this via:

npm install https://github.com/jdmwood2/jsPDF.git#138a44246e2cf51bee38a66f7d955ee82829b3d5

Hi @Uzlopak , I see this issue still exist in 1.5.3 the below code fixes the issue. Can you please commit and release a new version?
if (Number.isInteger(parseInt(code))) { unicode = ('0000' + map[code].toString(16)).slice(-4); code = ('0000' + (+code).toString(16)).slice(-4); range.push("<" + code + "><" + unicode + ">"); }

I'm still having issues with IE11...I posted about it here: https://stackoverflow.com/questions/62920928/jspdf-issues-with-producing-pdf-and-using-custom-fonts-in-ie11

@Sravan-Nayini Would that code help resolve the problem I'm having? If so, where might I add it? I'm currently using the hosted library via the CDN link.

Could you test it with the files in PR #2804 (you need to run npm run build first)? It should be fixed there. If not, we should fix it.

@HackbrettXXX I'm kind of a noob when it comes to GitHub and things. I haven't been using npm to do any of this work...just an HTML package. Can you please point me in the right direction to get the files from the pull request you linked and use them in my project? Sorry if this is not a good question.

Ok, lets make it easy. I have a prebuilt version on my fork. You can include these script tags in your HTML file:

<script src="https://raw.githubusercontent.com/HackbrettXXX/jsPDF/prebuilt/dist/polyfills.umd.js"></script>
<script src="https://raw.githubusercontent.com/HackbrettXXX/jsPDF/prebuilt/dist/jspdf.umd.js"></script>

Then run your test case. Note that the jsPDF constructor is now under window.jspdf.jsPDF.

@HackbrettXXX Thank you for trying to help me here. I included those scripts. When I used only those scripts, I was unable to generate the PDF at all. I used "var doc = new window.jspdf.jsPDF({..." like you suggested, but still no luck. The console error is "Cannot read property 'jsPDF' of undefined."

I also tried using your scripts in addition to the main script, but still no luck.

Thanks again for taking the time to help me with this!

Ah sorry, forgot that scripts could not be loaded directly from GitHub. Instead, just download the two files and include them in your script tags.

@HackbrettXXX Thanks! I downloaded the files and included them in my index file. It let me generate the PDF on Chrome (but the custom fonts didn't work), and I got the "Object doesn't support this action" error in IE11 (no PDF generated).

Ah, yes the font-converter is not yet up-to-date. I quickly updated it: https://raw.githubusercontent.com/HackbrettXXX/jsPDF/modernization/fontconverter/fontconverter.html

Generate your font file again and make sure you choose "UMD" as module format.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

palmoni picture palmoni  ·  4Comments

mellisa0109 picture mellisa0109  ·  3Comments

andmaltes picture andmaltes  ·  4Comments

allenksun picture allenksun  ·  3Comments

BarathArivazhagan picture BarathArivazhagan  ·  4Comments