3 ms·

Every time I see a new contenteditable-based editor I'm reminded of this https://medium.com/content-uneditable/contenteditable-the-good-the-bad-and-the-ugly-26

Every time I see a new contenteditable-based editor I'm reminded of this https://medium.com/content-uneditable/contenteditable-the-good-the-bad-and-the-ugly-261a38555e9c https://medium.com/content-uneditable/contenteditable-the-go...

as1mov 8y ago
Heh, I remember a fun bug(?) I had found in IE while using contenteditable on my previous job. I had been assigned to implement a rich text editor which was pretty close to what OP has posted, except that it a feature where the editable text had 'islands' of uneditable text sprinkled in-between. Sounds simple enough? Just add a nested element with contenteditable set to `false`. This worked well enough in Firefox and Chrome, but for some reason it wouldn't work in IE (surprise!). After hours of scouring the internet, I found the solution[1], which was setting contenteditable to `true` for disabling the edit in the case of IE. The reason for this behavior? Nobody knows. I still feel pangs of guilt for the poor sod who has to maintain that dumpster fire that I wrote as a fresh faced grad. [1] https://stackoverflow.com/questions/7522848/contenteditable-false-inside-contenteditable-true-block-is-still-editable-in-ie8 https://stackoverflow.com/questions/7522848/contenteditable-...
EGreg 8y ago
I read this! And then we decided that the right thing to do for MOBILE is to completely AVOID native selections. The editor we built is way more clean than ANYTHING professional companies like Froala, Imperavi, TinyMCE, CKEditor and others have put out. But only for mobile touchscreens. We are thinking of hiring a manager to license this to everyone using the other editors on their site (sites like BuiltWith can tell you entire lists of these sites) or just negotiate to give an unlimited / open source license to Froala / Imperavi themselves! See for yourself: https://youtu.be/-DgaTwG1csc https://youtu.be/-DgaTwG1csc Contact greg at the domain qbix.com if interested. It would be a commission based job, but can involve a lot of fun things like producing videos and websites w our team.
saagarjha 8y ago
Yeah, unfortunately this one breaks Emacs keybindings on macOS :(
Reinmar 8y ago
Hi! The author of this article here :) I hoped you liked it (cause your message can read both ways :D) You reminded me that I was planning to refresh it a bit since it's over 3 years old now. I'd like to cover the rise of modern rich-text editors like CKEditor 5, ProseMirror, Draft.js and perhaps dive a bit into what we've learned when developing CKEditor 5 (because after 4 years of work it's actually out by now [1]). If you have any questions or you're curious about some particular aspects, please let me know :) [1] https://ckeditor.com/ckeditor-5/ https://ckeditor.com/ckeditor-5/
- daanavitch 8y ago
  I would love to read an article like that! I'm very curious how the architecture of the new CKEditor 5 compares to younger alternatives like ProseMirror and Draft.js.
- Tade0 8y ago
  Seconding that other comment. Really curious if that grasshopper(Draft.js) is stil green.
- chinhodado 8y ago
  I loved the article! I used to have to maintain some custom ckeditor plugins related to custom elements, spell checking and autocompletion at a job and that article resonated deeply with me on a personal level. I would love to read another article about the new editors :)

as1mov 8y ago

Heh, I remember a fun bug(?) I had found in IE while using contenteditable on my previous job. I had been assigned to implement a rich text editor which was pretty close to what OP has posted, except that it a feature where the editable text had 'islands' of uneditable text sprinkled in-between. Sounds simple enough? Just add a nested element with contenteditable set to `false`. This worked well enough in Firefox and Chrome, but for some reason it wouldn't work in IE (surprise!). After hours of scouring the internet, I found the solution[1], which was setting contenteditable to `true` for disabling the edit in the case of IE. The reason for this behavior? Nobody knows. I still feel pangs of guilt for the poor sod who has to maintain that dumpster fire that I wrote as a fresh faced grad. [1] https://stackoverflow.com/questions/7522848/contenteditable-false-inside-contenteditable-true-block-is-still-editable-in-ie8 https://stackoverflow.com/questions/7522848/contenteditable-...

EGreg 8y ago

I read this! And then we decided that the right thing to do for MOBILE is to completely AVOID native selections. The editor we built is way more clean than ANYTHING professional companies like Froala, Imperavi, TinyMCE, CKEditor and others have put out. But only for mobile touchscreens. We are thinking of hiring a manager to license this to everyone using the other editors on their site (sites like BuiltWith can tell you entire lists of these sites) or just negotiate to give an unlimited / open source license to Froala / Imperavi themselves! See for yourself: https://youtu.be/-DgaTwG1csc https://youtu.be/-DgaTwG1csc Contact greg at the domain qbix.com if interested. It would be a commission based job, but can involve a lot of fun things like producing videos and websites w our team.

saagarjha 8y ago

Yeah, unfortunately this one breaks Emacs keybindings on macOS :(

Reinmar 8y ago

Hi! The author of this article here :) I hoped you liked it (cause your message can read both ways :D) You reminded me that I was planning to refresh it a bit since it's over 3 years old now. I'd like to cover the rise of modern rich-text editors like CKEditor 5, ProseMirror, Draft.js and perhaps dive a bit into what we've learned when developing CKEditor 5 (because after 4 years of work it's actually out by now [1]). If you have any questions or you're curious about some particular aspects, please let me know :) [1] https://ckeditor.com/ckeditor-5/ https://ckeditor.com/ckeditor-5/

daanavitch 8y ago
I would love to read an article like that! I'm very curious how the architecture of the new CKEditor 5 compares to younger alternatives like ProseMirror and Draft.js.
Tade0 8y ago
Seconding that other comment. Really curious if that grasshopper(Draft.js) is stil green.
chinhodado 8y ago
I loved the article! I used to have to maintain some custom ckeditor plugins related to custom elements, spell checking and autocompletion at a job and that article resonated deeply with me on a personal level. I would love to read another article about the new editors :)