WebView gets stuck on Read-only Empty TEXTAREA on Samsung Galaxy S3 (Android 4.1.1)

Question

I observed that the Android Webview gets stuck when I try to tap into and focus on a TEXTAREA that is read-only and empty. The keyboard comes up and of course doesn't input anything into the TEXTAREA, but after that the WebView is stuck.

I can only force dismiss the keyboard using the "BACK" key but no other actions are performed. Can't do anything except restart the whole application.

<textarea rows="3" id="abcd" readonly="readonly" name="abcd"></textarea>

I keep getting this Verbose Message in the LOGCAT console against webview.

singleCursorHandlerTouchEVent ~getEditableSupport FASLE

This happens only on the Samsung S3 device running Android 4.1.1 and works perfectly on Samsung Nexus S (Android 4.1.2) and 4.1.2 Android emulator.

Other solutions proposed in these links did not work

This issue can be reproduced easily with this Standalone Webview example

public class TestWebViewTextStylesActivity extends Activity {

    WebView mWebView = null;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);


        String data = "<html><body>" +
        "<textarea rows='3' id='abcd' readonly='readonly' name='abcd'></textarea>" +
        "</body></html>";

        mWebView = new WebView(this);
        setContentView(mWebView);

        // Set some HTML 
        mWebView.loadDataWithBaseURL("file:///android_asset/", data, "text/html", "UTF-8", null);

    }
}

Swaroop · Accepted Answer · 2013-03-25T14:36:53.530

I found the solution after spending half a day looking at various alternatives.

The solution was very simple which was to introduce a space between the TEXTAREA html tags.

<textarea rows="3" id="abcd" readonly="readonly" name="abcd"> </textarea>
_____________________________________________________________||___________
________________________________________________INSERTED___SPACE ___HERE__

And I've also observed that setting the .innerText attribute to BLANK string via JS also causes the TEXTAREA to cause Webview Freeze.

That space is also required without which the browser assumes all the HTML followed by the TEXTAREA also belongs inside the TEXTAREA. So correct way is to give a single space and then complete the TEXTAREA (</TEXTAREA>)

For Writable TEXTAREA HTML elements you can't have this empty space or this gets prefixed with the value that's inputted by the user. So I had to write a JS method that will empty out the value that I had to inject before setting it to the WebView.

function clearOffTextArea(textAreaId) {

    var x = document.getElementById(textAreaId);

    var isReadOnly = false;

    if (x.hasAttribute('readOnly')) {
        isReadOnly = x.readOnly;
    }

    if (isReadOnly == false) {
        if (customMethodToTrimString(x.innerText) == '') {
            x.innerText = '';
        }
    }
}

WebView gets stuck on Read-only Empty TEXTAREA on Samsung Galaxy S3 (Android 4.1.1)

1 Answers1