[TIMOB-16100] iOS9: TextField with passwordMask & fontFamily changes its fontSize

GitHub Issue	n/a
Type	Bug
Priority	High
Status	Closed
Resolution	Fixed
Resolution Date	2016-11-11T08:58:25.000+0000
Affected Version/s	n/a
Fix Version/s	Release 6.1.0
Components	iOS
Labels	ios9, passwordmask, textfield
Reporter	Matej
Assignee	Vijay Singh
Created	2013-12-27T19:02:54.000+0000
Updated	2016-11-30T19:53:06.000+0000

Description

TextField with passwordMask and some fontFamily changes its font size with every focus/blur. It is completely impossible to set own font family... Attached video.

var win = Ti.UI.createWindow({
	backgroundColor: "black"
});

var normalTextField = Ti.UI.createTextField({
	width: 200, height: 50,
	backgroundColor: "red",
	hintText: "Normal TextField",
	top: 150
});

var passwordTextField = Ti.UI.createTextField({
	width: 200, height: 50,
	backgroundColor: "red",
	hintText: "Password",
	passwordMask: true,
	top: 203,
	font: {fontSize: 15, fontFamily: "Avenir-Medium"}
});

win.add(normalTextField);
win.add(passwordTextField);
win.open();

Attachments

File	Date	Size
tf_bug.mov	2013-12-27T19:02:54.000+0000	3172718

Comments

Alexey Chulochnikov 2014-04-23

Please fix it at 3.2.3 version! Same as issue - TIMOB-7260
Shameer Jan 2014-08-21

Issue reproduced on both SDK Version 3.2.0 GA and 3.4.0 GA CLI version 3.3.0, Titanium SDK version 3.4.0 Titanium SDK version 3.2.0 iOS SDK: 7.1 Appcelerator Studio, build: 3.3.0.201407111535

Nuno Costa 2016-10-07

I have this issue, is hard to fix? Let me know if you want me test something on my side! Thanks - Nuno

   //XML
   <View id="viewPassword">
     <TextField id="password">
       <Label id="labelHide" onClick="hidePassword" />
     </TextField>
   </View>
   
   
   JS
   //hide or show password
   function hidePassword(e) {
   	//e.cancelBubble = true;
   	if ($.password.passwordMask === true) {
   		$.labelHide.text = "hide";
   		//inject font here, but still not work
   		$.password.font = {
   			fontFamily:"Lato-Regular",
   			fontSize: 14
   		}
   		$.password.passwordMask = false;
   		
   	} else  {
   		$.labelHide.text = "show";
   		$.password.font = {
   			fontFamily:"Lato-Regular",
   			fontSize: 14
   		}
   		$.password.passwordMask = true;
   		
   	}
   }
   
   
   
   
   // TSS
   "#password":{
   	width : Ti.UI.FILL,
   	height : 40,
   	font : {fontSize: 14, fontFamily:"Lato-Regular"},
   	passwordMask : false,
   	hintText : "password",
   	autocorrect : false,
   	autocapitalization: Titanium.UI.TEXT_AUTOCAPITALIZATION_NONE,
     returnKeyType: Ti.UI.RETURNKEY_DONE
   }

http://sharebucketapp.com/2FiNTE3ZGM1YjhiODc5M

Nuno Costa 2016-10-07

*This is important!* I also found this odd behavior that *{color:red}adds an extra space{color}* that when you do use for Logins (our case) fails that user to login. http://sharebucketapp.com/RmYzI0NjExZWQ4MDdiMj *Better image:* http://sharebucketapp.com/1ZjkwYTE3NzNlNTQ1Mg *UPDATE:* Some more tests and seams the {color:red}extra space injected by the mask not change{color} the final (password.value)
Hans Knöchel 2016-10-07

I cannot reproduce the initial issue, [~nunocostapt] can you?
Nuno Costa 2016-10-07

Hans, initial issue you mean by the original code by Matej? Video http://sharebucketapp.com/4Mzk4OGFiNGFmNjk3Njg
Nuno Costa 2016-10-07

*Test case and Video:* [https://gist.github.com/hansemannn/58aff0f5df455981298347815b68071a] [http://sharebucketapp.com/dmOTI5MjBhMDRjZTY2ZD] *Note:* -I not sure if this is related to the main issue by *Matej*- *UPDATE:* I did some research and this is what I come up and found: https://gist.github.com/nuno/15b01d2f6ad6c11f594e190d7f90e5c1 *Video* with font reset applied technique, http://sharebucketapp.com/MmEzNzUxNmE2YzcwMmUx
Nuno Costa 2016-10-20

*Update:* The issue seams that is fixed by apple on iOS 10! The issue above is on iOS9.
Vijay Singh 2016-10-24

PR (master): https://github.com/appcelerator/titanium_mobile/pull/8534 PR (unit-test): https://gist.github.com/hansemannn/58aff0f5df455981298347815b68071a Position of cursor was not resetting while unmasking, as end of document calculation goes wrong in iOS below 10 . That made fix by resetting textfield value to blank character and then setting to its actual value.

Samir Mohammed 2016-11-30

Verified fixed, using the test case https://gist.github.com/hansemannn/58aff0f5df455981298347815b68071a no extra spaces were added when pressing show password and the font size and font family seemed consistent. *Environment*

    Appcelerator Command-Line Interface, version 6.0.0
    Iphone 5 IOS 9.1
    Iphone 6 Simulator IOS 9.0
    Operating System Name: Mac OS X El Capitan
    Operating System Version: 10.11.6
    Node.js Version: 4.6.0
    npm: 4.2.8
    Titanium CLI Version: 5.0.10
    Titanium SDK Version: 6.1.0.v20161129071600
    Xcode: 8.0
    Appcelerator Studio: 4.8.0.201611121409

JSON Source