dijit/form/Button's _fillContent implementation breaks attach points inside Button content

[RoystonS]

If I have a templated control whose template looks like this:

<div>
    <div data-dojo-type="dijit/form/Button">
        <div>
            <h3 data-dojo-attach-point="titleNode"></h3>
            <span>Something else</span>
        </div>
        <span>Something else</span>
    </div>
</div>

(That is, it contains a button that contains some non-trivial content with an attach point inside.)

Then, when I try to access my widget's titleNode attach point (either directly or through _setXXXAttr mappings), I discover that it's actually pointing to a copy of the node that's actually in the DOM tree.

Normally, _TemplatedMixin._fillContent is responsible for moving the contained nodes of a templated widget into its containerNode. But Button has its own version of _fillContent that overrides this; instead of moving the actual nodes, it effectively clones them by converting the contained nodes to an innerHTML string, and then sets its label property to that HTML:

		
_fillContent: function(/*DomNode*/ source){
    // Overrides _Templated._fillContent().
    // If button label is specified as srcNodeRef.innerHTML rather than
    // this.params.label, handle it here.
    // TODO: remove the method in 2.0, parser will do it all for me
    if(source && (!this.params || !("label" in this.params))){
        var sourceLabel = lang.trim(source.innerHTML);
        if(sourceLabel){
            this.label = sourceLabel; // _applyAttributes will be called after buildRendering completes to update the DOM
        }
    }
},

When _WidgetBase continues and runs its _applyAttributes, that label is pushed into _ButtonMixin._setLabelAttr, which pushes that HTML string into the Button's containerNode, completing the clone of the original nodes, and meaning that the original attach point is now pointing to a different node than the one in the real DOM tree.

Interestingly, simply removing this overridden version of _fillContent and falling back to the one

[bill]

Hmm, Button#_fillContent() does seem weird now. OTOH, it triggers a call to _setLabelAttr(), which then sets this.titleNode.title according to the label. Need to keep that part working.

[bill]

OK, I will check in a fix for 1.11.

It turns out this change is complicated by the code in DropDownButton?.html that handles when the dropdown is specified as part of the button's content, like:

<div data-dojo-type=dijit/form/DropDownButton> 
    <span>click me</span>
    <span data-dojo-type=dijit/Menu>...</span>
</div>

To make things worse, specifying the label as an attribute also used to work (albeit it wasn't documented):

<div data-dojo-type=dijit/form/DropDownButton label="click me"> 
    <span data-dojo-type=dijit/Menu>...</span>
</div>

Anyway, that's why I'm not planning to backport the change, at least for now.

[Bill Keese <bill@…>]

In e54587ec56b1ee600bfe6a4c90f51d8c1a466134/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

[Bill Keese <[email protected]…>]

In 08b7c26a415887aee2da439f4d3a61fecfb71bc0/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

[Bill Keese <[email protected]…>]

In 57187e2/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled? 

[Bill Keese <[email protected]…>]

In 14d514e/dijit:

Error: Processor CommitTicketReference failed

Unsupported version control system "git": Can't find an appropriate component, maybe the corresponding plugin was not enabled?