Diagram Application
  1. Diagram Application
  2. XADIAGRAM-9

Newlines in text on shapes does not display correctly.

    Details

    • Type: Bug Bug
    • Status: Closed Closed
    • Priority: Major Major
    • Resolution: Duplicate
    • Affects Version/s: 1.0.4
    • Fix Version/s: None
    • Labels:
      None
    • Similar issues:

      Description

      If you create a diagram and include any multi-line text on any of the shapes in the diagram, when you save and view, the text appears corrupted. Instead it displays on a single line with the newline replaced by &.

      The problem is actually in the initialization code in reader.min.js. Prior to rendering the diagram, it does some replacements on the XML text to fix certain XML entity references, however, the one that is supposed to deal with newlines is incorrect. It's trying to replace with a newline character, however, it should be searching for 
 and replacing it with

      I just now need to figure out if this is a customer reader.min.js file for the Diagram application, or whether this is a bug that should also be submitted upstream to the draw.io team.

        Issue Links

          Activity

          Hide
          Jonathan added a comment -

          Any progress on this one?

          Show
          Jonathan added a comment - Any progress on this one?
          Hide
          Brett Gersekowski added a comment -

          I do have a fix for it which works quite well, however, there is the question of where it should fit. The issue is in reader.min.js, which was part of the draw.io libraries. At the time that this app was built, draw.io was apparently open source, however, the licensing of later versions which have fixed this issue have changed. So we can't legally use later versions of the draw.io code. We can probably modify the earlier code that was provided under a different licence, but that was before my time so I don't know the terms of that licence. It also raises questions about who will own and maintain the fix.

          Show
          Brett Gersekowski added a comment - I do have a fix for it which works quite well, however, there is the question of where it should fit. The issue is in reader.min.js, which was part of the draw.io libraries. At the time that this app was built, draw.io was apparently open source, however, the licensing of later versions which have fixed this issue have changed. So we can't legally use later versions of the draw.io code. We can probably modify the earlier code that was provided under a different licence, but that was before my time so I don't know the terms of that licence. It also raises questions about who will own and maintain the fix.
          Hide
          Jonathan added a comment -

          @Brett:

          Could you give me some hints on how to fix this issue and how to repackage the fixed version? I don't really understand how to embed a zip file (draw.io.zip) into an xml file.

          I'm not planning on releasing the fixed version, I'd just use it internally for my company's wiki.

          Show
          Jonathan added a comment - @Brett: Could you give me some hints on how to fix this issue and how to repackage the fixed version? I don't really understand how to embed a zip file (draw.io.zip) into an xml file. I'm not planning on releasing the fixed version, I'd just use it internally for my company's wiki.
          Hide
          Ludek Finstrle added a comment - - edited

          The fix is quite easy in file js/reader.min.js.

          On line 974 you should see:
          document.getElementsByTagName("*"),c=0;c<b.length;c++)b[c].className.toString().indexOf("mxgraph")>=0&&function(d){try{for(var e=d.firstChild;e!=null&&e.nodeType!=mxConstants.NODETYPE_ELEMENT;)e=e.nextSibling;var f=e.innerHTML,f=f.substring(0,16)=="&lt;mxGraphModel"?f.replace(/&lt;/g,"<").replace(/&gt;/g,">").replace(/&amp;gt;/g,"&gt;").replace(/&amp;lt;/g,"&lt;").replace(/&amp;quot;/g,"&quot;").replace(/&#xa;/g,"\n"):f.substring(0,15)=="%3CmxGraphModel"?decodeURIComponent(f):decodeURIComponent(RawDeflate.inflate(Base64.decode(f,

          Just add .replace(/&amp;#xa;/g,"&#xa;")
          between .replace(/&#xa;/g,"\n")
          and :f.substring(0,15)=="%3CmxGraphModel"

          so the resulted form will be:
          .replace(/&#xa;/g,"\n").replace(/&amp;#xa;/g,"&#xa;"):f.substring(0,15)=="%3CmxGraphModel"

          Then only rezip, and reupload. It should work after xwiki restart (maybe just some cache flush).

          I hope it helps.

          Show
          Ludek Finstrle added a comment - - edited The fix is quite easy in file js/reader.min.js. On line 974 you should see: document.getElementsByTagName("*"),c=0;c<b.length;c++)b [c] .className.toString().indexOf("mxgraph")>=0&&function(d){try{for(var e=d.firstChild;e!=null&&e.nodeType!=mxConstants.NODETYPE_ELEMENT;)e=e.nextSibling;var f=e.innerHTML,f=f.substring(0,16)=="&lt;mxGraphModel"?f.replace(/&lt;/g,"<").replace(/&gt;/g,">").replace(/&amp;gt;/g,"&gt;").replace(/&amp;lt;/g,"&lt;").replace(/&amp;quot;/g,"&quot;").replace(/&#xa;/g,"\n"):f.substring(0,15)=="%3CmxGraphModel"?decodeURIComponent(f):decodeURIComponent(RawDeflate.inflate(Base64.decode(f, Just add .replace(/&amp;#xa;/g,"&#xa;") between .replace(/&#xa;/g,"\n") and :f.substring(0,15)=="%3CmxGraphModel" so the resulted form will be: .replace(/&#xa;/g,"\n").replace(/&amp;#xa;/g,"&#xa;"):f.substring(0,15)=="%3CmxGraphModel" Then only rezip, and reupload. It should work after xwiki restart (maybe just some cache flush). I hope it helps.
          Hide
          Marius Dumitru Florea added a comment -

          I cannot reproduce anymore after upgrading draw.io

          Show
          Marius Dumitru Florea added a comment - I cannot reproduce anymore after upgrading draw.io

            People

            • Assignee:
              Marius Dumitru Florea
              Reporter:
              Brett Gersekowski
            • Votes:
              2 Vote for this issue
              Watchers:
              4 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved:
                Date of First Response: