bpmn-io/bpmn-js

Cannot use `bpmnjs.on` in module constructor when eagerly loaded

Open

#1.624 geöffnet am 23. März 2022

Auf GitHub ansehen
 (5 Kommentare) (0 Reaktionen) (0 zugewiesene Personen)JavaScript (1.249 Forks)batch import
backlogbuggood first issuepr welcomespring cleaning

Repository-Metriken

Stars
 (7.739 Stars)
PR-Merge-Metriken
 (Durchschn. Merge 17h 6m) (4 gemergte PRs in 30 T)

Beschreibung

Describe the Bug

Given I have a module of the following structure:

const module = {
  __init__: [ 'custom' ],
  custom: [ 'type', Custom ]
}

function Custom(bpmnjs) {
  bpmnjs.on('diagram.init' /** can be any event */, () => console.log('hello.world'))
}

when I load it to bpmn-js, I get an error similar to the one below:

TypeError: this.get is not a function
    at Modeler.BaseViewer.on (BaseViewer.js?b392:559:1)
    at new ExecutionPlatform (execution-platform.js?5062:41:1)

This is due to injector (and modules) being instantiated before Diagram#get API is defined, cf. https://github.com/bpmn-io/diagram-js/blob/develop/lib/Diagram.js#L139 The BaseViewer tries to get the EventBus but get is not available yet.

Steps to Reproduce

See above.

Expected Behavior

No error. We could move the API declaration to the root of the module and use Diagram.prototype.get, but I haven't tested that.

Environment

  • Browser: [e.g. IE 11, Chrome 69]
  • OS: [e.g. Windows 7]
  • Library version: [e.g. 2.0.0]

Contributor Guide

Research-Richtung
Der Fehler tritt auf, weil `Diagram#get` noch nicht definiert ist, wenn die Modulkonstruktoren aufgerufen werden. Zur Behebung überprüfe die Initialisierungsreihenfolge in `Diagram.js` (Zeile 139) und `BaseViewer.js` (Zeilen 558-559). Ein möglicher Ansatz ist, die API Deklaration (wie `get`) früher im Konstruktor zu verschieben oder `Diagram.prototype.get` zu verwenden, bevor der Injector vollständig eingerichtet ist. Überprüfe verknüpfte PRs oder Kommentare für weiteren Kontext.
Tech Stack
javascript
Domain
frontend
Issue Type
Fehler
SchwierigkeitGeschätzte Implementierungsschwierigkeit für neue Contributors, von 1 für sehr kleine Änderungen bis 5 für Expertenarbeit.
3
Geschätzte ZeitEin grober Zeitrahmen, um zu recherchieren, zu implementieren, zu testen und einen Pull Request vorzubereiten.
Halber Tag
AktivitätsstatusWie verfügbar das Issue gerade wirkt: frisch, aktiv, stale, blockiert oder wartet auf Maintainer-Input.
Veraltet
KlarheitWie klar das Issue die erwartete Änderung, Akzeptanzkriterien und den nächsten Schritt erklärt.
Meist klar
Voraussetzungen
Understanding of bpmn js module systemJavaScript
EinsteigerfreundlichkeitEin Score von 1 bis 100, der schätzt, wie zugänglich dieses Issue für First-Time Contributors ist.
30