prosemirror/prosemirror-view
1
2
Fork 0
Code Pull requests Activity

Fix a bug that input value disappears when using IME in Safari #184

Closed
usualoma wants to merge 1 commit from fix-safari-ime-mark into master
pull from: fix-safari-ime-mark
merge into: prosemirror:master
Conversation 2 Commits 1 Files changed 1 +1 -1
usualoma commented 2025-09-05 00:55:42 +02:00 (Migrated from github.com)
Copy link

Thank you very much for making this excellent product publicly available.

While working with ProseMirror inside a shadow DOM, I encountered an issue in Safari when using an IME environment. This pull request provides a fix for that problem.

Steps to reproduce

  1. Apply ProseMirror inside a shadow DOM
  2. Focus the editing area
  3. Enable IME
  4. Apply “Bold”
  5. Enter text and press Enter to confirm

Expected result

  • The entered text is reflected in the editor

Actual result

  • The entered text disappears

https://github.com/user-attachments/assets/b77bfb72-5da5-4c49-b110-12caed8564e9

Conditions for occurrence

  • This does not occur when Shadow DOM is not used.
  • Does not occur in browsers other than Safari

Patch contents

When using an IME in Safari within a shadow DOM, calling selectCursorWrapper() prevents subsequent input from being reflected, so I avoided calling it.

This change also affects cases where shadow DOM is not being used, but in Safari, even then, the expected result seems to be achieved without calling selectCursorWrapper().

Thank you very much for making this excellent product publicly available. While working with ProseMirror inside a shadow DOM, I encountered an issue in Safari when using an IME environment. This pull request provides a fix for that problem. ### Steps to reproduce 1. Apply ProseMirror inside a shadow DOM * [example](https://github.com/usualoma/prosemirror-example/tree/main/shadow-ime-mark-text) 2. Focus the editing area 3. Enable IME 4. Apply “Bold” 5. Enter text and press Enter to confirm ### Expected result * The entered text is reflected in the editor ### Actual result * The entered text disappears https://github.com/user-attachments/assets/b77bfb72-5da5-4c49-b110-12caed8564e9 ### Conditions for occurrence * This does not occur when Shadow DOM is not used. * Does not occur in browsers other than Safari ### Patch contents When using an IME in Safari within a shadow DOM, calling `selectCursorWrapper()` prevents subsequent input from being reflected, so I avoided calling it. This change also affects cases where shadow DOM is not being used, but in Safari, even then, the expected result seems to be achieved without calling `selectCursorWrapper()`.
marijnh commented 2025-09-05 08:14:46 +02:00 (Migrated from github.com)
Copy link

Cursor wrappers are used to make sure composed text is, for example, actually bold (during composition) when you've enabled the bold mark and start composing before typing any other text. Blanket-disabling this on Safari doesn't seem like a good idea. Ideally, I'd want to fix the issue that's breaking cursor wrappers in shadow DOM, so that this feature works even there.

Cursor wrappers are used to make sure composed text is, for example, actually bold (during composition) when you've enabled the bold mark and start composing before typing any other text. Blanket-disabling this on Safari doesn't seem like a good idea. Ideally, I'd want to fix the issue that's breaking cursor wrappers in shadow DOM, so that this feature works even there.
marijnh commented 2025-09-05 15:17:04 +02:00 (Migrated from github.com)
Copy link

The root issue seems to be that Selection.addRange doesn't work in a shadow DOM on Safari. Attached patch works around that.

The root issue seems to be that `Selection.addRange` doesn't work in a shadow DOM on Safari. Attached patch works around that.

Pull request closed

This pull request cannot be reopened because the branch was deleted.
Sign in to join this conversation.
Reviewers
No reviewers
Labels
Clear labels
No items
No labels
Milestone
Clear milestone
No items
No milestone
Projects
Clear projects
No items
No project
Assignees
Clear assignees
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
prosemirror/prosemirror-view!184
No description provided.