sartography/bpmn-js
1
0
Fork 0
mirror of https://github.com/sartography/bpmn-js.git synced 2025-02-03 12:43:47 +00:00
Code Issues Packages Projects Releases Wiki Activity

improve(viewer): clean up SVG before export

Browse Source 
Remove outer-marker-bound <rect> from export.

close bpmn-io/bpmn-js#97
This commit is contained in:
jdotzki 2014-08-17 12:17:15 +02:00
parent 63caaeb7f4
commit b5ba814952
2 changed files with 72 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
lib/Viewer.js
View File

@ -10,13 +10,33 @@ var Importer = require('./import/Importer');
function getSvgContents(diagram) {
var outerNode = diagram.get('canvas').getContainer();
var svg = outerNode.innerHTML;
return svg.replace(/^.*<svg[^>]*>|<\/svg>.*$/g, '')
.replace('<desc>Created with Snap</desc>', '')
.replace(/<g class="viewport"( transform="[^"]*")?/, '<g');
svg = svg.replace(/^.*<svg[^>]*>|<\/svg>.*$/g, '')
.replace('<desc>Created with Snap</desc>', '')
.replace(/<g class="viewport"( transform="[^"]*")?/, '<g');
var svgDoc = svgDomCleanUp(svg);
return svgDoc.innerHTML;
}
/**
* pre-export clean up that need access to the DOM.
* <ul>
* <li>remove outer-bound-marker (a safari mobile work around)</li>
* </ul>
*/
function svgDomCleanUp(svg) {
var svgDoc = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
svgDoc.innerHTML = svg;
_.forEach(svgDoc.querySelectorAll('.outer-bound-marker'), function (e) {
e.remove();
});
return svgDoc;
}
function initListeners(diagram, listeners) {
var events = diagram.get('eventBus');

48
test/spec/ViewerSpec.js
View File

@ -273,6 +273,54 @@ describe('viewer', function() {
});
});
it('should remove outer-makers on export', function(done) {
// given
var xml = fs.readFileSync('test/fixtures/bpmn/complex.bpmn', 'utf8');
function appendTestRect(svgDoc) {
var rect = document.createElementNS(svgDoc.namespaceURI, 'rect');
rect.setAttribute('class', 'outer-bound-marker');
rect.setAttribute('width', 500);
rect.setAttribute('height', 500);
rect.setAttribute('x', 10000);
rect.setAttribute('y', 10000);
svgDoc.appendChild(rect);
}
createViewer(xml, function(err, viewer) {
if (err) {
return done(err);
}
var svgDoc = viewer.container.childNodes[1].childNodes[1];
appendTestRect(svgDoc);
appendTestRect(svgDoc);
expect(svgDoc.querySelectorAll('.outer-bound-marker')).toBeDefined();
// when
viewer.saveSVG(function(err, svg) {
if (err) {
return done(err);
}
var svgDoc = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
svgDoc.innerHTML = svg;
// then
expect(isValid(svg)).toBe(true);
expect(svgDoc.querySelector('.outer-bound-marker')).toBeNull();
done();
});
});
});
});
describe('configuration', function() {