Log in / Register

Forum › Bugs

Misformatted JavaScript generated content in XHTML mode

dpt
Hi,

I've built a Table of Contents generator in JavaScript for the documentation we're producing here but have encountered broken output when formatting the output using Prince -- but only in XHTML mode.

If I run an unmodified copy of the Automatic TOC script (from the Scripts, Tips & Tricks forum) in XHTML mode then its generated table of contents also shows the problem:

prince.xhtml.mangled.png


In both cases the output is correct as expected when processed in HTML mode.

I've reduced my code down to a simplified test case. In my tests this shows no content at all in XHTML mode, but formats as expected in HTML mode:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>strict</title>
        <script type="text/javascript">
function build(id)
{
    var ul = document.createElement("ul");
    document.getElementById("toc").appendChild(ul);

    var li = document.createElement("li");
    ul.appendChild(li);

    var a = document.createElement("a");
    li.appendChild(a);

    var text = document.createTextNode("one");
    a.appendChild(text);

    var li = document.createElement("li");
    ul.appendChild(li);

    var a = document.createElement("a");
    li.appendChild(a);

    var text = document.createTextNode("two");
    a.appendChild(text);

    var text = document.createTextNode("lots");
    document.getElementById("toc").appendChild(text);
}
        </script>    
    </head>

    <body onLoad="build('toc')">
        <div id="toc">
            <h1>Table of Contents</h1>
        </div>
        <div>
            <h1>Another div</h1>
        </div>
    </body>
</html>


Are there any known problems or gotchas when inserting content using JavaScript in XHTML mode, or have I hit a genuine bug?

Regards,
Dave
  1. prince.xhtml.mangled.png‎ 13.7 kB ‎
    Screenshot
mikeday
XHTML is case-sensitive, try renaming the onLoad attribute to "onload".
dpt
I see the same problem even with that fixed.

Regards,
Dave
mikeday
Okay that's odd, if I rename "onLoad" to "onload" and run Prince with the --javascript option then I do get "onetwolots" in the PDF. Can you try adding "alert('message');" in the build() function and check that it issues a warning on the output log? Is the --javascript option being passed on the command-line?
dpt
My mistake. With onLoad -> onload fixed it does now output. However the output is not as expected.

I'm expecting two bullet points 'one', 'two', followed by a paragraph 'lots'.

expected.png


But when the document is XHTML I see 'onetwolots':

actual.png


Regards,
Dave
  1. actual.png‎ 9.9 kB ‎
    Actual output in XHTML mode.
  2. expected.png‎ 10.3 kB ‎
    Output from HTML mode.
mikeday
In XHTML you will need to use createElementNS to create the elements in the correct XHTML namespace so that they pick up the expected default styles. There isn't much point to this though; if you're going to use JavaScript to manipulate the DOM, it makes more sense to treat the document as HTML, not XHTML. That will also guarantee better interoperability with browsers.
dpt
Makes sense. Thanks!