Custom Components running in a different scope


I am using the bundled Modeler, and I am trying to customize Pallete and ContextPad. I got the example from source code to use, as below, however it seems it is not being called using the same scope from Modeler, which means I cannot call any functions used internally. Is there a way to force this Custom being called on internal scope??

  function CustomContextPadProvider(contextPad) {
    this.getContextPadEntries = function(element) {
      // no entries, effectively disable the context pad

//HERE --> If I cope the same code from ContextPadProvider, I get errors calling isAny, is, or any other functions

      return {};
  CustomContextPadProvider.$inject = [ 'contextPad' ];
  var overrideModule = {
    contextPadProvider: [ 'type', CustomContextPadProvider ]
  var bpmnModeler = new Modeler({ additionalModules: [ overrideModule ]});

Any ideas? I need to customize both Pallete and context pad, but I don’t see a way without accessing internal context to use variables and functions.

If you’d like to access internal helpers via require('some-path') you would need to create your own Browserify bundle. You cannot access these path from the pre-bundled version of the library.

Your example as posted should work out of the box as long as you do not rely on internal components.


if you just want to add only one or more tools to the context menu, just register a “CustomContextProvider” like below:

 var modeler = new BpmnJS({
    container: '#modelerCanvas'
var contextPad = modeler.get('contextPad');
function CustomContextPadProvider(contextPad) {
        this.getContextPadEntries = function (element) {
            //Every object variable is a new "action"
            return {
                'editServer' : {
                    group : "edit",
                    className : "bpmn-icon-sequential-mi-marker",
                    title: "Configuration",
                    action : {
                        click : function () {
                           //Do your logic here
new CustomContextPadProvider(contextPad);
1 Like