refactor: reworked Camunda Modeler plugin code

camunda-modeler-plugin/main/bpmndt/ModelerExtension.js

@@ -1,27 +1,39 @@
 import { PureComponent } from "camunda-modeler-plugin-helpers/react";
 
-import pluginTabState from "./PluginTabState";
+import PluginState from "./PluginState";
 
 /**
- * Extension, which runs outside of BPMN JS to be able to subscribe to tab change events.
+ * Extension, which runs outside of BPMN JS to be able to manage the different plugin instances.
  */
 export default class ModelerExtension extends PureComponent {
   constructor(props) {
     super(props);
 
-    this.props.subscribe("app.activeTabChanged", (event) => {
-      const { activeTab } = event;
+    this.pluginState = new PluginState();
 
+    // handle tab changes
+    props.subscribe("app.activeTabChanged", (event) => {
+      const { activeTab } = event;
       if (activeTab.type === "bpmn") {
-        pluginTabState.setActiveTab(activeTab.id);
+        this.pluginState.showPlugin(activeTab.id);
       } else {
-        pluginTabState.disablePlugin();
+        this.pluginState.hidePlugin();
       }
     });
+
+    // register plugin, when BPMN modeler was created
+    props.subscribe("bpmn.modeler.created", (event) => {
+      const { modeler, tab } = event;
+
+      const plugin = modeler.get("bpmndt");
+      plugin.unregister = this.pluginState.unregisterPlugin.bind(this.pluginState, tab.id);
+
+      this.pluginState.registerPlugin(tab.id, plugin);
+    });
   }
 
   render() {
-    // not needed for this kind of extension
+    // currently not needed
     return null;
   }
 }

camunda-modeler-plugin/main/bpmndt/PathFinder.js

@@ -11,8 +11,8 @@ import {
  * Class to find possible paths through a BPMN process.
  */
 export default class PathFinder {
-  constructor(options) {
-    this.elementRegistry = options.elementRegistry;
+  constructor(elementRegistry) {
+    this.elementRegistry = elementRegistry;
   }
 
   /**

camunda-modeler-plugin/main/bpmndt/PathMarker.js

@@ -1,32 +1,37 @@
 import { MARKER_ERROR } from "./constants";
 
 export default class PathMarker {
-  constructor(options) {
-    this.canvas = options.canvas;
-    this.elementRegistry = options.elementRegistry;
+  constructor(canvas, elementRegistry) {
+    this.canvas = canvas;
+    this.elementRegistry = elementRegistry;
 
-    this._markers = [];
+    this.markers = [];
   }
 
   mark(markers) {
-    this.unmark();
+    this.removeAll();
 
     for (const marker of markers) {
-      this._markers.push(marker);
+      this.markers.push(marker);
       this._add(marker);
     }
   }
 
   markError() {
-    const marker = this._markers[this._markers.length - 1];
+    const marker = this.markers[this.markers.length - 1];
     this._remove(marker);
+
+    // in case of migration, a light blue marker may already exist
+    // it must be removed first, otherwise the error marker will not become visible
+    this._remove(this.markers.find(m => m.id == marker.id));
+
     marker.style = MARKER_ERROR;
     this._add(marker);
   }
 
-  unmark() {
-    while (this._markers.length > 0) {
-      const marker = this._markers.pop();
+  removeAll() {
+    while (this.markers.length > 0) {
+      const marker = this.markers.pop();
       this._remove(marker);
     }
   }

camunda-modeler-plugin/main/bpmndt/PathValidator.js

@@ -9,9 +9,9 @@ import { pathEquals } from "./functions";
 import PathFinder from "./PathFinder";
 
 export default class PathValidator {
-  constructor(options) {
-    this.elementRegistry = options.elementRegistry;
-    this.pathFinder = new PathFinder(options);
+  constructor(elementRegistry) {
+    this.elementRegistry = elementRegistry;
+    this.pathFinder = new PathFinder(elementRegistry);
   }
 
   validate(testCase) {