bpmn-io / bpmn-js

A BPMN 2.0 rendering toolkit and web modeler.
https://bpmn.io/toolkit/bpmn-js/
Other
8.35k stars 1.29k forks source link

Copy and paste between different browser windows #1709

Open nikku opened 1 year ago

nikku commented 1 year ago

Is your feature request related to a problem? Please describe.

As a user I want to copy and paste parts of my diagram between different browser/app windows.

Use case: Have multiple diagrams opened in different tabs, but also have diagrams opened in different bpmn-js based applications (Camunda Modeler, Camunda Web Modeler, bpmn.io demo).

Describe the solution you'd like

Describe alternatives you've considered

None.

Additional context

The web platform provides clipboard API as well as copy events we may be able to hook into.

On the bpmn-js side we'd need to ensure our copy/paste implementation is side-effect free, and the copied tree is serializable.


Depends on https://github.com/bpmn-io/diagram-js/pull/659.

nikku commented 1 year ago

Investigating this issue we found a couple of copy and paste related issues: https://github.com/bpmn-io/bpmn-js/issues/1708.

nikku commented 1 year ago

A poor mans version of this feature can be implemented following along the bpmn-js-copy-paste-example.

It has the following limitations:

nikku commented 1 year ago

We were not able to follow up on the required changes to make browser native focus handling + copy/paste available across all our toolkits (https://github.com/bpmn-io/internal-docs/issues/614#issuecomment-1220481826).

BricePissard commented 1 year ago

It seems that the problem comes from the breaking change of passing to the bpmn-js version 11.0.0 using the 3rd party library to handle the keyboard: https://www.npmjs.com/package/keyboardevent-key-polyfill

This library is instantiated at the page load but not updated while changing tabs or windows. The method keyboardeventKeyPolyfill.polyfill() should be called each time a BPMN Diagram is rendered (?).

The problem is not yet fixed, but it would be nice if someone from BPMN.io look at it more carefully.