Forum How do I...?

Having issues with highlight.js

elrond25
I'm working on conversion from XML to HTML and then from HTMLM to PDF using Prince. I have multiple code blocks using highlight.js and when I try to run it I get an error.

The command I'm running is: prince -s css/paged-media.css --javascript book.html -o test-book.pdf

and the error: prince: js/highlight.pack.js:1: error: TypeError: value is not an object

The code is highlighted in the HTML before I convert it using Prince

Does the alpha version fix this issue?
mikeday
It might. Which version of highlight.js are you using?
elrond25
8.4, just downloaded as a custom package from the website.
elrond25
I loaded the uncompressed version of highlight.js from Github and find the following line is the error:

var blocks = document.querySelectorAll('pre code');


mikeday
The latest alpha version of Prince supports querySelectorAll.
elrond25
Do I need a special license to download the alpha version? I'm running the evaluation version of 9.0R5
mikeday
You can just download it here: Prince alpha. The same licensing applies. In the next month or so we hope to release these builds officially as Prince 10.
elrond25
Downloaded the alpha build and I'm getting errors elsewhere on the script.

The error is now: prince: lib/highlight.pack.js:475: error: TypeError: value is not an object

Back to the drawing board
mikeday
Any luck with this? We can take a look at it if you like, do you have an un-minified sample document?
elrond25
Mike,

I'm having a different set of issues now.

Running it in verbose mode I get the following:

Command: prince --verbose --javascript docs.html -o docs.pdf
prince: loading document: /usr/local/lib/prince/license/license.dat
prince: /usr/local/lib/prince/license/license.dat: warning: inapplicable license
prince: Loading document...
prince: loading HTML5 input: docs.html
prince: loading document: docs.html
prince: Running scripts...
prince: loading script: https://use.typekit.net/qcp8nid.js
prince: loading script: lib/highlight.pack.js
prince: lib/highlight.pack.js:1: error: TypeError: value is not an object
prince: warning: setTimeout called too late
prince: warning: setTimeout called too late
prince: warning: setTimeout called too late
prince: warning: setTimeout called too late
prince: warning: setTimeout called too late
prince: warning: setTimeout called too late
prince: Applying style sheets...
prince: loading style sheet: css/pm-style.css
prince: loading style sheet: http://fonts.googleapis.com/css?family=Roboto:100italic,100,400italic,700italic,300,700,300italic,400
prince: loading style sheet: http://fonts.googleapis.com/css?family=Roboto+Slab:400,700
prince: loading style sheet: http://fonts.googleapis.com/css?family=Source+Code+Pro:300,400
prince: loading style sheet: css/paged-media.css
prince: loading style sheet: css/styles/railscasts.css
prince: loading style sheet: http://use.typekit.net/c/1a3379/1w;adelle,7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191,XJr:R:i1,XKB:R:i4,XKG:R:i7,XJq:R:n1,XK9:R:n4,XKF:R:n7/k?3bb2a6e53c9684ffdc9a9afe195b2a6290e57de54ffd90397ef00da346ed1b950711aaa14fc614d66c46a330311a1f0b54594891ae095fe5de8f0ac69397ba52c5236564486d8f3ef3199f8a76daecb17c7f38
prince: http://use.typekit.net/c/1a3379/1w;adelle,7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191,XJr:R:i1,XKB:R:i4,XKG:R:i7,XJq:R:n1,XK9:R:n4,XKF:R:n7/k?3bb2a6e53c9684ffdc9a9afe195b2a6290e57de54ffd90397ef00da346ed1b950711aaa14fc614d66c46a330311a1f0b54594891ae095fe5de8f0ac69397ba52c5236564486d8f3ef3199f8a76daecb17c7f38: warning: The requested URL returned error: 403 Forbidden
prince: Preparing document...
prince: loading image: images/visual-editing-mode-small.png
prince: loading image: images/pdf-bookmarks.png
prince: Converting document...
prince: used font: Arial, Regular
prince: used font: Helvetica Neue, Thin
prince: loading hyphenation patterns: /usr/local/lib/prince/style/../hyph/hyph-en-us.pat
prince: used font: Helvetica Neue, Thin Italic
prince: used font: Times New Roman, Regular
prince: used font: Helvetica Neue, Light Italic
prince: used font: Helvetica Neue, Bold
prince: loading font: http://fonts.gstatic.com/s/sourcecodepro/v6/leqv3v-yTsJNC7nFznSMqcw1o1eFRj7wYC6JbISqOjY.ttf
prince: used font: Source Code Pro Light, Regular
prince: used font: LiSong Pro, Light
prince: warning: no glyphs for character U+26A0, fallback to '?'
prince: warning: no glyphs for character U+E001, fallback to '?'
prince: warning: no glyphs for character U+E003, fallback to '?'
prince: warning: no glyphs for character U+E005, fallback to '?'
prince: loading image: images/pdf-bookmarks.png
prince: loading image: images/visual-editing-mode-small.png
prince: Finished: success

I've attached the stylesheets I'm using to create the PDF
  1. paged-media.css6.8 kB
  2. pm-style.css4.8 kB
    PM styles css
mikeday
There is the issue with highlight.js, and it seems TypeKit is denying the request for fonts, perhaps because they are bound to a particular domain? Or it could be checking the user-agent, I'm not sure exactly how TypeKit enforces font usage.
elrond25
I'm less concerned with TypeKit as I am with not being able to use highlight.js

Do you have any idea why highlight.js is not working? I've tried both version 9 and the alpha and they both report the same error
mikeday
It seems that highlight.js is using the Object.keys method, which we have not supported yet. But it seems not too difficult to support, in fact you can even implement it in JavaScript using a polyfill demonstrated here in the Mozilla documentation.

We will try and support this method soon.
elrond25
Adding the polyfill from the Mozilla website to the document fixed the issue.
mikeday
We have now released Prince 10, which includes support for the Object.keys method. Thanks for letting us know about this issue. :)