Under Chrome, tabbing into a MTextBox or MPasswordTextBox allows you to type outside the box.

What steps will reproduce the problem?
1.Create a ui:binder form with multiple MTextBox widgets (source below).
2.Click on the first MTextBox widget to get focus
3.Tab to the next widget and start typing.
4.Tab again and start typing.

You will notice that the second field, actually accepts two sets of input (and 
re-sizes). In the case of an MPasswordTextBox the first set of text (#3 above) 
is not masked but the text in step #4 is masked.

What is the expected output? What do you see instead?
The password widget should get the focus on a tab. However, it appears that 
there is a widget within a widget being rendered on Chrome and so you are able 
to type in two values. Typing into the outer widget forces the TextBox to grow 
in size. Only the second, inner value is accessible by code (which gets focus 
if you tab twice).

What version of the product are you using? On what operating system?
mgwt 2.0.0 on Windows 7 x64 running with the Chrome v37 browser.

Please provide any additional information below.

This only appears to happen under Chrome. I can not reproduce this issue under 
IE11 or Firefox.

If you look at the attached screenshot, you will see the two fields.  On the 
bottom field, which is of type MPasswordTextBox, you will see where I tabbed 
in, typed "ABCDEF" and then tabbed again to get the inner box which is 
correctly masking what I typed in.

Here is the ui:binder source for that file.

<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder" 
xmlns:g="urn:import:com.google.gwt.user.client.ui"
             xmlns:mgwt="urn:import:com.googlecode.mgwt.ui.client.widget">

<mgwt:panel.flex.RootFlexPanel ui:field="layoutPanel" alignment="CENTER" 
justification="CENTER">
        <g:VerticalPanel horizontalAlignment="ALIGN_CENTER" verticalAlignment="ALIGN_MIDDLE">
            <mgwt:input.MTextBox
                                  placeHolder="Email Address"
                                 ui:field="emailAddressField"/>
            <mgwt:input.MPasswordTextBox
                                         placeHolder="Password"
                                         ui:field="passwordField"/>
        </g:VerticalPanel>
    </mgwt:panel.flex.RootFlexPanel>
</ui:UiBinder>

Original issue reported on code.google.com by pete.arv...@gmail.com on 2 Oct 2014 at 12:16

Attachments:

Untitled-1.jpg

google-code-export / mgwt

Under Chrome, tabbing into a MTextBox or MPasswordTextBox allows you to type outside the box. #344