Spacebar Not Working in Inline Text Editor for bpmn2.Activity Shape

[RichikaKR]

Current versus expected behaviour

When using the inline text editor for the bpmn2.Activity shape in JointJS, pressing the spacebar does not insert a space. This issue prevents users from adding spaces between words, which is essential for proper text formatting. Additionally, sometimes the input behaves erratically.

Steps to reproduce

1. Add keyboard event linstener.
   
2. Insert Activity.
3. Click activity then press f2 to open inline text editor.
4. Trying edit activity's label/text. but space bar is not working. Additionally, sometimes the input behaves erratically.

• Learn - Inline text editing(v4.0) is have same problem.
  

Version

JointJS+ 4.0.1

What browsers are you seeing the problem on?

Chrome, Microsoft Edge

What operating system are you seeing the problem on?

Windows

[kumilingus]

This is related to the textWrap issue.

Note there is preserveSpaces option that will prevent spaces from collapsing, but you will still face problems caused by text wrapping.

[goyaljai1]

A simple workaround is to remove the textWrap property from the Activity shape when it is dropped onto the graph from the stencil.

Here's an example of how you can implement this in the initializeStencil function:

initializeStencil() {
    // Listen for the 'element:drop' event on the stencil
    stencilService.stencil.on('element:drop', (elementView: joint.dia.ElementView) => {
        // Check if the dropped element is of the BPMN2 type
        const elementType = elementView.model.get('type');
        if (elementType && elementType.includes('bpmn2')) {
            // Remove the 'textWrap' property to address the issue
            elementView.model.removeAttr('label/textWrap');
        }

        // Reset the selection to the dropped element
        this.selection.collection.reset([elementView.model]);
    });
}

NOTE:
By removing the textWrap property, the text associated with the Activity shape will no longer remain confined within the shape, potentially overflowing outside of it. If preserving text wrapping is essential, consider exploring alternative fixes for this issue.