DOJO TabContainer containerNode height is 0px

Question

I'm programmatically creating the DOJO TabContainer and the ContentPanes to add to that tabContainer. Each of the contentPanes contain my custom widget. Some of the code is shown below. When the tab is shown, the containerNode on the first tab has a height of 0px as result of which even though the first tab has the fully loaded widget but it won't display in the browser. This used to work correctly in 1.6. I have replaced dojo 1.6 to 1.9.3 and have run into this issue. Any ideas?

    var availableWidgets = { 
'Name': {title: 'Name', widget:'test.ui.NameWidget'},
'Stats':    {title: 'Stats', widget:'test.ui.StatsWidget'}

};

postCreate: function(){ 
var tabContainer = new dijit.layout.TabContainer({controllerWidget: "dijit.layout.TabController"}, this.pContainerDiv);                     
tabContainer.set('class', 'claro');
tabContainer.set('doLayout', false);
tabContainer.set('style', "width: 100%; height: 100%;"); 

dojo.forEach(this.menuItems, dojo.hitch(this, function(menuItem, index){
    var widgetInfo = availableWidgets[menuItem];
if(widgetInfo != null){
    var contentPaneId = portletNamespace + pContext.persistentId + menuItem + 'ContentPane';

    var contentPane = new dijit.layout.ContentPane({
    id: contentPaneId,
            title: widgetInfo.title,
    selected: currentSelectedItem == menuItem,
    closable: false,
    style: 'height:100%;padding: 15px;',
    onShow: dojo.hitch(this, function(){                               
       //can no longer do this in 1.9
       //dojo.require(widgetInfo.widget);                             
       if (widgetInfo.widget == 'test.ui.NameWidget') {
           dojo.require("test.ui.NameWidget");
       } else if (widgetInfo.widget == 'test.ui.StatsWidget') {
           dojo.require("test.ui.StatsWidget");
       } 

       var currentView = this.widgets[widgetInfo.title];
       if(!currentView){
           currentView = eval('new ' + widgetInfo.widget + '(this.params)');
           currentView.placeAt(contentPaneId, 'last'); 

           // startup called by (dijit/_WidgetBase in 1.9.3) by placeAt above
           // currentView.startup(); 

           this.widgets[widgetInfo.title] = currentView;                                    
           }                                
            })
    });                   
        tabContainer.addChild(contentPane);
    }
}));

}

Answer 1

I have a fix. Before adding the content panes to the tab container, I now call:

tabContainer.startup();

When using dojo 1.6, I was doing this after all the content panes were added to the tab container. Calling this before fixes the height issue and renders all tabs correctly using dojo 1.9.3.

Answer 2

I would try calling .resize() on the contentpane after adding your widget to it. That should size the contentpane correctly. Another option would be calling .resize() on the tabcontainer in general after adding a child to the contentPane.