How to do addEventListener in CustomContextPad.js?

Hello,
instead of adding an element, I want to call a function within the contextPad. So, when you click on a task, over the contextPad appears (a transaction symbol) and when you click on it not an object is added but a function is called. Now, I get an error-message with the function modeling.updateProperties that the element is missing. How could I fix that.
The entire code is below:

import {
  is
} from 'bpmn-js/lib/util/ModelUtil';

import {
  assign,
  forEach,
  isArray
} from 'min-dash';

import { getBusinessObject } from 'bpmn-js/lib/util/ModelUtil';
import { modeling } from '../app.js';

export default class CustomContextPad {
  constructor(bpmnFactory,config, contextPad, create, elementFactory, injector, translate) {
    this.bpmnFactory = bpmnFactory;
    this.create = create;
    this.elementFactory = elementFactory;
    this.translate = translate;

    if (config.autoPlace !== false) {
      this.autoPlace = injector.get('autoPlace', false);
    }

    contextPad.registerProvider(this);
  }

  getContextPadEntries(element) {
    const {
      autoPlace,
      bpmnFactory,
      create,
      elementFactory,
      translate
    } = this;
	
	var actions = {};
	var businessObject = element.businessObject;

  const ST = document.getElementById('ST');
  const formST = document.getElementById('formST');
  const bc = document.getElementById('bc');
  const ti = document.getElementById('ti');
  
  function openContextMenu(element) {
    const businessObject = getBusinessObject(element);
      const { bpmnType } = businessObject;
      const { BusinessContext } = businessObject;
      const { TaskName } = businessObject;
      const { BusinessContext_Id } = businessObject;
      const { TaskId } = businessObject;
      if(bpmnType == "bpmn:SemanticTask") {
        if(BusinessContext !== undefined) {
          bc.text = BusinessContext;
          bc.value = BusinessContext_Id;
          ti.text = TaskName;
          ti.value = TaskId;
        }
        ST.classList.remove('hidden'); 
      }
  }

  formST.addEventListener('submit', (event) => {
    event.preventDefault();
    event.stopPropagation();

    ({ element } = event);

    modeling.updateProperties(element, {
      BusinessContext_Id: bc.value,
      BusinessContext: bc.options[bc.selectedIndex].text,
      TaskName: ti.options[ti.selectedIndex].text,
      TaskId: ti.value
    });

    ST.classList.add('hidden');
  });

    function appendServiceTask(event, element) {
      if (autoPlace) {
        const shape = elementFactory.createShape({ type: 'bpmn:Transaction' });
  
        autoPlace.append(element, shape);
      } else {
        appendServiceTaskStart(event, element);
      }
    }

    function appendServiceTaskStart(event) {
      const shape = elementFactory.createShape({ type: 'bpmn:Transaction' });
      create.start(event, shape, element);
    }

    function appendSemanticTask(bpmnType) {
      return function(event, element) {
        if (autoPlace) {
          const businessObject = bpmnFactory.create('bpmn:Task');
          businessObject.bpmnType = bpmnType;
          const shape = elementFactory.createShape({
            type: 'bpmn:Task',
            businessObject: businessObject
          });
    
          autoPlace.append(element, shape);
        } else {
          appendSemanticTaskStart(event, element);
        }
      }
    }

    function appendSemanticTaskStart(bpmnType) {
      return function(event) {
        const businessObject = bpmnFactory.create(SystemType);
        businessObject.bpmnType = bpmnType;
        const shape = elementFactory.createShape({
          type: 'bpmn:Task',
          businessObject: businessObject
        });
        create.start(event, shape, element);
      }
    }

	function TaskStart(event) {
      if (autoPlace) {
        const shape = elementFactory.createShape({ type: 'bpmn:Task' });
  
        autoPlace.append(element, shape);
      } else {
        appendTaskStart(event, element);
      }
    }
	function appendTaskStart(event) {
      const shape = elementFactory.createShape({ type: 'bpmn:Task' });
      create.start(event, shape, element);
    }
	
	if (is(businessObject, 'bpmn:Transaction')) {
		assign(actions, {
		'append.service-task': {
			group: 'artifact',
			className: 'bpmn-icon-task',
			title: translate('Append Task'),
			action: {
			click: TaskStart,
			dragstart: appendTaskStart
			}
    }
  });
  assign(actions, {
    'append.semantic-task': {
      group: 'artifact',
      className: 'bpmn-icon-transaction SemanticTask',
      title: translate('Append SemanticTask'),
      action: {
      click: appendSemanticTask('bpmn:SemanticTask'),
      dragstart: appendSemanticTaskStart('bpmn:SemanticTask')
      }
    }
  });
  }
  if(is(businessObject, 'bpmn:ExclusiveGateway')) {
    assign(actions, {
      'append.semantic-task': {
        group: 'artifact',
        className: 'bpmn-icon-transaction SemanticTask',
        title: translate('Append SemanticTask'),
        action: {
        click: appendSemanticTask('bpmn:SemanticTask'),
        dragstart: appendSemanticTaskStart('bpmn:SemanticTask')
        }
      }
    });
  }
	
	if (is(businessObject, 'bpmn:Task')) {
		assign(actions, {
		'append.service-task': {
			group: 'artifact',
			className: 'bpmn-icon-transaction AssistanceSystem',
			title: translate('Append AssistanceSystem'),
			action: {
			click: appendServiceTask,
			dragstart: appendServiceTaskStart
			}
		}
    });
    assign(actions, {
      'append.semantic-task': {
        group: 'artifact',
        className: 'bpmn-icon-transaction SemanticTask',
        title: translate('Append SemanticTask'),
        action: {
        click: appendSemanticTask('bpmn:SemanticTask'),
        dragstart: appendSemanticTaskStart('bpmn:SemanticTask')
        }
      }
    });
    assign(actions, {
      'append.semantic-task': {
        group: 'artifact',
        className: 'bpmn-icon-transaction',
        title: translate('Open ContextMenu'),
        action: {
        click: openContextMenu,
        dragstart: openContextMenu
        }
      }
    });
	}
	return actions;
  }
}

CustomContextPad.$inject = [
  'bpmnFactory',
  'config',
  'contextPad',
  'create',
  'elementFactory',
  'injector',
  'translate'
];

this part gives the error, that element variable is missing:

modeling.updateProperties(element, {
      BusinessContext_Id: bc.value,
      BusinessContext: bc.options[bc.selectedIndex].text,
      TaskName: ti.options[ti.selectedIndex].text,
      TaskId: ti.value
    });

and this is the part, that calls the function:

assign(actions, {
      'append.semantic-task': {
        group: 'artifact',
        className: 'bpmn-icon-transaction',
        title: translate('Open ContextMenu'),
        action: {
        click: openContextMenu,
        dragstart: openContextMenu
        }
      }
    });