template-design not working in firefox

[AdamD2L]

Describe the bug

Text fields are not working in the https://pdfme.com/template-design in firefox

To Reproduce

go to https://pdfme.com/template-design Create a text field Try to enter text in the text field

Expected behavior

Text field displays text

Your Environment

- firefox 123.0 64 bits

Your Error Log

Uncaught (in promise) DOMException: An invalid or illegal string was specified
    ui https://pdfme.com/assets/js/43b07d87.03c35d38.js:1

Additional context

Quite urgent ... makes the tool quite unsusable for many users :-(

[valushagrinchik]

The same as #399

[valushagrinchik]

textBlock.contentEditable = 'true' instead of textBlock.contentEditable = 'plaintext-only' in packages/schemas/src/text/uiRender.ts:120 should help

[hand-dot]

Hey @valushagrinchik Thank you for the investigation.

The reason for setting textBlock.contentEditable = 'plaintext-only' is to prevent styles from being pasted with the text. You are right. It seems it doesn't work in Firefox.

Let's think about a workaround. The scope of the fix should be small, so it shouldn't be hard to resolve this issue.

Do you have any ideas?

[valushagrinchik]

Ok, so that we need to also overwrite paste event to get text-only from user input

    textBlock.addEventListener('paste', (e: ClipboardEvent) => {
      e.preventDefault();
      const paste = e.clipboardData?.getData('text');
      const selection = window.getSelection();
      if (!selection?.rangeCount) return;
      selection.deleteFromDocument();
      selection.getRangeAt(0).insertNode(document.createTextNode(paste || ''));
      selection.collapseToEnd();
    });

[hand-dot]

Thanks @valushagrinchik

Can you create PR?

[valushagrinchik]

@hand-dot Yes, sure, PR is ready #444

[hand-dot]

@AdamD2L @valushagrinchik The latest version of pdfme should work correctly on Firefox. Can you check it and close the issue if there are no problems?

[github-actions[bot]]

This issue has been automatically marked as stale because it has been open 30 days with no activity after answered. Remove stale label or comment or this issue will be closed in 7 days.

[github-actions[bot]]

This issue was automatically closed because of stale in 7 days