This specification defines an API that indicates which editing-related commands are applicable to `contenteditable` regions of a document. User agents can take this information into account when presenting any editing-related UI to ensure its applicability.

This specification purposefully does not prescribe the means by which a user agent will indicate to the user the applicability of any editing command. The user agent could, for example, omit editing UI, disable it, or choose some other appropriate UI treatment.

This is a work in progress and subject to change without warning.

Introduction

In contenteditable regions of documents, some user agents provide contextual user interface (UI) elements to help accelerate common editing operations. The UI is meant to enhance the editing experience, but when authors create customized editors that are not compatible with user agent UI, it leads to confused users.

To address the issue, a new `contenteditabledisabled` attribute can be applied as shown in the example below.

            <div contenteditable="true" contenteditabledisabled="
                formatbackcolor
                formatdent
                formatfont
                formatjustify
                formatscript
                formatstrikethrough
                formatunderline
                inserthorizontalrule">
                This is a contenteditable region of a document that supports:
                <ul>
                    <li>bold text</li>
                    <li>italic text</li>
                    <li>links</li>
                    <li>lists</li>
                    <li>and possibly other formatting outside the scope of this specification.</li>
                </ul>

                This contenteditable region explicitly does not support:
                <ul>
                    <li>background colors</li>
                    <li>indentation</li>
                    <li>font name, size or color customization</li>
                    <li>justification</li>
                    <li>superscript or subscript text</li>
                    <li>strikethrough</li>
                    <li>underlines</li>
                    <li>horizontal rules</li>
                </ul>
            </div>
        

contenteditabledisabled DOM Content Attribute.

The contenteditabledisabled attribute indicates which user agent-supplied editing UI MUST convey the inapplicability of editing command in a given context. When specified, the attribute can contain an [=unordered set of unique space-separated tokens=] that are treated as [=ASCII case-insensitive=].

The allowed set of tokens are listed below. Each token matches the name of an Input Type, or is a shortcut that is equivalent to specifying a set tokens.

When a token is specified, an user agent MUST NOT be display UI that indicates an editing command is applicable if when invoked, would result in a beforeinput event having and inputType that matches one of the tokens in the attribute's value, or matches a token that is represented by a shortcut that is included in the attribute's value. The exact mechanism for that indication is beyond the scope of this specification.

contenteditabledisabled Allowed Tokens.

contenteditabledisabled Allowed Token Shortcuts.

The following tokens are also supported by the contenteditabledisabled attribute and serve as shorthands for specifying a set of tokens from contenteditabledisabled Allowed Tokens:

Note that this specification does not have a shortcut to disable all editing UI. Authors should consider using a textarea for this purpose.

The DOMCommandTokenList

           [Exposed=Window]
           interface DOMCommandTokenList : DOMTokenList {
             [SameObject] readonly attribute DOMString supported;
           };
        

The supported attribute returns the supported tokens as a string.

Extensions to the ElementContentEditable mixin

            partial interface mixin ElementContentEditable {
                [SameObject, PutForwards=value] readonly attribute DOMCommandTokenList contentEditableDisabled;
            };
        

The {{ElementContentEditable/contentEditableDisabled}} IDL attribute reflects the contenteditabledisabled DOM content attribute.