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

fix(bpmn-renderer): properly escape marker ids 

Only characters and numbers are allowed. Anything else will be escaped.

Closes #1209
This commit is contained in:
Philipp Fromme 2019-11-07 13:52:47 +01:00 committed by fake-join[bot]
parent 5aa162efcd
commit e68978bf66
3 changed files with 50 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
lib/draw/BpmnRenderer.js
View File

@ -128,7 +128,9 @@ export default function BpmnRenderer(
}
function colorEscape(str) {
return str.replace(/[()\s,#]+/g, '_');
// only allow characters and numbers
return str.replace(/[^0-9a-zA-z]+/g, '_');
}
function marker(type, fill, stroke) {

2
test/spec/draw/BpmnRenderer.colors.bpmn
View File

@ -74,7 +74,7 @@
<dc:Bounds x="320" y="163" width="45" height="24" />
</bpmndi:BPMNLabel>
</bpmndi:BPMNShape>
<bpmndi:BPMNEdge id="SequenceFlow_0h9s0mp_di" bpmnElement="SequenceFlow_0h9s0mp">
<bpmndi:BPMNEdge id="SequenceFlow_0h9s0mp_di" bpmnElement="SequenceFlow_0h9s0mp" bioc:stroke="rgba(255, 0, 0, 0.9)">
<di:waypoint x="296" y="229" />
<di:waypoint x="318" y="229" />
<bpmndi:BPMNLabel>

63
test/spec/draw/BpmnRendererSpec.js
View File

@ -245,18 +245,18 @@ describe('draw - bpmn renderer', function() {
it('should properly render colored markers', function(done) {
var xml = require('./BpmnRenderer.colors.bpmn');
bootstrapViewer(xml).call(this, function(err) {
bootstrapViewer(xml).call(this, function(err) {
inject(function(canvas) {
var svg = canvas._svg;
var markers = svg.querySelectorAll('marker');
var svg = canvas._svg,
markers = svg.querySelectorAll('marker');
expect(markers).to.have.length(7);
expect(markers[0].id).to.match(/^sequenceflow-end-rgb_255_224_178_-rgb_251_140_0_-[A-Za-z0-9]{25}$/);
expect(markers[1].id).to.match(/^sequenceflow-end-yellow-blue-[A-Za-z0-9]{25}$/);
expect(markers[2].id).to.match(/^sequenceflow-end-white-_3399aa-[A-Za-z0-9]{25}$/);
expect(markers[3].id).to.match(/^sequenceflow-end-white-rgba_255_0_0_0_9_-[A-Za-z0-9]{25}$/);
expect(markers[4].id).to.match(/^association-end-_FFE0B2-_FB8C00-[A-Za-z0-9]{25}$/);
expect(markers[5].id).to.match(/^messageflow-end-_FFE0B2-_FB8C00-[A-Za-z0-9]{25}$/);
expect(markers[6].id).to.match(/^messageflow-start-_FFE0B2-_FB8C00-[A-Za-z0-9]{25}$/);
@ -268,13 +268,12 @@ describe('draw - bpmn renderer', function() {
it('should properly render connection markers (2)', function(done) {
var xml = require('./BpmnRenderer.connection-colors.bpmn');
bootstrapViewer(xml).call(this, function(err) {
bootstrapViewer(xml).call(this, function(err) {
inject(function(canvas) {
var svg = canvas._svg;
var markers = svg.querySelectorAll('marker');
var svg = canvas._svg,
markers = svg.querySelectorAll('marker');
expect(markers).to.have.length(4);
expect(markers[0].id).to.match(/^association-end-rgb_23_100_344_-rgb_23_100_344_-[A-Za-z0-9]{25}$/);
@ -338,7 +337,7 @@ describe('draw - bpmn renderer', function() {
var defaultFillColor = 'red',
defaultStrokeColor = 'lime';
// TODO(philippfromme): remove once PhantomJS is not used anymore
// TODO(philippfromme): remove once we drop PhantomJS
function expectedColors(color) {
var conversionValues = {
@ -368,12 +367,42 @@ describe('draw - bpmn renderer', function() {
}
}));
// TODO(philippfromme): remove once we drop PhantomJS
/**
* Ensure alpha channel of RGB (rgba) color has one decimal point.
*
* @param {string} color
*
* @return {string}
*/
function fixRgba(color) {
if (color.indexOf('rgba') !== -1) {
return [
'rgba(',
color
.replace(/rgba\(|\)/g, '')
.split(',')
.map(function(string) {
if (string.indexOf('.') !== -1) {
return parseFloat(string).toFixed(1);
}
return parseInt(string);
})
.join(', '),
')'
].join('');
}
return color;
}
function expectFillColor(element, color) {
expect(expectedColors(color)).to.include(element.style.fill);
expect(expectedColors(color)).to.include(fixRgba(element.style.fill));
}
function expectStrokeColor(element, color) {
expect(expectedColors(color)).to.include(element.style.stroke);
expect(expectedColors(color)).to.include(fixRgba(element.style.stroke));
}
/**
@ -422,20 +451,20 @@ describe('draw - bpmn renderer', function() {
it('should render default colors without overriding', inject(function(canvas, elementRegistry) {
var rootElement = canvas.getRootElement();
elementRegistry.forEach(function(e) {
if (e === rootElement) {
elementRegistry.forEach(function(element) {
if (element === rootElement) {
return;
}
var gfx = elementRegistry.getGraphics(e),
di = getDi(e),
var gfx = elementRegistry.getGraphics(element),
di = getDi(element),
fillColor = di.get('bioc:fill'),
strokeColor = di.get('bioc:stroke');
if (fillColor || strokeColor) {
expectColors(e, gfx, fillColor, strokeColor);
expectColors(element, gfx, fillColor, strokeColor);
} else {
expectColors(e, gfx, defaultFillColor, defaultStrokeColor);
expectColors(element, gfx, defaultFillColor, defaultStrokeColor);
}
});
}));