Search code examples
javascriptwebkittextareaspell-checking

Force spell check on a textarea in WebKit


I'm creating a browser based QC/data entry app that will let people edit OCRed files, which naturally have tons of errors. Chunks of data are put in textareas so they can be checked, but the red underlines only appear when the user manually puts the cursor in a misspelled word.

Is there a way to force WebKit to add the little red spell check underlines to textareas?


Solution

  • Essentially you need to use the selection api to move the insertion point over each word to get Safari to highlight it. Here's an example to scan over the first thousand words...

    textarea = document.getElementById("mytextarea");
    textarea.focus();
    
    var selection = window.getSelection();
    selection.modify("move", "backward", "line");
    for (var i = 0; i < 1000; i++ ) {
        selection.modify("move", "forward", "word");
    }
    
    // Remove focus from the element, since the word under
    // the cursor won't have a misspelling marker.
    textarea.blur();
    

    This code was lifted from the WebKit Layout test suite.