title: Tree node with expandable property set to true and no children does not render plus icon
body: <p>Tree node with expandable property set to true and no children does not render the expand/collapse icon.</p>
  
  <p>I need to develop tree control which loads sub-nodes on demand only. In other words, children should be loaded on node expand event. I've found that property 'expandable' set to true is supposed to render expand/collapse icon regardless of whether children exist or not.
  Could you please review my code and point out where I made mistake that 'expand/collapse icon' is rendered only for nodes with children.</p>
  
  <p>Tree with store and model declared as follow:</p>
  
  <pre><code>Ext.define('Entity', {
          extend: 'Ext.data.Model',
          fields: [
              {name: 'name',     type: 'string'},
              {name: 'description',     type: 'string'},
              {name: 'clazz',     type: 'string'},
              {name: 'path;',     type: 'string'},
              {name: 'leaf',      type: 'boolean'},
              {name: 'expandable',type: 'boolean'},
              {name: 'allowChildren',      type: 'boolean'}
          ]
      });
  
  var mpsStore = Ext.create('Ext.data.TreeStore', {
          model: 'Entity',
          proxy: {
              type: 'ajax',
              url: 'companyTree'
          }
      ,root: {
          name: '__ROOT__'
      }
      });
  
  Ext.define('App.view.Navigation', {
      extend: 'Ext.tree.Panel',
      alias : 'widget.Navigation',
      title: '...',
      rootVisible: false,
      lines: false,
      useArrows: true,
      store: mpsStore
      ,columns: [{xtype: 'treecolumn',
                  text: 'Business Entity',
                  width: 150,
                  dataIndex: 'name',
              },{ text: 'Description',
                  dataIndex: 'description'
              }
      ]
  });
  </code></pre>
  
  <p>Response json looks like:</p>
  
  <pre><code>{  
     "path":".",
     "id":"__ROOT__",
     "name":"__ROOT__",
     "user":null,
     "description":null,
     "clazz":null,
     "iconCls":null,
     "leaf":false,
     "expanded":true,
     "expandable":true,
     "allowChildren":true,
     "children":[  
        {  
           "path":".\\1",
           "id":"1",
           "name":"Company 1",
           "user":null,
           "description":null,
           "clazz":"companyViewId",
           "iconCls":"icon-organisation",
           "leaf":false,
           "expanded":false,
           "expandable":true,
           "allowChildren":true,
           "children":[  ]
        },
        {  
           "path":".\\2",
           "id":"2",
           "name":"Company 2",
           "user":null,
           "description":null,
           "clazz":"companyViewId",
           "iconCls":"icon-organisation",
           "leaf":false,
           "expanded":false,
           "expandable":true,
           "allowChildren":true,
           "children":[  
              {  
                 "path":".\\2\\3",
                 "id":"3",
                 "name":"billTo 2.1",
                 "user":null,
                 "description":"2.1. Street Ave, unit 2.1",
                 "clazz":"billToViewId",
                 "iconCls":"icon-billto",
                 "leaf":false,
                 "expanded":false,
                 "expandable":true,
                 "allowChildren":true,
                 "children":[  
                    {  
                       "path":".\\2\\3\\4",
                       "id":"4",
                       "name":"shipTo 2.1.1",
                       "user":null,
                       "description":"2.1. Street Ave, unit 2.1",
                       "clazz":"shipToViewId",
                       "iconCls":"icon-shipto",
                       "leaf":false,
                       "expanded":false,
                       "expandable":true,
                       "allowChildren":true,
                       "children":[  
                          {  
                             "path":".\\2\\3\\4\\5",
                             "id":"5",
                             "name":"machine2.1.1.1",
                             "user":null,
                             "description":"manufacturer, model",
                             "clazz":"machineViewId",
                             "iconCls":"icon-machine",
                             "leaf":false,
                             "expanded":false,
                             "expandable":true,
                             "allowChildren":true,
                             "children":[  ]
                          }
                       ]
                    },
                    {  
                       "path":".\\2\\3\\6",
                       "id":"6",
                       "name":"shipTo 2.1.2",
                       "user":null,
                       "description":"2.1. Street Ave, unit 2.1",
                       "clazz":"shipToViewId",
                       "iconCls":"icon-shipto",
                       "leaf":false,
                       "expanded":false,
                       "expandable":true,
                       "allowChildren":true,
                       "children":[  ]
                    }
                 ]
              }
           ]
        },
        {  
           "path":".\\7",
           "id":"7",
           "name":"Company 3",
           "user":null,
           "description":null,
           "clazz":"companyViewId",
           "iconCls":"icon-organisation",
           "leaf":false,
           "expanded":false,
           "expandable":true,
           "allowChildren":true,
           "children":[  ]
        }
     ]
  }
  </code></pre>
  
  <p>The result looks like</p>
  
  <p><img src="https://i.stack.imgur.com/qayaw.png" alt="Tree with no expand/collapse icon for nodes without children"></p>
  
  <p>As you can see only one 'company' node has expand/collapse icon.</p>
  
  <p>I've found only one advice for similar question <a href="https://stackoverflow.com/questions/25500247/treepanel-expand-collapse-on-a-node-without-children-extjs">Treepanel expand/collapse on a node without children Extjs</a>
  which use css to hack the issue, but have no clue where to insert this style.</p>
  
  <p>Thank you in advance.</p>
  
  <p>Just for those who need 'end of story'. </p>
  
  <p>If you rely on spring and jackson to render json in response and want to skip empty children, you can configure MappingJackson2HttpMessageConverter in yourApp-servlet.xml to do so.</p>
  
  <pre><code>&lt;mvc:annotation-driven&gt;
  &lt;mvc:message-converters&gt;
  &lt;beans:bean class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter"&gt;
  &lt;beans:property name="objectMapper" ref="objectMapper"/&gt;
  &lt;/beans:bean&gt;
  &lt;/mvc:message-converters&gt;
  &lt;/mvc:annotation-driven&gt;
  &lt;beans:bean name="objectMapper" class="org.springframework.http.converter.json.Jackson2ObjectMapperFactoryBean" autowire="no"&gt;
  &lt;beans:property name="dateFormat"&gt;
  &lt;beans:bean class="java.text.SimpleDateFormat"&gt;
  &lt;beans:constructor-arg type="java.lang.String" value="yyyy-MM-dd HH:mm:ss"/&gt;
  &lt;/beans:bean&gt;
  &lt;/beans:property&gt;
  &lt;beans:property name="featuresToDisable"&gt;
  &lt;beans:list&gt;
  &lt;beans:value type="com.fasterxml.jackson.databind.SerializationFeature"&gt;WRITE_EMPTY_JSON_ARRAYS&lt;/beans:value&gt;
  &lt;/beans:list&gt;
  &lt;/beans:property&gt;
  &lt;/beans:bean&gt;
  </code></pre>
  
  <p>Regards.</p>