<!DOCTYPE html>
<html>
<body>
    <input id="editable" contenteditable onbeforeinput=preventDeleteByComposition(event) value="foo"></input>
    <script src="../../resources/dump-as-markup.js"></script>
    <script type="text/javascript">
        Markup.description("To manually test this, try to recompose text. The original text should not be modified.");
        if (window.internals)
            internals.settings.setInputEventsEnabled(true);

        editable.focus();

        if (window.textInputController) {
            Markup.dump("editable", "initial composition text");
            textInputController.setMarkedText("foo", 0, 3);
            Markup.dump("editable", "after preventing recomposition");
            textInputController.setMarkedText("garply", 0, 6);
            Markup.dump("editable", "after selecting a new composition string");
            textInputController.insertText("garply");
            Markup.dump("editable", "after committing the new composition string");
        }

        function preventDeleteByComposition(event)
        {
            if (event.inputType == "deleteByComposition")
                event.preventDefault();
        }
    </script>
</body>
</html>