Why We Built Our Message Editor Twice - Inside Intercom

In notebook:
Article Notes
Created at:
2015-10-15
Updated:
2015-10-15
Tags:
bugfix pattern JavaScript DOM Performance
Why We Built Our Message Editor Twice - Inside Intercomhtml5 contenteditable quirks:

a newline produces different outputs depending on browser:
  <!--in Firefox-->
<div contenteditable>
    <br />
</div>
<!--in Internet Explorer-->
<div contenteditable>
    <p></p>
    <p></p>
</div>
<!--in Chrome-->
<div contenteditable>
    <div>
        <br />
    </div>
    <div>
        <br />
    </div>
</div>
my note: I once was using contenteditable with Docpad for the back-end of a CMS. Didn't work too well
solution

they a built a complex (risky, 6 months project) where they mapped keyboard actions (backspace, delete, return, paste, etc.) to a Block Object Model. 
This results in a JSON file with an array of blocks e.g: ​{"type":"heading", "text":"github integration"}​, etc. you can have ​type​, ​text​, ​linkUrl​ etc.

could be interesting for a CMS use. 

Beware! Not at all trivial to implement!