sartography
/
bpmn-js
mirror of https://github.com/sartography/bpmn-js.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

fix(Viewer): handle and display errors 

Closes #8
This commit is contained in:
Nico Rehwaldt 2014-03-21 21:10:01 +01:00
parent bcdac47882
commit 20c4f4e396
11 changed files with 168 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
example/app.css
View File

@ -22,7 +22,7 @@ a:link {
height: 100%; height: 100%;
} }
.content .intro { .content > .message {
text-align: center; text-align: center;
display: table; display: table;
@ -30,13 +30,29 @@ a:link {
color: #111; color: #111;
} }
.content .intro .note { .content > .message .note {
vertical-align: middle; vertical-align: middle;
text-align: center; text-align: center;
display: table-cell; display: table-cell;
} }
.content .canvas, .content .error .details {
max-width: 500px;
font-size: 12px;
margin: 20px auto;
text-align: left;
}
.content .error pre {
border: solid 1px #CCC;
background: #EEE;
padding: 10px;
}
.content:not(.with-error) .error,
.content .canvas,
.content.with-error .canvas,
.content.with-error .intro,
.content.with-diagram .intro { .content.with-diagram .intro {
display: none; display: none;
} }

26
example/app.js
View File

@ -1,8 +1,8 @@
(function() { (function() {
var Model = require('bpmn/Model'), var Viewer = require('bpmn/Viewer'),
Viewer = require('bpmn/Viewer'), Modeler = require('bpmn/Modeler'),
Modeler = require('bpmn/Modeler'); Model = require('bpmn/Model');
var container = $('#js-drop-zone'); var container = $('#js-drop-zone');
@ -28,21 +28,25 @@
'</bpmn2:definitions>'; '</bpmn2:definitions>';
function createNewDiagram() { function createNewDiagram() {
var bpmn = Model.instance();
openDiagram(newDiagramXML); openDiagram(newDiagramXML);
} }
function openDiagram(xml) { function openDiagram(xml) {
Model.fromXML(xml, 'bpmn:Definitions', function(err, definitions) { renderer.importXML(xml, function(err) {
if (err) { if (err) {
console.error(err); container
.removeClass('with-diagram')
.addClass('with-error');
container.find('.error pre').text(err.message);
console.warn('[import] ' + err.message);
} else { } else {
renderer.importDefinitions(definitions, function() { container
container.addClass('with-diagram'); .removeClass('with-error')
}); .addClass('with-diagram');
} }
}); });
} }

15
example/index.html
View File

@ -11,13 +11,24 @@
<body> <body>
<div class="content" id="js-drop-zone"> <div class="content" id="js-drop-zone">
<div class="intro"> <div class="message intro">
<div class="note"> <div class="note">
Drop BPMN diagram from your desktop or <a id="js-create-diagram" href>create a new diagram</a> to get started. Drop BPMN diagram from your desktop or <a id="js-create-diagram" href>create a new diagram</a> to get started.
</div> </div>
</div> </div>
<div class="canvas" id="js-canvas"></div> <div class="message error">
<div class="note">
<p>Ooops, we could not display the BPMN 2.0 diagram.</p>
<div class="details">
<span>cause of the problem</span>
<pre></pre>
</div>
</div>
</div>
<div class="canvas modeler" id="js-canvas"></div>
</div> </div>
<div class="logo"></div> <div class="logo"></div>

15
example/index-modeler.html → example/viewer.html
View File

@ -11,13 +11,24 @@
<body> <body>
<div class="content" id="js-drop-zone"> <div class="content" id="js-drop-zone">
<div class="intro"> <div class="message intro">
<div class="note"> <div class="note">
Drop BPMN diagram from your desktop or <a id="js-create-diagram" href>create a new diagram</a> to get started. Drop BPMN diagram from your desktop or <a id="js-create-diagram" href>create a new diagram</a> to get started.
</div> </div>
</div> </div>
<div class="canvas modeler" id="js-canvas"></div> <div class="message error">
<div class="note">
<p>Ooops, we could not display the BPMN 2.0 diagram.</p>
<div class="details">
<span>cause of the problem</span>
<pre></pre>
</div>
</div>
</div>
<div class="canvas" id="js-canvas"></div>
</div> </div>
<div class="logo"></div> <div class="logo"></div>

22
lib/Viewer.js
View File

@ -1,10 +1,25 @@
var Diagram = require('diagram-js'); var Diagram = require('diagram-js');
var Importer = require('./Importer');
var Importer = require('./Importer'),
Model = require('./Model');
function Viewer(container) { function Viewer(container) {
this.container = container; this.container = container;
} }
Viewer.prototype.importXML = function(xml, done) {
var self = this;
Model.fromXML(xml, 'bpmn:Definitions', function(err, definitions) {
if (err) {
return done(err);
}
self.importDefinitions(definitions, done);
});
};
Viewer.prototype.importDefinitions = function(definitions, done) { Viewer.prototype.importDefinitions = function(definitions, done) {
if (this.diagram) { if (this.diagram) {
@ -17,11 +32,6 @@ Viewer.prototype.importDefinitions = function(definitions, done) {
Importer.importBpmnDiagram(this.diagram, definitions, done); Importer.importBpmnDiagram(this.diagram, definitions, done);
}; };
Viewer.prototype.exportDefinitions = function(done) {
};
Viewer.prototype.createDiagram = function() { Viewer.prototype.createDiagram = function() {
return new Diagram({ canvas: { container: this.container }}); return new Diagram({ canvas: { container: this.container }});
}; };

BIN
test/fixtures/bpmn/error/binary.png vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 272 B

9
test/fixtures/bpmn/error/extension-elements.bpmn vendored Normal file
View File

@ -0,0 +1,9 @@
<?xml version="1.0" encoding="UTF-8"?>
<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" xmlns:vendor="http://vendor" id="test" targetNamespace="http://bpmn.io/schema/bpmn">
<bpmn2:extensionElements>
<vendor:info key="bgcolor" value="#ffffff"/>
<vendor:info key="rolle" value="[]"/>
</bpmn2:extensionElements>
</bpmn2:definitions>

6
test/fixtures/bpmn/error/invalid-child.bpmn vendored Normal file
View File

@ -0,0 +1,6 @@
<?xml version="1.0" encoding="UTF-8"?>
<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" id="test" targetNamespace="http://bpmn.io/schema/bpmn">
<someElement a="b" />
</bpmn2:definitions>

1
test/fixtures/bpmn/error/no-xml.txt vendored Normal file
View File

@ -0,0 +1 @@
this is no xml

34
test/spec/browser/ImporterSpec.js
View File

@ -13,10 +13,12 @@ describe('Importer', function() {
return BpmnModel.fromXML(xml, 'bpmn:Definitions', opts, callback); return BpmnModel.fromXML(xml, 'bpmn:Definitions', opts, callback);
} }
beforeEach(Matchers.add);
var container; var container;
beforeEach(Matchers.add);
beforeEach(function() { beforeEach(function() {
container = document.createElement('div'); container = document.createElement('div');
document.getElementsByTagName('body')[0].appendChild(container); document.getElementsByTagName('body')[0].appendChild(container);
@ -26,25 +28,43 @@ describe('Importer', function() {
container.parentNode.removeChild(container); container.parentNode.removeChild(container);
}); });
it('should import simple process', function(done) { it('should import simple process', function(done) {
var xml = fs.readFileSync('test/fixtures/bpmn/simple.bpmn', 'utf8'); var xml = fs.readFileSync('test/fixtures/bpmn/simple.bpmn', 'utf8');
read(xml, function(err, result) { var renderer = new Viewer(container);
var renderer = new Viewer(container);
renderer.importDefinitions(result, done); renderer.importXML(xml, function(err) {
done(err);
}); });
}); });
it('should import empty definitions', function(done) { it('should import empty definitions', function(done) {
var xml = fs.readFileSync('test/fixtures/bpmn/empty-definitions.bpmn', 'utf8'); var xml = fs.readFileSync('test/fixtures/bpmn/empty-definitions.bpmn', 'utf8');
read(xml, function(err, result) { var renderer = new Viewer(container);
var renderer = new Viewer(container);
renderer.importDefinitions(result, done); renderer.importXML(xml, function(err) {
done(err);
}); });
}); });
it('should handle errors', function(done) {
var xml = 'invalid stuff';
var renderer = new Viewer(container);
renderer.importXML(xml, function(err) {
expect(err).toBeDefined();
done();
});
});
}); });

49
test/spec/node/xml/ReadSpec.js
View File

@ -401,6 +401,55 @@ describe('Model', function() {
}); });
}); });
describe('should handle errors', function() {
it('when importing non-xml text', function(done) {
// when
readFile('error/no-xml.txt', 'bpmn:Definitions', function(err, result) {
expect(err).toBeDefined();
done();
});
});
it('when importing binary', function(done) {
// when
readFile('error/binary.png', 'bpmn:Definitions', function(err, result) {
expect(err).toBeDefined();
done();
});
});
it('when importing extension elements', function(done) {
// when
readFile('error/extension-elements.bpmn', 'bpmn:Definitions', function(err, result) {
expect(err).toBeDefined();
done();
});
});
it('when importing invalid bpmn', function(done) {
// when
readFile('error/invalid-child.bpmn', 'bpmn:Definitions', function(err, result) {
expect(err).toBeDefined();
done();
});
});
});
}); });
}); });