chapter markup causing display issues

[kimtuck]

The issue is caused by certain markup in the contents of a chapter.

Issue 1. When markup of the form

<p>text<a id="page_2" />more text</p>

is in the chapter contents, one would expect a dom that looks like this in the iframe's content:

<p>
    text
    <a id="page_2" />
    more text
</p>

But what you get (at least on IE 11) is

<p>
   text
   <a id="page_2">
       more text
   </a>
</p>

Which is not the intention of the author. This issue can be resolved by rewriting the a tag as (instead of using a self-closing tag, use a tag with opening and closing markup)

Issue 2. The above is really screwed over when the page contains several paragraphs like above, with newlines between the </p> and the following <p>. In this case, you end up with sections that have multiple <a id="page_2"> tags in the iframe's document.

At this point, I'm not sure whether this is purely a readium issue, or if the issue is in the underlying implementation of the document.write() used to populate the iframe.

I have prepared a simple html file that illustrates the above issues. It is attached to this ticket.

To view issue 1:
show(issue1_broken) and show(issue1_fixed)

To view issue 2
show (issue2_broken) and show (issue2_modified)

For issue 2, issue2_modified just replaces the newlines; and when the newlines are replaced, the dom is different, but still not correct.

The correct display is rendered when both the newlines are replaced, and the is changed to a tag with opening and closing markup
t.txt

(update)
Here is the change I made to the source to get me past this issue:

        this._loadIframeWithDocument = function (iframe, attachedData, contentDocumentData, callback) {

            // remove any newlines in the document
            function replaceAll(str, find, replace) {
                return str.replace(new RegExp(find, 'g'), replace);
            }

            function selfClosingToNonSelfClosing(str, tag) {
                return str.replace(new RegExp("(<" + tag + "[^>]*)(\\s*/>)", 'g'), "$1></" + tag + ">");
            }
            contentDocumentData = replaceAll(contentDocumentData, String.fromCharCode(10), '');
            contentDocumentData = selfClosingToNonSelfClosing(contentDocumentData, 'a');