Problem overriding the fire method of the event bus

Developers
1

Hello all!

I need to catch a both click, double-click as well as element-changed events in any object of a BPMN diagram. I did what was suggested in this link:

Now, I am able to get all the events, but when I get a shape from the palette into the canvas and try to connect it to any other shape in the diagram, I get this error:

“no shape type specified”

However, this problem does not happen when I add a shape from those that show when you click an element in the diagram.

I did some testing in the sanbox (https://codesandbox.io/s/bpmn-js-log-events-h3d94) and the same problem happens.

This is the stack trace of the error:

Uncaught Error: no shape type specified
at ElementFactory.createBpmnElement (ElementFactory.js:37)
at ElementFactory.create (ElementFactory.js:29)
at ElementFactory.createConnection (ElementFactory.js:21)
at ConnectionPreview.getConnection (ConnectionPreview.js:76)
at eval (ConnectionPreview.js:28)
at eval (ConnectionPreview.js:106)
at ConnectionPreview.drawPreview (ConnectionPreview.js:32)
at eval (ConnectPreview.js:15)
at invokeFunction (EventBus.js:201)
at EventBus._invokeListener (EventBus.js:126)
at EventBus._invokeListeners (EventBus.js:118)
at EventBus.fire (EventBus.js:93)
at EventBusLogger.eventBus.fire (index.js:27)
at fire (Dragging.js:44)
at HTMLDocument.move (Dragging.js:88)

And finally:

Uncaught ReferenceError: keyEventHandler is not defined
at s.onkeydown (sandbox.8fe7e72a2.js:1)

Is it necessary to handle something else?

Any help would by appreciated!

4

I’ve changed your code in two places and it seems to work correctly now:

  1. Instead of arrow function, use plain function to have access to arguments. EventBus#fire allows additional arguments as you can read in the JSDoc.
  2. Return the original EventBus#fire result as in the original API. We use it in several places with Rules and CopyPaste among them.
class EventBusLogger {
  constructor(eventBus) {
    const originalFire = eventBus.fire;

    eventBus.fire = function (type, data) {
      console.log(type, data);

      return originalFire.apply(eventBus, arguments);
    };
  }
}

CodeSandbox with changes

5

Thank you, barmac!

it worked great!

1 Like