BeforeRender event not fired for all components

[elettronik]

Hi, I'm porting a project from Extjs3 to extjs4. In ext3 we have translation managed by an override on the component class, so I've used the same approach on the new project.
My override look like this:


Ext.define('Project.localization.ComponentLocalization',{
override: 'Ext.Component',

listeners: {
/**
* Beforerender event used to translate labels of component
*/
beforerender: function(component, eOpts){
component.translate();
}
},

translate: function() {
....
}
});


The code above works only for the top level component I create with Ext.create, but the event is never fired for the children. If I have a panel like this:



Ext.define('MyPanel', {
extend: 'Ext.form.Panel',

title:'panel.title',

items: [{
xtype: textfield,
fieldlabel: 'label.text'
}]
})


I got correctly translated the title of the panel but there is no call to translate on the child textfield. My questions are:
The beforeRender event is called only for top level element and I should do some recursive children managment?
Is there another event I could hook to make this behavior?

The temporary solution I found is to make a call to translate on the override of constructor, but I think is not the best way.

[vietits]

I have tried your code with the following test case with Ext 4.1.1, Chrome 22 and the beforerender event is fired on form panel, panel header and textfield.


Ext.onReady(function(){
Ext.define('Project.localization.ComponentLocalization',{
override: 'Ext.Component',

listeners: {
/**
* Beforerender event used to translate labels of component
*/
beforerender: function(component, eOpts){
console.log('before render', component, component.xtype);
component.translate();
}
},


translate: function() {
}
});


Ext.define('MyPanel', {
extend: 'Ext.form.Panel',


title:'panel.title',

items: [{
xtype: 'textfield',
fieldlabel: 'label.text'
}]
});


Ext.create('MyPanel', {
renderTo: Ext.getBody(),
width: 200,
height: 200
});
});

[elettronik]

Adding your logging to my project event, it tell me the following:


before render constructor tab ComponentLocalization.js:29 (http://localhost:7080/wag/common//localization/ComponentLocalization.js)
before render constructor undefined ComponentLocalization.js:29 (http://localhost:7080/wag/common//localization/ComponentLocalization.js)


The class hierarchy in my application is the following: Ext.form.Panel -> MyAppCustomFormPanel -> MyAppPanel. In MyAppCustomFormPanel, I exec some logic in render event configured using listener, and in MyAppPanel I add textField as Item. The beforeRender event seem only trigger for MyAppPanel class and not for its children.

[vietits]

Could you post a test case?