rethink support for labels

[wkeese]

Checkbox apparently has support for the following syntax for labelling:

<d-checkbox id="contains"></d-checkbox>
<label for="contains">contains</label>

It apparently triggers this code in Checkbox.js, so that clicking the <label> focuses the <d-checkbox>:

// The fact that deliteful/Checkbox is not an HTMLInputElement seems not being compatible with the default
// "<label for" behavior of the browser. So it needs to explicitly listen to click on associated
// <label for=...> elements.
if (!labelClickHandler) {
    // set a global listener that listens to click events on label elt
    labelClickHandler = function (e) {
        var forId;
        if (/label/i.test(e.target.tagName) && (forId = e.target.getAttribute("for"))) {
            var elt = document.getElementById(forId);
            if (elt && elt.render && elt._lbl4 !== undefined) { //_lbl4: to check it's a checkbox
                // call click() on the input instead of this.toggle() to get the 'change' event for free
                elt.focusNode.click();
            }
        }
    };
    this.ownerDocument.addEventListener("click", labelClickHandler);
}

The issues are:

1. Why is this code only for checkbox? What about <d-combobox> etc.? Probably the code should be in delite as a service to be used by various deliteful widgets.
2. I don't see any tests for Combobox labels.
3. The test for tagName === "label" should check the regex /^label$/i not /label/i.
4. As I wrote in https://bugs.dojotoolkit.org/ticket/18471, the markup should really be something like:

<span id="foo_label">Label</span>
<d-combobox aria-labelledby="foo_label">
   ...
</d-combobox>

While the <label> syntax is easier to read and more familiar to developers, it doesn't work for Safari VoiceOver (iOS 8.1), and it isn't technically correct, according to the ARIA spec. I didn't try iOS 8.3 though.