Focus frame does not change size relatively focused component

**Qarea** · 12 Nov 2012, 8:33 AM

REQUIRED INFORMATION

Ext version tested:

Ext 4.1.0

Browser versions tested against:

FF 9 (Ubuntu 12.04) firebug 1.9.2 installed
Chromium 20.0.1132.47 (Ubuntu 12.04)
IE8 (Windows 7)

DOCTYPE tested against:

html

Description:

If focused component had changed width or height or both of them, focus frame of FocusManger does not change own sizes accordingly new component sizes.

Steps to reproduce the problem:

Run the sample in browser
Click on textarea(focus it)
Resize browser window

Steps to reproduce the problem (2):

Run the sample in browser
Click on textarea(focus it)
Use mouse to resize panels by moving split line between panels

The result that was expected:

Focused component should change width/height
Focus frame should change width/height accordingly focused component

The result that occurs instead:

Focused component changed width/height
Focus frame does not change width/height and have old sizes

Test Case:

Code:

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>Test extjs project</title>

        <link href="http://cdn.sencha.io/ext-4.1.0-gpl/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" charset="utf-8" src="http://cdn.sencha.io/ext-4.1.0-gpl/ext-all.js"></script>

        <script type="text/javascript">
        Ext.onReady(function() {
            Ext.FocusManager.enable(true);
            Ext.create('Ext.container.Viewport', {
                layout: 'fit',
                items: [
                    {
                        xtype: 'panel',
                        layout: 'border',
                        items: [
                            {
                                xtype: 'panel',
                                title: 'First panel',
                                region: 'west',
                                width:  280,
                                collapsible: true,
                                split: true,
                            },
                            {
                                xtype: 'panel',
                                title: 'Second panel',
                                region: 'center',
                                bodyPadding: 10,
                                layout: 'fit',
                                items: [
                                    {
                                        xtype: 'textarea',
                                    }
                                ],
                            }
                        ]
                    }
                ]
            });
        });
        </script>
    </head>
    <body>
    </body>
</html>

HELPFUL INFORMATION

Screenshot or Video:

See attached

See this URL for live test case: http://

Debugging already done:

none

Possible fix:

Code:

MyApp.refreshFocusFrame = function () {
    if (Ext.FocusManager.focusedCmp) {
        var cmp = Ext.FocusManager.focusedCmp;
        //to see FocusManager source!
        Ext.FocusManager.focusTask.delay(10, null, null, [cmp, cmp.getFocusEl()]);
    }
};
// Refresh focus frame after component resize
Ext.override(Ext.AbstractComponent, {
    listeners: {
       resize: function () {
           MyApp.refreshFocusFrame();
       }
   }
});

Additional CSS used:

only default ext-all.css

Operating System:

Ubuntu 12.04
Windows 7

Related bug behavior:
Same focus frame bug you can see with modal windows. Just open one. Set focus on it. And then resize it(or move to another location by window header). Window sizes will be changed(window will be moved) . But focus frame will stay on the same position with old size values.

**Qarea** · 13 Nov 2012, 2:31 AM

PHP Code:


According to our records the fix was applied for  EXTJSIV-7741  in 4.2.0.

When 4.2 will be available for customers? I see only 4.1.3 in support portal

I need to fix this bug now, can I safely use my fix for production build?

**Qarea** · 5 Feb 2013, 7:28 AM

I don't know what extjs version is this "EXTJSIV-7741 in 4.2.0 Sprint 3"
But in ExtJS 4.2.0.299 bug Reproduced

**Qarea** · 9 Apr 2013, 12:45 PM

Not fixed in ExtJS 4.2.0 GA

Possible fix described in startpost now produces error:
TypeError: el is null ext-all-dev.js Line 26783

Thread: Focus frame does not change size relatively focused component

Thread Tools

Search Thread

Display

Focus frame does not change size relatively focused component

Bug reproduced

Tags for this Thread

Posting Permissions

Stay Connected

Stay Connected

Sign up for Sencha News