fix: variable name changes when element name/label changes

Closes #863

packages/dmn-js-drd/src/features/modeling/behavior/index.js

@@ -4,17 +4,20 @@ import ReplaceConnectionBehavior from './ReplaceConnectionBehavior';
 import ReplaceElementBehavior from './ReplaceElementBehavior';
 import IdChangeBehavior from
   'dmn-js-shared/lib/features/modeling/behavior/IdChangeBehavior';
-
+import NameChangeBehavior from
+  'dmn-js-shared/lib/features/modeling/behavior/NameChangeBehavior';
 export default {
   __init__: [
     'createConnectionBehavior',
     'idChangeBehavior',
+    'nameChangeBehavior',
     'layoutConnectionBehavior',
     'replaceConnectionBehavior',
     'replaceElementBehavior'
   ],
   createConnectionBehavior: [ 'type', CreateConnectionBehavior ],
   idChangeBehavior: [ 'type', IdChangeBehavior ],
+  nameChangeBehavior: [ 'type', NameChangeBehavior ],
   layoutConnectionBehavior: [ 'type', LayoutConnectionBehavior ],
   replaceConnectionBehavior: [ 'type', ReplaceConnectionBehavior ],
   replaceElementBehavior: [ 'type', ReplaceElementBehavior ]

packages/dmn-js-drd/src/features/replace/DrdReplace.js

@@ -59,8 +59,11 @@ export default function DrdReplace(drdFactory, replace, selection, modeling) {
     }
 
     if (target.expression) {
+
+      // variable set to element name
       var literalExpression = drdFactory.create('dmn:LiteralExpression'),
-          variable = drdFactory.create('dmn:InformationItem');
+          variable = drdFactory.create('dmn:InformationItem',
+            { name: oldBusinessObject.name });
 
       setBoxedExpression(newBusinessObject, literalExpression, drdFactory, variable);
     }

packages/dmn-js-drd/test/spec/features/modeling/behavior/NameChangeBehaviorSpec.js

@@ -0,0 +1,37 @@
+import { bootstrapModeler, inject } from 'test/helper';
+
+import simpleStringEditXML from './name-change-behavior.dmn';
+
+import CoreModule from 'src/core';
+import Modeling from 'src/features/modeling';
+
+
+describe('NameChangeBehavior', function() {
+
+  describe('with label change', function() {
+
+    beforeEach(bootstrapModeler(simpleStringEditXML, {
+      modules: [
+        CoreModule,
+        Modeling
+      ],
+    }));
+
+
+    it('should update variable name when label is changed', inject(
+      function(modeling, elementRegistry) {
+
+        // given
+        const decision = elementRegistry.get('season'),
+              bo = decision.businessObject,
+              variable = bo.variable;
+
+        // when
+        modeling.updateLabel(decision,'foo');
+
+        // then
+        expect(variable.get('name')).to.equal('foo');
+      }
+    ));
+  });
+});

packages/dmn-js-drd/test/spec/features/modeling/behavior/name-change-behavior.dmn

@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<definitions xmlns="https://www.omg.org/spec/DMN/20191111/MODEL/" xmlns:dmndi="https://www.omg.org/spec/DMN/20191111/DMNDI/" xmlns:dc="http://www.omg.org/spec/DMN/20180521/DC/" xmlns:di="http://www.omg.org/spec/DMN/20180521/DI/" id="dish" name="Desired Dish" namespace="party" exporter="Camunda Modeler" exporterVersion="5.11.0">
+  <decision id="season" name="Season">
+    <variable id="InformationItem_16229yj" name="season" typeRef="string" />
+    <informationRequirement id="InformationRequirement_13flr3u">
+      <requiredInput href="#InputData_0wikdil" />
+    </informationRequirement>
+    <literalExpression id="LiteralExpression_0hs8xyn">
+      <text>calendar.getSeason(date)</text>
+    </literalExpression>
+  </decision>
+  <inputData id="InputData_0wikdil" name="Variable" />
+  <dmndi:DMNDI>
+    <dmndi:DMNDiagram>
+      <dmndi:DMNShape dmnElementRef="season">
+        <dc:Bounds height="55" width="100" x="150" y="80" />
+      </dmndi:DMNShape>
+      <dmndi:DMNShape id="DMNShape_1ds1jom" dmnElementRef="InputData_0wikdil">
+        <dc:Bounds height="45" width="125" x="138" y="198" />
+      </dmndi:DMNShape>
+      <dmndi:DMNEdge id="DMNEdge_0qwszuo" dmnElementRef="InformationRequirement_13flr3u">
+        <di:waypoint x="201" y="198" />
+        <di:waypoint x="200" y="155" />
+        <di:waypoint x="200" y="135" />
+      </dmndi:DMNEdge>
+    </dmndi:DMNDiagram>
+  </dmndi:DMNDI>
+</definitions>

packages/dmn-js-literal-expression/src/features/modeling/index.js

@@ -1,12 +1,14 @@
 import CommandStack from 'diagram-js/lib/command/CommandStack';
 import IdChangeBehavior from
   'dmn-js-shared/lib/features/modeling/behavior/IdChangeBehavior';
-
+import NameChangeBehavior from
+  'dmn-js-shared/lib/features/modeling/behavior/NameChangeBehavior';
 import Modeling from './Modeling';
 
 export default {
-  __init__: [ 'idChangeBehavior', 'modeling' ],
+  __init__: [ 'idChangeBehavior', 'nameChangeBehavior', 'modeling' ],
   commandStack: [ 'type', CommandStack ],
   idChangeBehavior: [ 'type', IdChangeBehavior ],
+  nameChangeBehavior: [ 'type', NameChangeBehavior ],
   modeling: [ 'type', Modeling ]
 };

packages/dmn-js-literal-expression/test/spec/features/modeling/behavior/NameChangeBehaviorSpec.js

@@ -0,0 +1,37 @@
+import { bootstrapModeler, inject } from 'test/helper';
+
+import simpleStringEditXML from '../../../literal-expression.dmn';
+
+import CoreModule from 'src/core';
+import Modeling from 'src/features/modeling';
+
+
+describe('NameChangeBehavior', function() {
+
+  describe('with existing variable', function() {
+
+    beforeEach(bootstrapModeler(simpleStringEditXML, {
+      modules: [
+        CoreModule,
+        Modeling
+      ],
+    }));
+
+
+    it('should update variable name when element name is changed', inject(
+      function(modeling, viewer) {
+
+        // given
+        const decision = viewer.getDecision();
+
+        // when
+        modeling.editDecisionName('foo');
+
+        // then
+        const variable = decision.get('variable');
+
+        expect(variable.get('name')).to.equal('foo');
+      }
+    ));
+  });
+});

packages/dmn-js-shared/src/features/modeling/behavior/NameChangeBehavior.js

@@ -0,0 +1,78 @@
+import CommandInterceptor from 'diagram-js/lib/command/CommandInterceptor';
+
+import {
+  getBusinessObject,
+  is
+} from 'dmn-js-shared/lib/util/ModelUtil';
+
+
+export default class NameChangeBehavior extends CommandInterceptor {
+
+  static $inject = [ 'eventBus', 'modeling' ];
+
+  constructor(eventBus, modeling) {
+    super(eventBus);
+
+    this._modeling = modeling;
+
+    this.postExecuted('element.updateProperties', this.updateVariableFromElement);
+    this.postExecuted('element.updateLabel', this.updateVariableFromLabel);
+  }
+
+  updateVariableFromLabel = ({ context }) => {
+    const { element, newLabel } = context;
+    const bo = getBusinessObject(element);
+    if (!bo.variable) {
+      return;
+    }
+    bo.variable.name = newLabel;
+    this._modeling.updateProperties(element, { variable: bo.variable });
+  };
+
+  updateVariableFromElement = ({ context }) => {
+    const { element, properties } = context;
+
+    if (!(is(element, 'dmn:Decision') || is(element, 'dmn:BusinessKnowledgeModel'))) {
+      return;
+    }
+
+    if (!this.isNameChanged(properties)) {
+      return;
+    }
+    if (this.isVariable(element)) {
+      return;
+    }
+    else if (!this.isElementVariable(element)) {
+      this.syncElementVariableChange(element);
+    }
+  };
+
+  isNameChanged(properties) {
+    return 'name' in properties;
+  }
+
+  isVariable(element) {
+    const parent = getParent(element);
+
+    return (
+      is(element, 'dmn:InformationItem') &&
+      parent && parent.get('variable') === element
+    );
+  }
+
+  isElementVariable(element) {
+    const variable = element.get('variable');
+    return variable && (element.name === variable.name);
+  }
+
+  syncElementVariableChange(element) {
+    const newName = element.get('name');
+    this._modeling.editVariableName(newName);
+  }
+}
+
+// helpers //////////////////////
+
+function getParent(element) {
+  return element.$parent;
+}