Android WebView Javascript getSelection

Question

I am having some trouble getting the selection from a WebView in Android.

I can get the WebView to go into selection mode. I can even get it to copy the text to the ClipBoard. But what I really want to do is highlight the selection permanently.

So the idea is put the WebView in select mode. Let the user select the text, and then fire something to highlight that text. I can get it to work by getting the selected text from the clipboard, and then search for it in Javascript and highlight it. The problem occurs when the user selects a real common word. I have to either highlight them all or somehow figure out where the selection is to get the right one.

I have tried this JavaScript which works on the iPhone. Bu getSelection() does not seem to work on the Android.

function highlight(colour) {
    var range, sel;
    if (window.getSelection) {
            // Non-IE case
        sel = window.getSelection();
        if (sel.getRangeAt) {
            range = sel.getRangeAt(0);
        }
        document.designMode = "on";
        if (range) {
            sel.removeAllRanges();
            sel.addRange(range);
        }
            // Use HiliteColor since some browsers apply BackColor to the whole block
        if ( !document.execCommand("HiliteColor", false, colour) ) {
            document.execCommand("BackColor", false, colour);
        }
        document.designMode = "off";
    } else if (document.selection && document.selection.createRange) {
            // IE case
        range = document.selection.createRange();
        range.execCommand("BackColor", false, colour);
    }
}

Any suggestions?

Answer 1

When the WebView goes into "Selection Mode", the WebView is not actually being used for selection... It is being pushed under a "WebTextView" (private class in Android's arsenal) which mimics the text position, yet allows images to show through, and allows you to "select" the text which appears in the actual HTML. The problem comes when you try to interact with the WebView after "selecting" the text. The highlight and cursor handles are in the right position, but they are actually in the special WebTextView I mentioned, therefore you do not actually have a selection to get via JavaScript's getSelection, or any other means in JavaScript. I am working on making the ACTION_DOWN (of the LongPress) which triggers selection and the drag and ACTION_UP of the release from drag work for me via JavaScript, but it is very hairy, and not at all user friendly at this point...

http://www.java2s.com/Open-Source/Android/android-core/platform-frameworks-base/android/webkit/WebTextView.java.htm

check the source(that's a lot of work to mimic text selection instead of provide it) It is sad, and currently very painful for a project our team has undertaken -- especially after doing the same app for iPad...

Answer 2

Finally, in Android 4.4 KitKat, the WebView is now based on Chromium.

Therefore we have access to window.getSelection()!!

wv.evaluateJavascript("console.log(window.getSelection().baseNode.nodeValue);", null);

Tested on Nexus 5 & Nexus 7.