Skip to content

Commit

Permalink
fix(modeler): always scroll to element
Browse files Browse the repository at this point in the history
  • Loading branch information
marstamm authored and merge-me[bot] committed Aug 22, 2023
1 parent 27493d8 commit 11668d0
Show file tree
Hide file tree
Showing 3 changed files with 141 additions and 23 deletions.
13 changes: 1 addition & 12 deletions lib/modeler/Linting.js
Original file line number Diff line number Diff line change
Expand Up @@ -24,9 +24,7 @@ export default class Linting {

const element = this._elementRegistry.get(id);

if (element !== this._canvas.getRootElement() && needsScrollToElement(this._canvas, element)) {
this._canvas.scrollToElement(element);
}
this._canvas.scrollToElement(element);

if (element !== this._canvas.getRootElement()) {
this._selection.select(element);
Expand Down Expand Up @@ -108,12 +106,3 @@ Linting.$inject = [
function isLabel(element) {
return !!element.labelTarget;
}

function needsScrollToElement(canvas, element) {
const viewbox = canvas.viewbox();

return viewbox.x > element.x
|| viewbox.y > element.y
|| viewbox.x + viewbox.width < element.x + element.width
|| viewbox.y + viewbox.height < element.y + element.height;
}
57 changes: 46 additions & 11 deletions test/spec/modeler/Linting.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ import elementTemplatesCSS from 'bpmn-js-properties-panel/dist/assets/element-te
import lintingCSS from '../../../assets/linting.css';

import diagramXMLCloud from './linting-cloud.bpmn';
import diagramXMLCloudScroll from './linting-cloud-scroll.bpmn';
import diagramXMLPlatform from './linting-platform.bpmn';

insertCSS('diagram-js.css', diagramCSS);
Expand Down Expand Up @@ -599,6 +600,16 @@ describe('Linting', function() {

describe('canvas scrolling', function() {

beforeEach(createModeler(diagramXMLCloudScroll,
[
zeebePropertiesProviderModule,
cloudElementTemplatesPropertiesProvider
],
{
zeebe: zeebeModdleExtension
})
);

it('should scroll', inject(
function(canvas, linting) {

Expand Down Expand Up @@ -632,13 +643,13 @@ describe('Linting', function() {
));


it('should not scroll', inject(
function(canvas, linting) {
it('should set correct root element (nested task)', inject(
function(canvas, linting, elementRegistry) {

// given
const reports = [
{
id: 'StartEvent_1',
id: 'NestedTask_1',
message: 'foo'
}
];
Expand All @@ -647,26 +658,50 @@ describe('Linting', function() {

linting.activate();

canvas.viewbox({
x: 0,
y: 0,
width: 1000,
height: 1000
});
const scrollToElementSpy = sinon.spy(canvas, 'scrollToElement');

// when
linting.showError(reports[ 0 ]);

// then
expect(scrollToElementSpy).to.have.been.called;
expect(canvas.getRootElement().id).to.eql('SubProcess_1_plane');
}
));


it('should set correct root element (error in root)', inject(
function(canvas, linting, elementRegistry) {

// given
const subProcessPlane = elementRegistry.get('SubProcess_1_plane');

canvas.setRootElement(subProcessPlane);

const reports = [
{
id: 'Process_1',
message: 'foo'
}
];

linting.setErrors(reports);

linting.activate();

const scrollToElementSpy = sinon.spy(canvas, 'scrollToElement');

// when
linting.showError(reports[ 0 ]);

// then
expect(scrollToElementSpy).not.to.have.been.called;
expect(scrollToElementSpy).to.have.been.called;
expect(canvas.getRootElement().id).to.eql('Process_1');
}
));

});


});


Expand Down
94 changes: 94 additions & 0 deletions test/spec/modeler/linting-cloud-scroll.bpmn
Original file line number Diff line number Diff line change
@@ -0,0 +1,94 @@
<?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:dc="http://www.omg.org/spec/DD/20100524/DC" xmlns:zeebe="http://camunda.org/schema/zeebe/1.0" xmlns:di="http://www.omg.org/spec/DD/20100524/DI" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:modeler="http://camunda.org/schema/modeler/1.0" id="Definitions_18k1k7x" targetNamespace="http://bpmn.io/schema/bpmn" exporter="Camunda Modeler" exporterVersion="5.15.0-nightly.20230815" modeler:executionPlatform="Camunda Cloud" modeler:executionPlatformVersion="8.1.0">
<bpmn:process id="Process_1" isExecutable="true">
<bpmn:startEvent id="StartEvent_1">
<bpmn:outgoing>Flow_1m1s8rd</bpmn:outgoing>
</bpmn:startEvent>
<bpmn:exclusiveGateway id="Gateway_0a303iy" default="Flow_0zzdw7g">
<bpmn:incoming>Flow_1m1s8rd</bpmn:incoming>
<bpmn:outgoing>Flow_0zzdw7g</bpmn:outgoing>
<bpmn:outgoing>Flow_192e6hp</bpmn:outgoing>
</bpmn:exclusiveGateway>
<bpmn:sequenceFlow id="Flow_1m1s8rd" sourceRef="StartEvent_1" targetRef="Gateway_0a303iy" />
<bpmn:sequenceFlow id="Flow_0zzdw7g" sourceRef="Gateway_0a303iy" targetRef="ServiceTask_1" />
<bpmn:sequenceFlow id="Flow_192e6hp" sourceRef="Gateway_0a303iy" targetRef="ServiceTask_2">
<bpmn:conditionExpression xsi:type="bpmn:tFormalExpression">=false</bpmn:conditionExpression>
</bpmn:sequenceFlow>
<bpmn:sequenceFlow id="Flow_1fo9xb9" sourceRef="ServiceTask_1" targetRef="ServiceTask_2" />
<bpmn:serviceTask id="ServiceTask_1" name="Foo">
<bpmn:extensionElements>
<zeebe:taskDefinition />
</bpmn:extensionElements>
<bpmn:incoming>Flow_0zzdw7g</bpmn:incoming>
<bpmn:outgoing>Flow_1fo9xb9</bpmn:outgoing>
</bpmn:serviceTask>
<bpmn:serviceTask id="ServiceTask_2" name="Bar">
<bpmn:extensionElements>
<zeebe:taskDefinition type="Foo" />
</bpmn:extensionElements>
<bpmn:incoming>Flow_1fo9xb9</bpmn:incoming>
<bpmn:incoming>Flow_192e6hp</bpmn:incoming>
<bpmn:outgoing>Flow_0jkgznr</bpmn:outgoing>
</bpmn:serviceTask>
<bpmn:endEvent id="EndEvent_1">
<bpmn:incoming>Flow_0jkgznr</bpmn:incoming>
</bpmn:endEvent>
<bpmn:sequenceFlow id="Flow_0jkgznr" sourceRef="ServiceTask_2" targetRef="EndEvent_1" />
<bpmn:subProcess id="SubProcess_1">
<bpmn:task id="NestedTask_1" />
</bpmn:subProcess>
</bpmn:process>
<bpmndi:BPMNDiagram id="BPMNDiagram_1">
<bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="Process_1">
<bpmndi:BPMNShape id="_BPMNShape_StartEvent_2" bpmnElement="StartEvent_1">
<dc:Bounds x="179" y="99" width="36" height="36" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="Gateway_0a303iy_di" bpmnElement="Gateway_0a303iy" isMarkerVisible="true">
<dc:Bounds x="265" y="92" width="50" height="50" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="Activity_0pdefz5_di" bpmnElement="ServiceTask_1">
<dc:Bounds x="370" y="77" width="100" height="80" />
<bpmndi:BPMNLabel />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="Activity_1edwvbs_di" bpmnElement="ServiceTask_2">
<dc:Bounds x="530" y="77" width="100" height="80" />
<bpmndi:BPMNLabel />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="Event_1tut61q_di" bpmnElement="EndEvent_1">
<dc:Bounds x="692" y="99" width="36" height="36" />
</bpmndi:BPMNShape>
<bpmndi:BPMNShape id="Activity_0sltoop_di" bpmnElement="SubProcess_1" isExpanded="false">
<dc:Bounds x="370" y="270" width="100" height="80" />
</bpmndi:BPMNShape>
<bpmndi:BPMNEdge id="Flow_1m1s8rd_di" bpmnElement="Flow_1m1s8rd">
<di:waypoint x="215" y="117" />
<di:waypoint x="265" y="117" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="Flow_0zzdw7g_di" bpmnElement="Flow_0zzdw7g">
<di:waypoint x="315" y="117" />
<di:waypoint x="370" y="117" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="Flow_192e6hp_di" bpmnElement="Flow_192e6hp">
<di:waypoint x="290" y="142" />
<di:waypoint x="290" y="220" />
<di:waypoint x="580" y="220" />
<di:waypoint x="580" y="157" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="Flow_1fo9xb9_di" bpmnElement="Flow_1fo9xb9">
<di:waypoint x="470" y="117" />
<di:waypoint x="530" y="117" />
</bpmndi:BPMNEdge>
<bpmndi:BPMNEdge id="Flow_0jkgznr_di" bpmnElement="Flow_0jkgznr">
<di:waypoint x="630" y="117" />
<di:waypoint x="692" y="117" />
</bpmndi:BPMNEdge>
</bpmndi:BPMNPlane>
</bpmndi:BPMNDiagram>
<bpmndi:BPMNDiagram id="BPMNDiagram_1x2jsch">
<bpmndi:BPMNPlane id="BPMNPlane_1aalxzd" bpmnElement="SubProcess_1">
<bpmndi:BPMNShape id="Activity_13to2li_di" bpmnElement="NestedTask_1">
<dc:Bounds x="200" y="78" width="100" height="80" />
</bpmndi:BPMNShape>
</bpmndi:BPMNPlane>
</bpmndi:BPMNDiagram>
</bpmn:definitions>

0 comments on commit 11668d0

Please sign in to comment.