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 hidden or 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> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.