Question

I am having trouble figuring out how to use dojo/aspect with widgets.

Consider the following:

require( [ 'dijit/form/Button' ],
function( Button)
{
    var myButton = new Button({label: 'Click me!'});
} );

How would I connect to the button’s postCreate() or startup() methods to discover when it has been rendered?

There seems to be no point when I can add advice to a method. See the comments, here:

require( [ 'dijit/form/Button', 'dojo/aspect' ],
function( Button, aspect )
{
    // I cannot use aspect.after() here as I have no instance yet
    var myButton = new Button({label: 'Click me!'});
    // ...but I cannot do it here either as the lifecycle has already kicked off
} );

(The button is just to make it easier to explain the issue. My real-world problem involves widgets that contain other widgets, so I need to know when the whole lot have rendered before performing an action).

Answer 1

By instantiating the widget programmatically, the postCreate method of the widget is implicitly being called. As far as I know there isn’t an easy (or really a good reason to) to connect to the postCreate stage in the widget lifecycle.

startup, on the other hand you need to call explicitly when programmatically instantiating a widget:

var myButton = new Button({label: 'Click me!'});
aspect.after(myButton, 'startup', function(){
    console.log('startup called');
});
//place button in page (since startup implies the widget has been placed in the page
myButton.placeAt(someDomNode)
myButton.startup();

If you want to do work during the postCreate lifecycle of a widget, you’ll likely want to subclass that widget. Doing so would look something like this:

//in a file like my/custom/widget.js
define(['dojo/_base/declare','dijit/form/Button'],function(declare,Button){
  return declare('my.custom.widget',[Button],{
    postCreate:function(){
      //we still want to call the parent class's postCreate function
      this.inherited(arguments);
      //create some other widgets as well
    }
  });
});