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

24 Jul 2011, 1:32 PM

Ext version tested:

Ext 4.0.2arev

Browser versions tested against:

FF3 (firebug installed)


Ext 4.* sample

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:


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.onReady(function() {

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){

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

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


var _contextMenu_ = null;
function getContextMenu(){

_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,
{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());

return false;


Screenshot or Video:


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

Debugging already done:


Possible fix:

not provided

Additional CSS used:

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

Operating System:

WinXP Pro

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.

26 Jul 2011, 8:37 AM