Last active
November 28, 2022 09:24
-
-
Save ocavue/8d4139c40096cfa08780dc6d18f30e1c to your computer and use it in GitHub Desktop.
This gist shows a bug on iOS Safari, that sometime double pressing spaces in a `contenteditable` element won't insert a period.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html lang="en"> | |
<head> | |
<meta charset="utf-8"> | |
<title>example</title> | |
<meta name="viewport" content="width=device-width,initial-scale=1"> | |
<style type="text/css"> | |
.editor-a { | |
color: blue; | |
} | |
.editor-b { | |
color: red; | |
} | |
</style> | |
</head> | |
<body> | |
<div class="editor-a" contenteditable="true"> | |
<h1>This works on both iOS and macOS Safari</h1> | |
<div>div element.</div> | |
<div>div element.</div> | |
<div>div element.</div> | |
</div> | |
<div class="editor-b" contenteditable="true"> | |
<h1>This won't work on iOS Safari</h1> | |
<p>paragraph element.</p> | |
<p>paragraph element.</p> | |
<p>paragraph element.</p> | |
</div> | |
</body> | |
</html> |
you accidentally tagged the wrong Philip
Oh no. I'm so sorry.
bring this to as it's an issue in the TipTap
This is not a ProseMirror/TipTap/Remirror issue. It's a (iOS) Safari issue.
We could (re-)implement this behavior on the ProseMirror editor side by using prosemirror-inputrules (similar to slate-auto-replace, which is mentioned in the issue link you posted), but it's complex to get it right. For example, different languages have different "period". I don't think this's a good idea.
Yeah, "fixing" it anywhere would be a workaround for the Safari issue. Definitely very complicated so hopefully it's something that gets fixed at the root. Thanks for the link to the ProseMirror plugin.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Thanks for the update. Looks like the issue is
div
vsp
which is unfortunate.Amusingly, you accidentally tagged the wrong Philip, but @philippkuehn is who I wanted to bring this to as it's an issue in the TipTap editor he works on. Looks like Slate had (has?) a similar issue.