Looks like we can't reproduce the issue or there's a problem in the test case provided.
-
Sencha Premium Member
Ext.data.TreeStore deletes second level children from config
REQUIRED INFORMATION
Ext version tested:
Browser versions tested against:
- Chrome, but reproducable on any
DOCTYPE tested against:
Description:
- Ext.data.TreeStore deletes second level children from config which renders that config unusable when instantiating store second time.
Steps to reproduce the problem (see testcase):
- Define treepanel config without store, but a root with two levels of children.
- Assign that config to some variable
- Create two treepanels using that variable as config
The result that was expected:
- Two identical treepanels created
- Variable remains unchanged
The result that occurs instead:
- Second treepanel does not contain second level children
- Second level children is deleted from config object
Test Case:
Provided test case as full html page. Just copy-paste to a .html file and open in your browser.
Test case runs on Ext JS 4.1.0 from sencha CDN, but it is reproducible on 4.1.3.
Code:
<!DOCTYPE html>
<html>
<head>
<title>Test case</title>
<link rel="stylesheet" type="text/css" href="http://cdn.sencha.com/ext-4.1.0-gpl/resources/css/ext-all.css" />
<script type="text/javascript" src="http://cdn.sencha.com/ext-4.1.0-gpl/ext-all.js"></script>
</head>
<body>
<div id="treepanel-1" ></div>
<div id="treepanel-2" ></div>
<script type="text/javascript">
var widgetDef = {
xtype: 'treepanel',
root: {
expanded: true,
children: [
{
text: 'Level 1',
id: 'level1',
leaf: true
},
{
text: 'Level 1 parent',
id: 'level1parent',
expanded: true,
children: [
{
text: 'Level 2',
id: 'level 2',
leaf: true
}
]
}
]
}
}
Ext.onReady(function() {
for(var i=1; i<=2; i++) {
Ext.widget(Ext.apply({
renderTo: 'treepanel-'+i,
title: 'Treepanel '+i
}, widgetDef))
}
})
</script>
</body>
</html>
HELPFUL INFORMATION
Screenshot or Video:
extbug-screenshot.png
Debugging already done:
- There is a line in Ext.data.TreeStore.onNodeAdded that deletes children, but I am unable to tell why first level children are preserved.
Operating System:
-
You need to be careful as object and arrays can be shared if used in multiple places. To get around it you can create a new set:
Code:
var widgetDef = {
xtype : 'treepanel',
root : {
expanded : true,
children : [
{
text : 'Level 1',
id : 'level1',
leaf : true
},
{
text : 'Level 1 parent',
id : 'level1parent',
expanded : true,
children : [
{
text : 'Level 2',
id : 'level 2',
leaf : true
}
]
}
]
}
},
i = 1,
config;
for (; i < 3; i++) {
config = Ext.Object.merge({}, widgetDef);
Ext.widget(Ext.apply({
renderTo : document.body,
title : 'Treepanel ' + i
}, config))
}
-
We follow a rule of not mutating objects/arrays that get passed in from user code, so I think we should fix this up.
Twitter - @evantrimboli
Former Sencha framework engineer, available for consulting.
As of 2017-09-22 I am not employed by Sencha, all subsequent posts are my own and do not represent Sencha in any way.
Reply With Quote
