Can you give me an example/share the code of the custom component you're creating? I wanted to understand why doing this in an "after" render listener, or by chaining renderUI (depending on the use case), is not appropriate.

Thanks.

Hi Satyen,
I'm trying to extend Overlay, and in my renderUI method, I'm wanting to access the header node to insert another widget I need.

Heres some psuedo-code I am using:
renderUI:function(){
var closeButton = new Y.MyButton();
closeButton.render(this.get('boundingBox'))
this.set('headerContent', closeButton.get('boundingBox'))
}

Which feels a little clunkier than it has to be, if I could just do:

closeButton.render(this.getStdModNode('header'))

However, during renderUI, this.getStdModNode('header') will return null, and hence render the button to the body)

I suppose I could do an afterRender listener, but since the stdmod is also done after render, my worry is in the order integrity. Maybe it's psychological, but I don't feel like there is a way to guarantee that my after Render call will fire at the appropriate time, or at least that there is no way to guarantee it.

I theoretically could modify it to do this work after it has rendered, but I've tried to avoid putting lifecycle specific actions outside of the lifecycle.

This one just seemed like a defect just because the stdmod plugin explicitly states that it won't add in it's modules until after the widget has been rendered. I'm open to being wrong on it, but if so, then I think it would be helpful to have some clarity on what core widget elements are available to access during the render phase.

Thanks for looking at this Satyen,

I came across the same situation. I was extending a customize Widget (with WidgetStdMod extension added) and tried to insert a textbox and a couple of buttons to the header. In the renderUI, this.getStdModNode('header") returns null.

I traced the code down to this(see below code excerpt from widget-stdmod.js).

_renderUIStdmod only add a class to the contentBox <div> and the reset of the rendering is done in _synUIStdMod(). That is why there is no access to header, body or footer.

{ { {
_syncUIStdMod : function() {
this._uiSetStdMod(STD_HEADER, this.get(STD_HEADER + CONTENT_SUFFIX));
this._uiSetStdMod(STD_BODY, this.get(STD_BODY + CONTENT_SUFFIX));
this._uiSetStdMod(STD_FOOTER, this.get(STD_FOOTER + CONTENT_SUFFIX));
this._uiSetFillHeight(this.get(FILL_HEIGHT));
},
...
_renderUIStdMod : function() {
this._stdModNode.addClass(Widget.getClassName(STDMOD));
},

One additional side effect of this is that when Overlay is getting centered, it is centered before content is set for HEADER,BODY,FOOTER.
Because of that the size of overlay is calculated wrong and it ends up misaligned.

Pulling into 3.1. About to checkin fix for it.

Honor renderUI as the phase which lays down DOM elements for header/body/footer. Fixes #2528232
View Commit: