feat(replace-menu): update label of collapsed pool

* Indicate the action in a clearer, more standard-compliant way --> replaces an expanded pool with an empty "black box" + removing its content.
* We will not update the action identifier (`replace-with-collapsed-pool`) to avoid breaking changes.
* Make it possible to retrieve label via function

Related to camunda/camunda-modeler#2022
This commit is contained in:
Niklas Kiefer 2020-12-07 10:16:32 +01:00 committed by fake-join[bot]
parent 75b48a37b5
commit 8faee2bde9
4 changed files with 113 additions and 2 deletions

View File

@ -390,10 +390,15 @@ ReplaceMenuProvider.prototype._createMenuEntry = function(definition, element, a
return replaceElement(element, definition.target);
};
var label = definition.label;
if (label && typeof label === 'function') {
label = label(element);
}
action = action || replaceAction;
var menuEntry = {
label: translate(definition.label),
label: translate(label),
className: definition.className,
id: definition.actionName,
action: action

View File

@ -829,7 +829,15 @@ export var PARTICIPANT = [
}
},
{
label: 'Collapsed Pool',
label: function(element) {
var label = 'Empty Pool';
if (element.children && element.children.length) {
label += ' (removes content)';
}
return label;
},
actionName: 'replace-with-collapsed-pool',
// TODO(@janstuemmel): maybe design new icon

View File

@ -0,0 +1,49 @@
<?xml version="1.0" encoding="UTF-8"?>
<bpmn:definitions xmlns:bpmn="http://www.omg.org/spec/BPMN/20100524/MODEL" xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI" xmlns:di="http://www.omg.org/spec/DD/20100524/DI" xmlns:dc="http://www.omg.org/spec/DD/20100524/DC" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" id="Definitions_1" targetNamespace="http://bpmn.io/schema/bpmn">
<bpmn:collaboration id="Collaboration_1">
<bpmn:participant id="Participant_1" name="Participant 1" processRef="Process_1" />
<bpmn:participant id="Participant_2" name="Participant 2" processRef="Process_2" />
</bpmn:collaboration>
<bpmn:process id="Process_1" isExecutable="false">
<bpmn:startEvent id="StartEvent_1">
<bpmn:outgoing>Flow_1</bpmn:outgoing>
</bpmn:startEvent>
<bpmn:task id="Task_1">
<bpmn:incoming>Flow_1</bpmn:incoming>
<bpmn:outgoing>Flow_2</bpmn:outgoing>
</bpmn:task>
<bpmn:sequenceFlow id="Flow_1" sourceRef="StartEvent_1" targetRef="Task_1" />
<bpmn:endEvent id="EndEvent_1">
<bpmn:incoming>Flow_2</bpmn:incoming>
</bpmn:endEvent>
<bpmn:sequenceFlow id="Flow_2" sourceRef="Task_1" targetRef="EndEvent_1" />
</bpmn:process>
<bpmn:process id="Process_2" />
<bpmndi:BPMNDiagram id="BPMNDiagram_1">
<bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="Collaboration_1">
<bpmndi:BPMNShape id="Participant_1_di" bpmnElement="Participant_1" isHorizontal="true">
<dc:Bounds x="170" y="70" width="600" height="250" />
</bpmndi:BPMNShape>
<bpmndi:BPMNEdge id="Flow_2_di" bpmnElement="Flow_2">
<di:waypoint x="490" y="190" />
<di:waypoint x="582" y="190" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="Flow_1_di" bpmnElement="Flow_1">
<di:waypoint x="298" y="190" />
<di:waypoint x="390" y="190" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNShape id="StartEvent_1_di" bpmnElement="StartEvent_1">
<dc:Bounds x="262" y="172" width="36" height="36" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="Task_1_di" bpmnElement="Task_1">
<dc:Bounds x="390" y="150" width="100" height="80" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="EndEvent_1_di" bpmnElement="EndEvent_1">
<dc:Bounds x="582" y="172" width="36" height="36" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="Participant_2_di" bpmnElement="Participant_2" isHorizontal="true">
<dc:Bounds x="170" y="350" width="600" height="250" />
</bpmndi:BPMNShape>
</bpmndi:BPMNPlane>
</bpmndi:BPMNDiagram>
</bpmn:definitions>

View File

@ -190,6 +190,7 @@ describe('features/popup-menu - replace menu provider', function() {
}));
});
describe('toggle', function() {
beforeEach(bootstrapModeler(diagramXMLMarkers, { modules: testModules }));
@ -1179,6 +1180,7 @@ describe('features/popup-menu - replace menu provider', function() {
});
describe('collapsed subprocesses', function() {
var diagramXML = require('./ReplaceMenuProvider.collapsedSubProcess.bpmn');
@ -1203,6 +1205,47 @@ describe('features/popup-menu - replace menu provider', function() {
});
describe('pools', function() {
var diagramXML = require('./ReplaceMenuProvider.pools.bpmn');
beforeEach(bootstrapModeler(diagramXML, { modules: testModules }));
it('should indicate removing content', inject(function(elementRegistry) {
// given
var expandedPool = elementRegistry.get('Participant_1');
// when
openPopup(expandedPool);
var emptyPoolLabel = queryEntryLabel('replace-with-collapsed-pool');
// then
expect(emptyPoolLabel).to.exist;
expect(emptyPoolLabel.innerHTML).to.eql('Empty Pool (removes content)');
}));
it('should NOT indicate removing content', inject(function(elementRegistry) {
// given
var expandedPool = elementRegistry.get('Participant_2');
// when
openPopup(expandedPool);
var emptyPoolLabel = queryEntryLabel('replace-with-collapsed-pool');
// then
expect(emptyPoolLabel).to.exist;
expect(emptyPoolLabel.innerHTML).to.eql('Empty Pool');
}));
});
describe('data object', function() {
beforeEach(bootstrapModeler(diagramXMLDataElements, { modules: testModules }));
@ -2138,6 +2181,12 @@ function queryEntries() {
return domQueryAll('.djs-popup .entry', container);
}
function queryEntryLabel(id) {
var entry = queryEntry(id);
return domQuery('span', entry);
}
function triggerAction(id) {
var entry = queryEntry(id);