We're having some difficulties figuring out when things are painted on the screen as of 2.1. See the following test case:

index.js
Code:
Ext.setup({
    onReady : function() {
        function logPos(msg) {
            if (msg) console.log(msg);
            console.log(Ext.getCmp('email').element.getPageBox());
        }

        var emailFld = new Ext.field.Email({
            id: 'email',
            label: 'Email',
            placeHolder: 'you@sencha.com'
        });

        emailFld.on('painted', function() { logPos('painted'); });

        Ext.Viewport.add({
            xtype: 'formpanel',
            items: [
                {
                    xtype: 'fieldset',
                    title: 'Personal Info',
                    items: [
                        emailFld
                    ]
                }
            ]
        });

        logPos('After add');
    }
});
index.html:
Code:
<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="../../sencha-touch-2.1.0/resources/css/sencha-touch.css">
        
    </head>
    <body>
        <script type="text/javascript" src="../../sencha-touch-2.1.0/sencha-touch-all-debug.js"></script>
        
        <script type="text/javascript" src="index.js"></script>
    </body>
</html>
Output in 2.1 (both results are 'incorrect', not the final place of the elements in the dom)
After add index.js:4
Object {left: 1347, top: 558, width: 1290, height: 46, right: 2637…}

painted index.js:4
Object {left: 1347, top: 558, width: 1290, height: 46, right: 2637…}
Output in 2.0.1
painted index.js:4
Object {left: 1347.2332763671875, top: 557.933349609375, width: 1290, height: 46, right: 2637.2332763671875…}

After add index.js:4
Object {left: 19.233333587646484, top: 65.93333435058594, width: 1290, height: 46, right: 1309.2333335876465…}
Which event in 2.1 guarantees a component/el has been painted and positioned correctly?