DateRangeSlider not getting rendered properly inside unified-shell

Hi,
The sap.suite.ui.commons.DateRangeSlider is not getting rendered properly in the content aggregation of sap.ui.unified.Shell but works fine in the Panecontent aggregation. It doesnt even throw any error. Please have a look into this.

here is my sample code:

<
DateRangeSlider
xmlns="sap.suite.ui.commons" id="daterangesel" visible="true"
width="100%" enabled="true" editable="true" showBubbles="true"
stepLabels="true" change="daychange" liveChange="daychange1">

</
DateRangeSlider>

onAfterRendering: function() {
this.byId("daterangesel").setDateFormat(sap.ui.core.format.DateFormat.getDateInstance(new sap.ui.core.Locale("de")));
this.byId("daterangesel").setMin(new Date(2015, 9, 17));
this.byId("daterangesel").setValue(new Date(2015, 9, 17));
this.byId("daterangesel").setMax(new Date(2015, 9, 21));
this.byId("daterangesel").setValue2(new Date(2015, 9, 21));
this.byId("daterangesel").setSmallStepWidth(1);
this.byId("daterangesel").setTotalUnits(4);
this.byId("daterangesel").setLabels(['Day1','Day2','Day3','Day4', 'Day5']);
},