Element.dblclick is not work fluently

I change the stroke color when the element be selected, but it will make dblclick hard to trigger. May be the reason is the “selection.changed” did not finish in the first click, and when I secondly click the same element it will trigger “selection.changed” again. Then it makes a conflict. I wonder how to solve it? Thanks!

my code is like this:

modeler.get("eventBus").on("selection.changed", (e) => {
  const { newSelection, oldSelection } = e;
  newSelection[0] &&
    modeler.get("modeling").setColor(newSelection[0], { stroke: "blue" });
  oldSelection[0] &&
    modeler.get("modeling").setColor(oldSelection[0], { stroke: "black" });

modeler.get("eventBus").on("element.dblclick", (e) => {
  console.log("trigger dbclick");

How does it make dblclick hard to trigger? In the codesandox I had no issues with double click. Can you please clarify?

Try to dbclick the connection and you will find the issue. Each time you dbclick the connection, the console may not have output.

@kelly Changing the element does re-draw it. This may lead to the browsers not handling double-click reliably.

when I secondly click the same element it will trigger “selection.changed” again.

That is the issue and we’d need to fix it.

Thanks! I wonder if this issue will be fixed in version 8.x?
I now achieve my purpose in some complicated way. But I hope that it can be implemented in a normal way in the future. If possible, I hope that I can let you know when it is fixed. Thank you very much for your help!

I guess it is best if you open an issue in the bpmn-js library, attach your sandbox, and we’ll be able to take it from there:

@nikku Hi, can you check this issue? And I sincerely hope your guys can discuss this issue again, which now closed by barmac. Eventhough I’ve done it with my way, but it is too complex and not elegant.