camunda-transaction-boundaries

Visualize Camunda transaction boundaries within a bpmn-js rendered diagram

Usage no npm install needed!

<script type="module">
  import camundaTransactionBoundaries from 'https://cdn.skypack.dev/camunda-transaction-boundaries';
</script>

README

Looking for the Camunda Modeler plug-in? Find it here.

As of version 1.0.0 this library exposes ES modules. Use an ES module aware bundler such as Webpack or Rollup to bundle it for the browser.

camunda-transaction-boundaries

CI

A bpmn-js extension to visualize transaction boundaries, applied by Camunda.

transaction boundaries screenshot

Features

Visualize all transaction boundaries in a BPMN diagram.

This includes all BPMN elements that are wait states and have a boundary for incoming connections:

  • Intermediate Catching Message Event
  • Intermediate Catching Timer Event
  • Intermediate Catching Signal Event
  • Receive Task
  • User Task
  • Event Based Gateway
  • External Service Task

In addition to these elements all activities with asynchronous continuations act as transaction boundaries. This is also valid for multi-instance activities. Learn more about transactions and wait states in the Camunda documentation.

Usage

Extend the bpmn-js modeler with the transaction boundaries module:

import BpmnModeler from 'bpmn-js/lib/Modeler';

import transactionBoundariesModule from 'camunda-transaction-boundaries';

var canvas = $('#js-canvas');

var bpmnModeler = new BpmnModeler({
  container: canvas,
  additionalModules: [
    transactionBoundariesModule
  ]
});

bpmnModeler.importXML(xml, function(err) {

  if (err) {
    return console.error(err);
  }

  var transactionBoundaries = bpmnModeler.get('transactionBoundaries');

  transactionBoundaries.show();
});

Please see this example for a more detailed instructions.

Test

npm install
npm test

License

MIT