Caret on textInput never goes away

Question

I have a login form with various textInputs and a submit button. If you submit proper login credentials the system unloads the login view and loads the app view. Pretty standard. Unfortunately I've noticed this weird bug where if you hover over one of the textInput boxes with the mouse, then fill the form using only the keyboard (and leave the mouse parked on top of the textInput), and then tab to the submit button and press the space bar, i.e. login via keyboard, the mouse cursor will remain a caret in the new view, no matter what you do (move, click), until you find another textInput to undo the cursor state.

I've tried to do all sorts of stuff via CursorManager but nothing seems to do the trick. I've tried dispatching events ROLL_OUT or MOUSE_OUT events to the textInput but that doesn't do the trick either.

I've tried to reproduce this in a small example and have not been able to, which I realize makes helping me that much harder. Would still love to hear if anyone has dealt with something similar or hear of any pointers that may sound connected.

thank you!

f

I was going to ask for a sample. Since you can't create a reproducible one it makes me wonder if there isn't something in your code causing this. I might recommend making a copy of your project and slowly removing things until this goes away. — JeffryHouser
yup... I think you were absolutely right. I slowly figured out what was making it happen, although I must admit I am still not sure why it was happening. Will post my findings in a sec. — fred august

Darius Darius · Accepted Answer · 2012-09-03T12:46:44

I had the exactly the same problem. Here is my login screen view:

<fx:Style>
    @namespace s "library://ns.adobe.com/flex/spark";
    @namespace mx "library://ns.adobe.com/flex/mx";
    .textInput
    {
        showErrorTip : true;
        showErrorSkin : true;
    }
</fx:Style>
<fx:Declarations>
    <mx:StringValidator id="usernameValidator" source="{username}" property="text"
                        trigger="{signinButton}" triggerEvent="click" required="true" />
    <mx:StringValidator id="passwordValidator" source="{password}" property="text"
                        trigger="{signinButton}" triggerEvent="click" required="true"/> 
</fx:Declarations>
<fx:Script>
    <![CDATA[
        import info.thwm.appx.model.vo.LoginVO;
        import info.thwm.appx.view.events.ViewEvent;

        import mx.validators.Validator;

        public static const NAME:String = "LoginView";
        [Bindable] public var loginVO:LoginVO = new LoginVO();

        private function init():void{
            focusManager.setFocus( username );
            sendEvent( ViewEvent.VIEW_CREATED, NAME );
        }

        private function sendEvent( type:String, data:Object=null ):void{
            dispatchEvent( new ViewEvent( type, data ) );
        }

        private function loginUser(event:MouseEvent = null):void{
            var validators:Array = [usernameValidator, passwordValidator];
            var errors:Array;
            errors = Validator.validateAll(validators);
            if (errors.length == 0){                                        
                sendEvent( ViewEvent.BTN_LOGIN_CLICK, loginVO );
            }                               
        }
    ]]>
</fx:Script>

<s:Panel width="320" height="230" title="Sign In">
<s:layout>
    <s:VerticalLayout/>
</s:layout>
<s:Form id="form1" styleName="formStyle" defaultButton="{signinButton}">            <s:layout>
            <s:FormLayout paddingLeft="25" gap="-5"/>
        </s:layout>
        <s:FormItem label="Username" required="true" skinClass="info.thwm.appx.view.skins.FormItemSkin">
            <s:TextInput id="username" text="@{loginVO.username}" styleName="textInput"/>
        </s:FormItem>
        <s:FormItem label="Password" required="true" skinClass="info.thwm.appx.view.skins.FormItemSkin">
            <s:TextInput displayAsPassword="true" id="password" text="@{loginVO.password}" styleName="textInput"/>
        </s:FormItem>
        <s:FormItem>
            <s:CheckBox label="Remember" id="remember" selected="@{loginVO.remember}"/>
        </s:FormItem>
        <s:FormItem>
            <s:Button label="Sign In" id="signinButton" click="loginUser(event)"/>
        </s:FormItem>
    </s:Form>
    <s:controlBarContent>
        <s:HGroup width="100%" verticalAlign="middle">
            <s:Button label="Register" id="registerButton" click="sendEvent( ViewEvent.BTN_REGISTER_CLICK );" />
            <s:Label buttonMode="true" color="#57595A" text="Forgot your username or password?" click="sendEvent( ViewEvent.BTN_PSW_REMINDER_CLICK );"/>
        </s:HGroup>
    </s:controlBarContent>
</s:Panel>

Nothing special about that, but if i select username field with mouse and then only use keyboard for the rest, as soon as i get to next view mouse cursor becomes input caret. The only way around it was add this line "Mouse.cursor = MouseCursor.ARROW" in next view's onCreationComplete event function.

Caret on textInput never goes away

3 Answers