fix: do not show local task variables in the autocompletion

Closes #58

Author: jarekdanielak

lib/ElementVariables.js

@@ -1,5 +1,7 @@
 import EventEmitter from 'events';
 
+import { is } from 'bpmn-js/lib/util/ModelUtil';
+
 export class ElementVariables extends EventEmitter {
   constructor(injector) {
     super();
@@ -27,8 +29,10 @@ export class ElementVariables extends EventEmitter {
         return [];
       });
 
-    this._variables[element.id] = variables;
+    const processVariables = variables.filter(({ scope }) => is(scope, 'bpmn:Process'));
+
+    this._variables[element.id] = processVariables;
 
-    return variables;
+    return processVariables;
   }
 }

lib/components/Input/InputEditor.jsx

@@ -17,6 +17,8 @@ import theme from '../shared/CodeMirrorTheme';
 
 import { getAutocompletionExtensions } from '../../utils/autocompletion';
 
+import { SCOPES } from '../../TaskExecution';
+
 const fromPropAnnotation = Annotation.define();
 
 const autocompletionCompartment = new Compartment();
@@ -203,7 +205,11 @@ function getAllOutputVariables(allOutputs) {
           return;
         }
 
-        const { name, value } = /** @type {Object} */ (variable);
+        const { name, value, scope } = /** @type {Object} */ (variable);
+
+        if (scope !== SCOPES.PROCESS) {
+          return;
+        }
 
         allOutputVariables.push({ name, value, origin: elementId });
       });

test/components/Input/InputEditor.spec.js

@@ -9,6 +9,8 @@ import InputEditor, { PLACEHOLDER_TEXT, INVALID_JSON_ERROR } from '../../../lib/
 
 import diagramXML from '../../fixtures/InputEditor.bpmn';
 
+import { SCOPES } from '../../../lib/TaskExecution';
+
 describe('InputEditor', function() {
 
   beforeEach(bootstrapModeler(diagramXML));
@@ -79,19 +81,22 @@ describe('InputEditor', function() {
           variables: {
             1: {
               name: 'foo',
-              value: '1'
+              value: '1',
+              scope: SCOPES.PROCESS
             },
             2: {
               name: 'bar',
-              value: '2'
+              value: '2',
+              scope: SCOPES.LOCAL
             },
           }
         },
         'ServiceTask_2': {
           variables: {
             3: {
               name: 'foo',
-              value: '3'
+              value: '3',
+              scope: SCOPES.PROCESS
             },
           }
         }
@@ -110,11 +115,10 @@ describe('InputEditor', function() {
       await waitFor(() => {
         const completionLabels = Array.from(container.querySelectorAll('.cm-completionLabel')).map(el => el.textContent);
 
-        expect(completionLabels.length).to.eql(3);
+        expect(completionLabels.length).to.eql(2);
 
-        expect(completionLabels[0]).to.eql('bar');
+        expect(completionLabels[0]).to.eql('foo');
         expect(completionLabels[1]).to.eql('foo');
-        expect(completionLabels[2]).to.eql('foo');
 
         const completionInfos = Array.from(container.querySelectorAll('.cm-completionInfo .info span')).map(el => el.textContent);