PDA

View Full Version : [CLOSED] IE bug at EXt.menu.Menu on tree panel using Ext 4.0.2a



mxu
24 Jul 2011, 1:32 PM
REQUIRED INFORMATION


Ext version tested:

Ext 4.0.2arev


Browser versions tested against:

IE8
FF3 (firebug 1.3.0.10 installed)


Description:

Ext 4.* sample
http://dev.sencha.com/deploy/ext-4.0.2a/examples/tree/check-tree.html

I add itemcontextmenu event handler but run into exception at Ext.menu.Menu
inside Ext.menu.Menu's lookupComponent: function(cmp) {
// Apply our minWidth to all of our child components so it's accounted
// for in our VBox layout
cmp.minWidth = cmp.minWidth || me.minWidth; /// Line: 121438
...
}

IE 8.* the error msg
////////////////////////////////////////////////////////////////////////////////////////////////
User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; .NET4.0C; InfoPath.3; .NET4.0E)
Timestamp: Thu, 21 Jul 2011 18:01:01 UTC


Message: 'undefined' is null or not an object
Line: 121438
Char: 9
Code: 0
URI: http://flexo/projects/SNP/mxu/GaPBro...-w-comments.js

Ext.define('Ext.menu.Menu', {
...
lookupComponent: function(cmp) {
var me = this;

if (Ext.isString(cmp)) {
cmp = me.lookupItemFromString(cmp);
} else if (Ext.isObject(cmp)) {
cmp = me.lookupItemFromObject(cmp);
}

// Apply our minWidth to all of our child components so it's accounted
// for in our VBox layout
cmp.minWidth = cmp.minWidth || me.minWidth; /// Line: 121438

return cmp;
},
...
]


Steps to reproduce the problem:




The result that was expected:




The result that occurs instead:

foo
bar


Test Case:



<<insert working code to reproduce the report >>
/*

This file is part of Ext JS 4

Copyright (c) 2011 Sencha Inc

Contact: http://www.sencha.com/contact

GNU General Public License Usage
This file may be used under the terms of the GNU General Public License version 3.0 as published by the Free Software Foundation and appearing in the file LICENSE included in the packaging of this file. Please review the following information to ensure the GNU General Public License version 3.0 requirements will be met: http://www.gnu.org/copyleft/gpl.html.

If you are unsure which license is appropriate for your use, please contact the sales department at http://www.sencha.com/contact.

*/
Ext.require([
'Ext.tree.*',
'Ext.menu.*',
'Ext.data.*',
'Ext.window.MessageBox'
]);

Ext.onReady(function() {
//getContextMenu();

var store = Ext.create('Ext.data.TreeStore', {
root: {
text: 'Content',
expanded: true,
children: [
{
text: "To Do",
cls: "folder",
expanded: true,
children: [{
text: "Go jogging",
leaf: true,
checked: true
},{
text: "Take a nap",
leaf: true,
checked: false
}
,{
text: "Climb Everest",
leaf: true,
checked: false
}
]
}

]
}

});

var tree = Ext.create('Ext.tree.Panel', {
store: store,
rootVisible: true,
useArrows: true,
frame: true,
title: 'Check Tree',
renderTo: 'tree-div',
width: 200,
height: 250,
dockedItems: [{
xtype: 'toolbar',
items: {
text: 'Get checked nodes',
handler: function(){
var records = tree.getView().getChecked(),
names = [];

Ext.Array.each(records, function(rec){
names.push(rec.get('text'));
});

Ext.MessageBox.show({
title: 'Selected Nodes',
msg: names.join('<br />'),
icon: Ext.MessageBox.INFO
});
}
}
}]
});

tree.on('itemcontextmenu', onATreeContextMenu, tree);

});

var _contextMenu_ = null;
function getContextMenu(){
if(!_contextMenu_){

_contextMenu_ = Ext.create('Ext.menu.Menu', {
//width: 100,
//height: 100,
//margin: '0 0 10 0',
floating: true, // usually you want this set to True (default)
renderTo: Ext.getBody(), // usually rendered by it's containing component
indent: true,
items:[
{text: 'Some Entry for ', iconCls: 'icon-publicdata-node'},
{text: 'Another Entry ' ,iconCls: 'icon-ncbi-node'},
]
});
}
return _contextMenu_ ;
}

function onATreeContextMenu(view, n, item, index, e){
window.status = "entering hanlder: " + e.getXY() + ': node: ' + n.data.id;

getContextMenu().showAt( e.getXY());

e.stopEvent();
return false;
}





HELPFUL INFORMATION


Screenshot or Video:

attached


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


Debugging already done:

none


Possible fix:

not provided


Additional CSS used:

only default ext-all.css
custom css (include details)


Operating System:

win7
WinXP Pro

mike.estes
25 Jul 2011, 9:45 AM
This is not a bug in the library, the second item you are adding the the context menu ({text: 'Another Entry ' ,iconCls: 'icon-ncbi-node'}) has a trailing comma, this will cause problems in IE browsers but not other browsers. use jslint to help catch these things.

mxu
26 Jul 2011, 8:37 AM
thanks

mxu