Forum How do I...?

Prince Failing To Load Common JS Libraries

jhorowitz
I was having trouble loading JQuery and figured I was doing something wrong but then I tried it on the site and I got the same error. Do I have a bad binary or something?


$ prince http://www.princexml.com/samples/catalog/PrinceFurniture.html --javascript -o ~/desktop/prince-out.pdf
prince: https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js:18: error: TypeError: value is not an object
mikeday
Prince does not support every DOM property, so some jQuery methods will not work, particularly those that require dynamic layout, eg. checking the width of an element and then changing its contents to trigger reflow.
jhorowitz
So that error will be thrown any time that jquery is loaded but it doesn't mean that it's not working?
jhorowitz
One strange thing I've noticed:

Works:
document.getElementById("abc").innerHTML = "New text!";

Does not work:
$("#abc").html("New text!");

Is JQuery simply not supported? Or are only certain versions supported?
mikeday
Actually this document works fine for me in Prince 10:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script>
$("#abc").html("New text!");
</script>
<body>
<p id="abc"></p>
</body>
jhorowitz
I don't get any errors with that version of JQuery either. Looks like I only get the errors with version 1.12.1 and above. Is there any documentation on supported library versions?
mikeday
It appears that jQuery 1.12.1 is failing because it calls window.setTimeout() with only one argument and Prince expects an explicit second argument for the delay period. We can fix this in the next release of Prince. Unfortunately jQuery is a moving target which we have to chase to keep up! :)
jhorowitz
Yeah, no worries on that. Most people don't need to be super up to date on libraries so it would probably make 99% of people happy if you kept a "Supported" page with the most common libraries versions that you've tested.

bower_components is there to resolve situations like this pain free.

Thanks for the great support!
mikeday
This issue with window.setTimeout has been fixed in the latest build of Prince.
larjo
I tested the code above with prince 11 and jquery 1.12.4 and it works fine.

It fails however for jquery 3.1.1. The code below fails with this error:
prince: https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.js:4018: error: TypeError: null value is not an object

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.js"></script>
<script>
$("#abc").html("New text!");
</script>
<body>
<p id="abc"></p>
</body>

hallvord
Hi, this is caused by a small bug in Prince's NodeList support, it returns null instead of undefined when you ask for a non-existing index in the list, and this confuses jQuery.

Thanks a lot for bringing this up. It was a new problem to me, but now I've boiled it down to a test and I guess the Prince developers can sort this out easily :)
https://github.com/yeslogic/miscellaneous-testcases/blob/master/scripting/nodelist-nonexisting-index-001.htm

Note that your test page above will fail in some web browsers because the script looking up the "abc" node is before the "abc" node itself in the tree. This is not a problem for Prince because the order of parsing and script execution is different (and to some extent less complex) than the hairy and legacy-compatible behaviour of web browsers. However, I think it's better to fix it so that it's technically correct and easier to compare across engines :)

Announcement: repos for tests/utils

larjo
Here are some more things I found out when trying to create html elements. They all fail with:
jquery-3.1.1.js:4018: error: TypeError: null value is not an object

        /* Works in jQuery 3.1.1 */
        var x = $("<div>"); x[0].innerHTML = "hi";
        var x = $("<div>hi</div>");
 
        /* Fails in jQuery 3.1.1 but works in jQuery 1.12.0 (and likely 1.12.4)
        var x = $("<div>").html("hi");
        var x = $("<div>").text("hi");
        var x = $("<div>", { class: "bar", text: "hi" })
hallvord
It's very likely that all errors reported for line 4018 have the same cause. If you see any other line number appear in an error message please let me know, and I'll investigate :)

Announcement: repos for tests/utils

mikeday
We have released a new latest build which may hopefully fix this jQuery problem. :)
hallvord
Works fine for me! @larjo, what about you? Does the new build solve your problems?

Announcement: repos for tests/utils

larjo
It all works perfectly now. Thanks mikeday and hallvord!