Custom insertText event

Here is an example of using customInsertText event for managing the insert text mechanism flexibly.

var container = document.querySelector('.container'); // Get the main editable container.

container.addEventListener('customInsertText', function(event) {
    // Call 'preventDefault' to prevent WProofreader from replacing text.
    // After that the text replacent mechanism can be handled manually.
    event.preventDefault();

    // Obtain text for replacing from 'detail' field of the 'event' object.
    var text = event.detail.text;

    // Get the selection for the text insertion.
    // The text that is to be replaced are already in the browser Selection.
    var selection = window.getSelection();

    // Keep the error highlighting if needed.
    event.keepHighlight = true;
});