Bug 40477 – [Qt] Unable to check and uncheck check boxes and radio buttons using QtWebkit 2.0

• Component: New Bugs
• Status: RESOLVED INVALID

[Alexandra Santos]

User is unable to interact with radio buttons and check boxes when using QtWebkit 2.0 and QtTestbrowser on N8. 

Steps to reproduce:

1.- Install qt.sis, QtWebkit 2.0 and QtTestBrowser on a N8.
2.- Launch QtTestBrowser and access the following url: http://iop1.nokia-boston.com/rendertree/rendertreetest.html or http://waplabdc.nokia-boston.com/browser/users/BedrockBrowser/InputFields_VKB/inputtest.html
3.- Try to interact with radio buttons and check boxes present in this pages.

Actual results:

User is unable to mark, unmark these elements: radio buttons check boxes.

expected results:

User should be able to mark unmark check boxes and radio buttons.

[Benjamin Poulain]

Is it because of the click area or is it really that the checkbox cannot be clicked?

Can you interact with them with a capacitive stylus?

[Alexandra Santos]

Hi, Benjamin:
yes, I can interact with them using a capacitive stylus if the device in use  is N97. On N8 this is not possible though.

[Jay Tucker]

I don't think this is a QtWebKit issue or even a Qt issue, for that matter. The problem seems to be at the level of basic interaction with the touchscreen. Radio buttons and checkboxes on a device's touchscreen present very small targets to click -- just a few pixels in width and height. It's very difficult to hit them accurately using your finger. On an N97, it's possible to click them using a stylus, but that's not an option on an N8 due to the capacitive touchscreen unless you use a capacitive stylus, which we shouldn't expect an end-user to have.

I wrote a tiny test webpage which contains both real radio button elements in a form element as well as fake radio buttons which are just div elements which can be clicked on and which respond like radio buttons thanks to a few lines of JavaScript I wrote. It's trivial to vary the size of these fake radio buttons using CSS, so I ran some experiments to see how small I could make them before I had trouble clicking on them on a device.

It's no problem at all to use your finger on 40x40 pixel buttons. When the size drops to 20x20, it becomes difficult to use your finger, but it's still easy with a stylus. At 15x15, it's very difficult to use your finger, but still OK with a stylus. At 10x10, it's practically impossible to use your finger and difficult even with a stylus. And a real radio button or checkbox is even smaller than 10x10.

My suggestion is that if we want to resolve this issue, we're going to have to come up with an intelligent algorithm inside the gesture library so that we can handle finger input better, especially for small targets.

Another option is for the user to simply zoom in sufficiently on any radio button or checkbox in order to use it more easily.

[Kenneth Rohde Christiansen]

And that is being worked on. cc'ing Antonio, oh, he is already cc'ed :-)

Antonio, can you give a short description of the work going on? or give a link to a wiki page *hint* *hint*

(In reply to comment #3)
> I don't think this is a QtWebKit issue or even a Qt issue, for that matter. The problem seems to be at the level of basic interaction with the touchscreen. Radio buttons and checkboxes on a device's touchscreen present very small targets to click -- just a few pixels in width and height. It's very difficult to hit them accurately using your finger. On an N97, it's possible to click them using a stylus, but that's not an option on an N8 due to the capacitive touchscreen unless you use a capacitive stylus, which we shouldn't expect an end-user to have.
> 
> I wrote a tiny test webpage which contains both real radio button elements in a form element as well as fake radio buttons which are just div elements which can be clicked on and which respond like radio buttons thanks to a few lines of JavaScript I wrote. It's trivial to vary the size of these fake radio buttons using CSS, so I ran some experiments to see how small I could make them before I had trouble clicking on them on a device.
> 
> It's no problem at all to use your finger on 40x40 pixel buttons. When the size drops to 20x20, it becomes difficult to use your finger, but it's still easy with a stylus. At 15x15, it's very difficult to use your finger, but still OK with a stylus. At 10x10, it's practically impossible to use your finger and difficult even with a stylus. And a real radio button or checkbox is even smaller than 10x10.
> 
> My suggestion is that if we want to resolve this issue, we're going to have to come up with an intelligent algorithm inside the gesture library so that we can handle finger input better, especially for small targets.
> 
> Another option is for the user to simply zoom in sufficiently on any radio button or checkbox in order to use it more easily.

[Simon Hausmann]

Jay's analysis makes sense to me.

I think what Alexandra is really missing is what you'd use on any other browser: You'd zoom in with a pinch or a double-tap, to resize the button and make it tap-able.

I wish QtTestBrowser would support double-tapping to zoom in by a factor of two and another double-tap would zoom it out, on platforms with touch input.

As such my feeling is that this isn't strictly speaking a show stopper, but it makes the QA life a lot harder than it has to be, by it being a useability problem of QtTestBrowser.

Any takers for the QtTestBrowser fix? :)

[Antonio Gomes]

> I think what Alexandra is really missing is what you'd use on any other browser: You'd zoom in with a pinch or a double-tap, to resize the button and make it tap-able.

that'd work arount the problem, yeah. I am working on a real fix on bug 40197 tough, with Grace, from Google.

> I wish QtTestBrowser would support double-tapping to zoom in by a factor of two and another double-tap would zoom it out, on platforms with touch input.
> As such my feeling is that this isn't strictly speaking a show stopper, but it makes the QA life a lot harder than it has to be, by it being a useability problem of QtTestBrowser.
> 
> Any takers for the QtTestBrowser fix? :)

cc'ed some candidates :)

[Simon Hausmann]

I'm removing this from the release blocker list, as it's a useability issue of QtTestBrowser. I'm blocking 39313 instead, so that we can backport the changes.

[Suresh Voruganti]

It seems that issue is not reproducible with the latest QtWebkit 2.1 build. 

Has the fix backported? Can we close the issue?

[Suresh Voruganti]

Issue is reprorducible only in QtTestBrowser.

[Jay Tucker]

Then I agree with Simon that this is not a valid QtWebKit issue, but rather a usability issue of QtTestBrowser. Can we close the issue here but make a note of it somewhere else?

[Benjamin Poulain]

Closing the bug, it is going nowhere.
This issue of QtTestBrowser will be fixed via the touch interaction improvements.