The Editing Task Force can be followed on our mailing list. We track issues in GitHub Issues as well.

## Specifications

Actively developed specs:

Other specs also maintained:

Other editing related specs that are not maintained by the editing taskforce:

## Introduction

contenteditable is used extensively on the web to enable users to directly edit HTML content. However, it is very complex and its behavior is often largely overwritten by sites or javascript frameworks. Completely overwriting it is very difficult because it requires overwriting all keyboard shortcuts that perform commands like bold and undo, as well as the context menu. Further, this must be done in all supported languages. A post on Medium tells one perspective of why it should be changed.

To further simplify the work of sites and frameworks, new types of contentEditable simplifies default behavior to text input only, while providing local-specific information on what a user intends such as to create newlines, delete content, or format it. This allows sites to easily provide their own behaviors without needing to handle complex text input like IMEs.

## Framing the Problem

• ContentEditable is too complex and buggy to be usable as-is
While we could solve this by spec'ing contentEditable's behavior, the remaining issues here cause us to look in a new direction instead.
• ContentEditable does not easily enable the wide range of editing scenarios. It is high-level and not supportive of the principles listed in the Extensible Web Manifesto.

## Use Cases

• Semantic HTML WYSIWYG editor for a blogging platform or email. (link to mail)

The editor needs to able to add both semantic and visual annotation to the document as it will be published as a blog. Headings are to be marked up with h1. h2, etc... and each acronyms, abbreviations, and so forth are marked up with respective HTML elements. However, the editor also supports visual annotations such as bolding, italicizing, and enlarging text, each of which will be interpreted by the editor to respective underlying semantics in HTML.

More Info: In order to keep things consistent he may want to disallow certain types of styling. A few years ago it was common to see people with Joomla sites who just pasted the text into the editor after copying it from a word processor. Each blog post therefore ended up having very different styling.

More thoughts (From Microsoft):
In addition to the functionality mentioned above, the editor should support more advanced markup operations like handling bullets/indentation, tables, and clear formatting (in heavily nested HTML) that are not consistent across browsers today.
Scenarios:

• Prevent style bleeding between the app and the body of the draft mail
• Remember cursor position (or selected range) when focus is out of editor - formatting bar buttons, or insert image cases
• Extensible and consistent paste mode across browsers - e.g. paste AS-IS HTML, paste clean HTML (aka merge formatting), and paste text only
• Extensibility for formatting commands - e.g. when browser handles the bullets it allows callback to javascript to define customized behavior; on under a nested bullet structure, some browsers add a new bullet, others create a new line without bullet and delete the previous bullet; Merge two lists using delete/backspace, instead of keeping two different list structures

• Structured content editor with whitelisted DOM elements and/or classes. (link to mail)
Part of the point is to keep the structure of the document semantically defined. Users can't change font sizes of individual words, etc. This is because one of the main tasks of scientific journal editors who currently receive drafts in Word or Libreoffice format have to undo all the manual styling the writers have added in order to get everything to look in a similar way. We simply take those styling possibilities away so that we can define the entire design through one stylesheet as well as easily convert to other formats, such as LaTex or an Epub, and be sure that we cover all formatting tags that were used.
• Editor that supports areas of non-editable content, nested editable content, etc (see what CKEditor are doing with widgets.) (link to mail)
We also do that - for example in the case of formulas. Generally the text is editable near-Wysiwyg style. But when it comes to formulas, we let the user enter them in Latex format and display the result using mathjax. Each formula object within the text is a noneditable island. If the user clicks on it with the mouse, he can change the formula.
Another example are figures: We want them to always be block elements and to have exactly one caption without styling. They are therefore non-editable islands and if the user clicks on them he can change the figure's display and the caption text.
• Web-based code editor with syntax highlighting, etc. (link to mail)
• Browser based "word art" generator where end-user types some text and it renders in 3D along a curve and in rainbow colors on a <canvas>. (link to mail)
• Track changes functionality within an editor (like https://github.com/NYTimes/ice )
(really should be run MVC in order to keep the code somewhat readable. Currently ICE breaks whenever any of the browser makers decide to change anything about contenteditable.)
• Web-based DTP application (link to mail)
The app can creates a document that contains pagination, columns, and a complex illustrations. It needs to let users edit any text that appears in the document. Each editable text needs to be accessible, and styles applied to text need to be backed by the application's internal model of the document.
• Surface for plain text editing (From Microsoft)
Plain-text emails require a formatting surface that strips out any HTML tags, and prevents them from being entered (e.g. via copy paste)
• Style read-only text (From Microsoft)
The sample text is read only, but is possible to change the format of the text. This is used to select default compose font properties (text font, size, color, BIU).

## Goals

• Empower authors with the right set of baseline behavior to enable creating complex editors
• Make it easy to implement custom behavior with appropriate APIs
• Allow overwrite of behavior for a user intention from all actions that indicate that intention
• Empower complex editors to be accessible by enabling users to understand available behaviors with little accessibility-specific work from the framework or site

## Specs maintained

It is a pattern in web editors that are built on top of contenteditable to disable some commanding functionality. The reason for this is that consistency for Rich Text Editors is very hard, and requirements vary greatly from one app to the next. Disabling all functionality is very difficult, however.

In order to make it easier to disable specific capabilities of contenteditable, we are creating different types of contenteditable with different features disabled by default in the contentEditable spec.

Because it is widely used, contentEditable="true" will continue to be developed in the contentEditable=True spec. Similarly, the execCommand spec aims to spec the behavior of the execCommand command.

## Acknowledgements

Thanks to: Michael Aufreiter, Adrian Bateman, Oliver Buchtala, Robin Berjon, Enrica Casucci, Olivier Forget, Aryeh Gregor, Marijn Haverbeke, Yoshifumi Inoue, Koji Ishii, Gary Kacmarcik, Frederico Caldeira Knabben, Takayoshi Kochi, Piotrek Koszuliński, Travis Leithead, Grisha Lyukshin, Chaals McCathie Nevile, Masayuki Nakano, Ryosuke Niwa, Julie Parent, Ben Peters, Florian Rivoal, Morgan Smith, Hallvord R. M. Steen, Johan Sörlin, Cristian Talau, Dave Tapuska, Ojan Vafai, Léonie Watson, Xiaoqian Wu, Chong Zhang, Joanmarie, and everyone in the Editing Taskforce for their input and feedback.