Using afterRender with nested views

this is a reduced case I made to try to reproduce and issue I am having with waiting for nested views to finish rendering.

HTML

<script src="http://cloud.github.com/downloads/wycats/handlebars.js/handlebars-1.0.0.beta.6.js"></script>
<script src="http://cloud.github.com/downloads/emberjs/ember.js/ember-latest.js"></script>
<script src="https://github.com/cerebris/ember-rest/blob/master/src/ember-rest.js"></script>
<script type="text/x-handlebars">
    {{view App.Block blockiBinding="App.data" }}
</script>

<script type="text/x-handlebars" data-template-name="blocki" >
    {{#each view.blocki.children}}
        {{view App.Block blockiBinding="this"}}
    {{/each}}
    {{view.blocki.menuTitle}}
</script>

CSS

.blocks-container {
  width: 30em;
  height: 30em;
  border:2px solid #566789;
  box-shadow: 2px 2px 19px #aaa;
  -o-box-shadow: 2px 2px 19px #aaa;
  -webkit-box-shadow: 2px 2px 19px #aaa;
  -moz-box-shadow: 2px 2px 19px #aaa;
  -moz-border-radius:0.5em;
  border-radius:0.5em;
  opacity:0.7;
  filter:alpha(opacity=80);
  margin: 0.5em;
}

.block { 
    display: block;
    float: left;
    border:1px solid #779989;
    box-shadow: 2px 2px 19px #aaa;
    -o-box-shadow: 2px 2px 19px #aaa;
    -webkit-box-shadow: 2px 2px 19px #aaa;
    -moz-box-shadow: 2px 2px 19px #aaa;
    -moz-border-radius:0.5em;
    border-radius:0.5em;
    opacity:0.8;
    filter:alpha(opacity=80);
    line-height:5em;
    text-align:center;
    z-index:20; 
    background-color:#FFC000;
    color:black;
    font-family:helvetica;
    padding:0.5em;
    margin: 0.5em;
    font-size:0.9em;
}

JavaScript

App = Ember.Application.create({});

App.Block = Em.View.extend({
    tagName: 'div',
    classNames: ['block'],
    templateName: 'blocki',
    didInsertElement: function() {
      // This will run for every child view. But I want code to run only once when all children and root block are rendered
      Ember.run.scheduleOnce('afterRender', this, function(){
        console.log("afterRender block count: ", $(".block").size());
      });

    }
});

// What do we wait fo here? Is it possible that this will get executed before a view is rendered? It my own app it seems to be possible
Ember.run.scheduleOnce('afterRender', this, function(){
  console.log(">>> outside block count: ", $(".block").size());
});

App.data = {
    menuTitle: 'main page',
    children: [{
        menuTitle: 'Block 1',
        children: [{
            menuTitle: 'Block 1.1'
        },
        {
            menuTitle: 'Block 1.2'
        }]
    }, {
            menuTitle: 'Block 2',
        children: [{
            menuTitle: 'Block 2.1',
            children: [{
                menuTitle: 'Block 2.1.1',
                    children: [{
                       menuTitle: 'Block 2.1.1.1'
                    }]
               }]
        }]
    }]
};