Docked items are not created in viewport?

[KJedi]

I have a code:

Ext.define('CJ.view.Viewport', {
extend: 'Ext.Container',
alias: 'widget.7sviewport',
requires: ['CJ.view.nav.Topbar'],

config: {
fullscreen: true,
layout:{
type: 'card'
},
items: [
{
xtype: 'topbar',
docked: 'top',
ref: 'topbar'
},
{
xtype: 'toolbar',
ui: 'footer',
docked: 'bottom',
items: [
{
text: CJ.t('Search'),
ui: 'footer-btn',
iconCls: 'search-icon'
}
.................
],
ref: 'bottombar'
}
]
}
});
When application is started, I don't see by bars. Moreover, if I do the component query:

Ext.ComponentQuery.query('topbar')
I get nothing.
What is happening to docked items in Viewport in ST PR4?
Interesting, but other docked controls on other panels (not in viewport) are still working.

Is it a bug? What override can I apply to fix it quickly?

[rdougan]

Is the actual viewport being created? It's hard to help without seeing more code.

[KJedi]

Actual viewport is created.

Could you please show the basic example where this is working?

[rdougan]

Ext.application({
launch: function() {
Ext.Viewport.add({
docked: 'top',
xtype: 'toolbar',
title: 'Top Toolbar'
});

console.log(Ext.ComponentQuery.query('toolbar'));
}
});

[jep]

I think what I'm seeing is similar. Try this:



Ext.setup({
onReady: function() {
Ext.Viewport.add([
{
xtype:'panel',
layout:'fit',
html:'main panel',
items:[
{
xtype:'toolbar',
docked:'top',
title:'top toolbar'
},

{
xtype:'toolbar',
docked:'bottom',
title:'bottom toolbar'
},

{
xtype:'panel',
height:'50',
docked:'bottom',
html:'bottom panel'
}

]

}
]);

//workaround
//Ext.documentBodyElement.down('.x-body').dom.style.minHeight = 0;
}
});


Using 2.0 RC, I get no bottom panel or toolbar showing up unless I uncomment that workaround.

Tested on:
Chrome 17 on XP
Android Browser 3.2.1-1322550301
iPad (1) Safari 5.1 (7534.48.3)

Edit: Simplified my example

[jep]

FYI, bug report here:

http://www.sencha.com/forum/showthread.php?184093