Error: Unmatched closing tag: bpmn2:definitions

Users
1

This is supposed to be a working example that I copy-pasted. It’s a simple diagram wityh a start event.

<div id="canvas"></div>
<script src="/scc/js/bpmn/bpmn-viewer.js"></script>
<script>
var newDiagramXML = "<?xml version=\"1.0\" encoding=\"UTF-8\"?>\n<bpmn2:definitions xmlns:xsi=\"http://www.w3.org/2001/XMLSchema-instance\" xmlns:bpmn2=\"http://www.omg.org/spec/BPMN/20100524/MODEL\" xmlns:bpmndi=\"http://www.omg.org/spec/BPMN/20100524/DI\" xmlns:dc=\"http://www.omg.org/spec/DD/20100524/DC\" xmlns:di=\"http://www.omg.org/spec/DD/20100524/DI\" xsi:schemaLocation=\"http://www.omg.org/spec/BPMN/20100524/MODEL BPMN20.xsd\" id=\"sample-diagram\" targetNamespace=\"http://bpmn.io/schema/bpmn\">\n  <bpmn2:process id=\"Process_111\" isExecutable=\"false\">\n    <bpmn2:startEvent id=\"StartEvent_1\"/>\n  </bpmn2:process>\n  <bpmndi:BPMNDiagram id=\"BPMNDiagram_1\">\n    <bpmndi:BPMNPlane id=\"BPMNPlane_1\" bpmnElement=\"Process_1\">\n      <bpmndi:BPMNShape id=\"_BPMNShape_StartEvent_2\" bpmnElement=\"StartEvent_1\">\n        <dc:Bounds height=\"36.0\" width=\"36.0\" x=\"412.0\" y=\"240.0\"/>\n      </bpmndi:BPMNShape>\n    </bpmndi:BPMNPlane>\n  </bpmndi:BPMNDiagram>\n</bpmn2:definitions>";

console.log(newDiagramXML);
var viewer = new window.BpmnJS({ container: '#canvas' });

  // import a BPMN 2.0 diagram
  viewer.importXML(newDiagramXML, function(err) {
    if (err) {
      console.log(err);
    } else {
      // we did well!

      var canvas = viewer.get('canvas');
      canvas.zoom('fit-viewport');
    }
  });
</script>

This is the error I get:

Error: Unmatched closing tag: bpmn2:definitions
Line: 12
Column: 20
Char: >
at error (bpmn-viewer.js:21471:8)
at strictFail (bpmn-viewer.js:21491:22)
at closeTag (bpmn-viewer.js:21680:5)
at SAXParser.write (bpmn-viewer.js:22123:29)
at bpmn-viewer.js:18925:14
at bpmn-viewer.js:14667:39

Help will be greatly appreciate! :slight_smile:

2

It tells you exactly what is up:

Error: Unmatched closing tag: bpmn2:definitions
Line: 12
Column: 20
Char: >
3

Yes, but that closing tag is definitely there, and the whole diagram XML is a valid XML if I test it with other tools. For some reason the BpmnJS viewer does not read it properly?

4

Please attach the diagram so we can look into it. Thanks!

5

This is the diagram assigned to the var in JS:

var newDiagramXML = "<bpmn2:definitions xmlns:xsi=\"http://www.w3.org/2001/XMLSchema-instance\" xmlns:bpmn2=\"http://www.omg.org/spec/BPMN/20100524/MODEL\" xmlns:bpmndi=\"http://www.omg.org/spec/BPMN/20100524/DI\" xmlns:dc=\"http://www.omg.org/spec/DD/20100524/DC\" xmlns:di=\"http://www.omg.org/spec/DD/20100524/DI\" xsi:schemaLocation=\"http://www.omg.org/spec/BPMN/20100524/MODEL BPMN20.xsd\" id=\"sample-diagram\" targetNamespace=\"http://bpmn.io/schema/bpmn\">\n <bpmn2:process id=\"Process_111\" isExecutable=\"false\">\n <bpmn2:startEvent id=\"StartEvent_1\"/>\n </bpmn2:process>\n <bpmndi:BPMNDiagram id=\"BPMNDiagram_1\">\n <bpmndi:BPMNPlane id=\"BPMNPlane_1\" bpmnElement=\"Process_111\">\n <bpmndi:BPMNShape id=\"_BPMNShape_StartEvent_2\" bpmnElement=\"StartEvent_1\">\n <dc:Bounds height=\"36.0\" width=\"36.0\" x=\"412.0\" y=\"240.0\"/>\n </bpmndi:BPMNShape>\n </bpmndi:BPMNPlane>\n </bpmndi:BPMNDiagram>\n</bpmn2:definitions>";

If you unescape the quotes it passes thru an XML validator (like http://codebeautify.org/xmlvalidator). I can also load it in the online demo- http://demo.bpmn.io/.

6

Well, does not seem to be an issue with bpmn-js, when it can be loaded and displayed by bpmn-js embedded inside our demo application, right?

Try to debug and check if you accidentally slice of the last line.

7

Well, I wouldn’t know if the code called by your demo app is exactly the same called by viewer.importXML(). If it is exactly the same than it is very weird. I’ve got it in my jsp page exactly as I pasted it so I am not sure how to proceed from here.

8

Yes, both are exactly the same.

9

Then it must be the way importXML() read the XML. The escaping or something else. Does this simple example work for everybody else?