I'm currently working on a rich text editor (WYSIWYG). I went through several articles and all of them explained how to do that using document.execCommand
. All the libraries out there does the same.
However, MDN says this 😱
This feature is obsolete. Although it may still work in some browsers, its use is discouraged since it could be removed at any time. Try to avoid using it.
Is it true? Then, what should I use?
Or, is this statement wrong?
Top comments (10)
If you are starting from scratch I would say the safest bet is to not use
document.execCommand()
.We've developed and open sourced ours WYSIWYG inline editor before noticing the deprecation, therefore it still use
execCommand
but we've got an issue about it to keep this in mind.Honestly I would also be curious to know what's the timeframe for the deprecation and if it will be a big bang or a smooth transitions. I guess many apps and libs are still using
execCommand
, but only my guess.David,
Thanks for the comment. It's quite frustrating that
execCommand
is deprecated and there's no alternative at the moment. Is it suggesting that we have to code our ownexecCommand
? And, as I see draft.js (React library for content editable doesn't use execCommand). So, do you think it's better to use a library like that for this case?And, yes, I'm creating from scratch. I'm not happy with the things out there. I need it to be in my way ;)
I don't know what's the best path for your project. In our case, we were and are often looking to develop from scratch, it's fun but on the other side in was quite challenging.
draft.js
or other if fits can ease the process.The big advantages from
execCommand
in comparison to manipulating the DOM is that it handle "undo" without the need of developing anything, so yep, a pity that is is marked as deprecated (except if of course there would be a clear replacement).Thanks for the comment, David.
After posting this, I checked Medium's source code and it seems like they are not using
execCommand
.There are undo options in draft.js. Wanna try it as the project is already written in React.
Thanks for the thoughts!
Hey, draft.js is an exceptional rich text editor framework in my view. But I can say that it lacked detailed documentation when I used it which made it harder to find solutions for simpler problems. You can also consider Slate.js which shares a lot of similarities with Draft.js. I personally used Draft.js and can say that it was quite good too.
Neeraj,
Thanks for the comment. We started creating the app with draft.js and it's pretty amazing. Yes, the documentation isn't very good. I cloned the medium-draft repo and learned how he has used draft JS and then started coding. That's easier than going through the documentation ;) Never knew about slate.js. Will check that out.
Thanks.
Glad to know that! All the best with draft. If you haven't already, I would also recommend you to check out Draft.js Plugins. Excellent package covering lots of interesting use cases like mention/suggestion box, etc., created by Nik Graf.
So, I have re-implemented our WYSIWYG component to replace the obsolete
document.execCommand
I just published a blog post to introduce the solution.
Any feedback or contributions are more than welcomed!
The link to your blog post is broken.
daviddalbusco.com/blog/reimplement...
Try this alternative solution.
developer.mozilla.org/en-US/docs/W...