REQUIRED INFORMATION

Ext version tested:
  • Ext 4.2.0 RC
Browser versions tested against:
  • IE9
  • Chrome
DOCTYPE tested against:
  • <!DOCTYPE html>
Description:
  • Expanding a tree node causes multiple layouts. Expanding a node with children causes two layouts. Expanding a non-leaf node without children causes four layouts. It seems too many and possibly can cause performance issues.
Steps to reproduce the problem:
  • Expand nodes
The result that was expected:
  • A single layout
The result that occurs instead:
  • Two or four layouts
Test Case:

Code:
<!DOCTYPE html>
<html>
<head>
    <title>Expanding a node causes multiple layouts</title>

    <link rel="stylesheet" href="../resources/css/ext-all.css" />

    <script src="../ext-all-debug.js"></script>

    <script>
        Ext.onReady(function () {
            var children = [];
            for (var i = 0; i < 50; i++) {
                children.push({
                    text: "SubNode" + i
                });
            }
            var tree = Ext.create("Ext.tree.Panel", {
                renderTo: Ext.getBody(),
                height: 450,
                width: 300,
                root: {
                    text: "Root",
                    children: children
                },
                listeners: {
                    afterlayout: {
                        fn: function () {
                            console.log('layout');
                        }
                    }
                }
            });
        });
    </script>
</head>
<body>
</body>
</html>