How to use didRender event on a component?

I want to start some css transition when my page is fully loaded(including all background images), so I am trying
didRender event of a component but its never called.This is how my codes look like

export default Ember.Component.extend({
    didRender() {
    	console.log('did render working');
		var home =$('#main-outlet')[0];
	    home.className += " homePage";
		startTimer(5);
	},
	willDestroyElement() {
		console.log("destroying view");
		var home = $('#main-outlet')[0];
	    home.className = " wrap";
	}
});

When I use didInsertElement, my code works fine but executed before getting loading the images itself?
Any idea or an alternative approach on this?