[TIMOB-9717] MobileWeb: textFields are not focusable on Chrome

GitHub Issue	n/a
Type	Bug
Priority	Medium
Status	Closed
Resolution	Fixed
Resolution Date	2012-08-09T15:04:42.000+0000
Affected Version/s	Release 2.1.0
Fix Version/s	Sprint 2012-16 API, Release 3.0.0
Components	MobileWeb
Labels	MobileWeb, SupportTeam, api, qe-testadded
Reporter	Jon Alter
Assignee	Bryan Hughes
Created	2012-06-21T17:09:55.000+0000
Updated	2014-10-15T03:23:36.000+0000

Description

Problem description

textFields are not focusable on Google Chrome

Sample code

Steps to reproduce: Run sample code on Google Chrome and click on the text field. Result: text field it's not focusable and it's not possible to type in it

var  win = Titanium.UI.createWindow({
                    backgroundColor:'black'
                });
 
var inputTextField = Titanium.UI.createTextField({
        top:10,
        height:50,
        width:500,
        left:20,
    });
    
win.add(inputTextField);
win.open();

Comments

Chris Barber 2012-06-21

Pull request: https://github.com/appcelerator/titanium_mobile/pull/2451
Lokesh Choudhary 2012-06-22

Verified the issue & found it to be still reproducible on chrome.Not able to focus in textfields in chrome. Changing the severity to 'major' in ref to the talks with bryan,chris ,myself & carl. Environment: Titanium studio : 2.1.0.201206211609 SDK version: 2.1.0.v20120621224153 Chrome version: 19.0.1084.56
Bryan Hughes 2012-06-22

It's important to emphasize that this only affects Chrome on the desktop and the iOS 6 browser (which isn't available yet outside of dev previews). All of the mobile browsers we target and all of the other desktop browsers are unaffected.
Sehyo Chang 2012-07-20

I encountered same issue but found work around. Basically, if DOM is re-rendered for any reason, input text field works. For example, use chrome inspector to select input element. I put following hack in my code and it solved the issue for now. Code basically made dom element invisible and made visible after small delay. var window = // create your window. window.addEventListener('open',function() { var winDomNode = window.domNode; winDomNode.style.display = 'none'; setTimeout(function(){ winDomNode.style.display = '' },200);
Bryan Hughes 2012-08-07

Pull Request: https://github.com/appcelerator/titanium_mobile/pull/2692
Lokesh Choudhary 2012-08-10

Verified fix on: Titanium studio : 2.1.1.201207271312 SDK version : 2.2.0.v20120810080115 Mountain lion(10.8) - chrome 21.0

JSON Source