I'm trying to extend the DatePicker in a way, that there is also a ui component inside of the DatePicker to customize the time aspect of a Date instance, not just the ... uhm ... date ^.^

Therefore i created a new widget "TimePicker" which is essentially a composite of some sliders and (that's the important thing) a TextField.

Another new widget "DateTimePicker" is also a composite which the DatePicker as base (this.initWidget(datePicker) and a TimePicker which is injected into the DOM of the DatePicker in the same way as the "Today" button is inserted into the DatePicker DOM.

I use this function to create another row above the row with the today button.
Code:
public XElement renderTimePickerContainer(XElement datePickerElement) {    
    final Element tableElement = datePickerElement.selectNode(datePickerAppearance.todayButtonSelector()).getParentElement().getParentElement();
    
    com.google.gwt.user.client.Element rowElement = DOM.createTR();
    
    com.google.gwt.user.client.Element columnElement = DOM.createTD();
    columnElement.setClassName(resources.css().timePickerContainer());
    
    rowElement.appendChild(columnElement);
    
    tableElement.insertFirst(rowElement);
    
    return XElement.as(columnElement);
}
In the constructor of DateTimePicker i do the following
Code:
this.datePicker = new DatePicker();
this.timePicker = new TimePicker();


initWidget(datePicker);


final XElement timePickerContainer = appearance.renderTimePickerContainer(getElement());
timePickerContainer.appendChild(timePicker.getElement());
And of course, i use the onAttach()/onDetach() methods of the composite to attach/detach the TimePicker properly, just as the same way the DatePicker does it with the "Today" button.

This seems to work very nice, but the TextField inside the TimePicker won't work correct. In order to test this, i replaced the TimePicker just with a single TextField. This won't work either. You are able to type in something and all seems well but if you typed in something, you can't reposition the cursor inside the TextField with your mouse.

I investigated alot in the event chain/bubbling of both components, but i don't get the failure. I even utilized JSNI to attach listeners to each element to trace DOM events. Thought the DatePicker captured some event which is important. But i don't see in which point the injected widget behaves other than a normal one.

Anyone has an idea? Would be great