Hi, I tried with some examples on your website, and I noticed that effectively, on the form examples, the same phenomenon appears, but it is a slight sliding compared to the one I encountered on my own app.
You should try on the 'Shopping card Checkout' example, in the complete checkout one. It's not the only occurrency. I'm using Google Chrome to develop.
Here are some screenshots of what it does on mine : I noticed it seems to happen only when the mouse quits the form zone while it is pressed and focused on one of this form's field.
This is when I come on the component. The field is focused by default, but it also happens when I focus it myself. Then I quit the form window ( also does it with a fieldset ) while holding the mouse down.
It slides a little but I had to take many screenshots, cause the phenomenon's quick. Then it disappears. If you keep holding and go on the other side of the window, it ends in coming back. Else, if you relax it, you can't make it appear again.
Hope you'll be able to figure why it happens. We must reload each time it occurs if we just relax the mouse.
Thanks for your help.
Here's the code of the form window.
Code:
Ext.define('Infologis.view.PageConnexion', {
extend: 'Ext.window.Window',
alias: 'widget.PageConnexion',
modal: true,
width: 300,
title: 'Connexion',
id: 'formConnexion',
border: false,
closable: false,
initComponent: function() {
var me = this;
Ext.applyIf(me, {
items: [
{
xtype: 'form',
layout: {
type: 'vbox',
align: 'center'
},
items: [
{
xtype: 'label',
text: 'Le login/le mot de passe est incorrect',
hidden: true,
id: 'msgErreurConnexion',
style: {
color: 'red'
},
padding: 10
},
{
xtype: 'textfield',
emptyText: 'Login',
regex: /\w{3,12}/i, // controle de la longueur comprise entre 3 et 12 caractères alphanumériques, underscore inclus
id: 'loginPageConnexion',
maxLength: 12,
enforceMaxLength: true,
regexText: 'Le login doit avoir une longueur minimale de 3 caracteres',
padding: 5
},
{
xtype: 'textfield',
emptyText: 'Mot de passe',
id: 'mdpPageConnexion',
inputType: 'password',
enableKeyEvents: true,
padding: 5
}
]
}
],
buttons: [
{
name: 'validConnect',
text: 'Se connecter',
width: 70,
height: 20
}
]
});
me.callParent(arguments);
}
});
screenSlide1.jpgscreenSlide2.jpgscreenSlideFinal.jpg