ember: understand errors-Collection of common programming errors

It’s very difficult for me to understand ember.js errors. I always have to look at all my code and make random changes, because i can’t figure where errors are. In particular i have this error, modifying (but keeping structurally the same) the peepcode example:

Uncaught Error: Something you did caused a view to re-render after it rendered but 

before it was inserted into the DOM. application.js:30508
Ember.merge.rerender application.js:30508
Ember.View.Ember.CoreView.extend.rerender application.js:29198
Ember.View.Ember.CoreView.extend._controllerDidChange application.js:29117
sendEvent application.js:18480
Ember.notifyObservers application.js:17033
propertyDidChange application.js:17640
iterDeps application.js:17089
dependentKeysDidChange application.js:17113
propertyDidChange application.js:17638
set application.js:16460
Ember.View.Ember.CoreView.extend.createChildView application.js:30079
Ember.ContainerView.Ember.View.extend.init application.js:30944
superWrapper application.js:15393
Ember._Metamorph.Ember.Mixin.create.init application.js:32704
superWrapper application.js:15393
Class application.js:24583
Mixin.create.create application.js:24842
Ember.View.Ember.CoreView.extend.createChildView application.js:30063
Ember.merge.appendChild application.js:30517
Ember.View.Ember.CoreView.extend.appendChild application.js:29931
EmberHandlebars.ViewHelper.Ember.Object.create.helper application.js:33864
get application.js:34043
get application.js:38247
EmberHandlebars.registerHelper.context application.js:33224
program1 application.js:49634
(anonymous function) application.js:14488
Ember.View.Ember.CoreView.extend.render application.js:29173
Ember.CoreView.Ember.Object.extend._renderToBuffer application.js:28180
Ember.View.Ember.CoreView.extend._renderToBuffer application.js:29728
superWrapper application.js:15393
Ember.CoreView.Ember.Object.extend.renderToBuffer application.js:28159
Ember.Instrumentation.instrument application.js:15703
Ember.CoreView.Ember.Object.extend.renderToBuffer application.js:28158
Ember.ContainerView.Ember.View.extend.render application.js:30985
Ember.View.Ember.CoreView.extend.forEachChildView application.js:29412
Ember.ContainerView.Ember.View.extend.render application.js:30984
superWrapper application.js:15393
Ember.CoreView.Ember.Object.extend._renderToBuffer application.js:28180
Ember.View.Ember.CoreView.extend._renderToBuffer application.js:29728
superWrapper application.js:15393
Ember.CoreView.Ember.Object.extend.renderToBuffer application.js:28159
Ember.Instrumentation.instrument application.js:15703
Ember.CoreView.Ember.Object.extend.renderToBuffer application.js:28158
Ember.merge.appendChild application.js:30520
Ember.View.Ember.CoreView.extend.appendChild application.js:29931
EmberHandlebars.ViewHelper.Ember.Object.create.helper application.js:33864
get application.js:34043
handlebarsGet application.js:34260
Ember.Handlebars.registerHelper.template application.js:34684
anonymous application.js:49660
(anonymous function) application.js:14452
Ember.View.Ember.CoreView.extend.render application.js:29173
Ember.CoreView.Ember.Object.extend._renderToBuffer application.js:28180
Ember.View.Ember.CoreView.extend._renderToBuffer application.js:29728
superWrapper application.js:15393
Ember.CoreView.Ember.Object.extend.renderToBuffer application.js:28159
Ember.Instrumentation.instrument application.js:15703
Ember.CoreView.Ember.Object.extend.renderToBuffer application.js:28158
Ember.ContainerView.Ember.View.extend.render application.js:30985
Ember.View.Ember.CoreView.extend.forEachChildView application.js:29412
Ember.ContainerView.Ember.View.extend.render application.js:30984
superWrapper application.js:15393
Ember.CoreView.Ember.Object.extend._renderToBuffer application.js:28180
Ember.View.Ember.CoreView.extend._renderToBuffer application.js:29728
superWrapper application.js:15393
Ember.CoreView.Ember.Object.extend.renderToBuffer application.js:28159
Ember.Instrumentation.instrument application.js:15703
Ember.CoreView.Ember.Object.extend.renderToBuffer application.js:28158
Ember.merge.appendChild application.js:30520
Ember.View.Ember.CoreView.extend.appendChild application.js:29931
EmberHandlebars.ViewHelper.Ember.Object.create.helper application.js:33864
get application.js:34043
get application.js:38247
EmberHandlebars.registerHelper.context application.js:33224
anonymous application.js:49530
(anonymous function) application.js:14452
Ember.View.Ember.CoreView.extend.render application.js:29173
Ember.CoreView.Ember.Object.extend._renderToBuffer application.js:28180
Ember.View.Ember.CoreView.extend._renderToBuffer application.js:29728
superWrapper application.js:15393
Ember.CoreView.Ember.Object.extend.renderToBuffer application.js:28159
Ember.Instrumentation.instrument application.js:15703
Ember.CoreView.Ember.Object.extend.renderToBuffer application.js:28158
Ember.View.Ember.CoreView.extend.createElement application.js:29570
Ember.merge.insertElement application.js:30459
Ember.View.Ember.CoreView.extend._insertElement application.js:29502
RunLoop._prev application.js:18573
Ember.handleErrors application.js:14910
invoke application.js:18571
invokeOnceTimer application.js:19016
RunLoop._prev application.js:18573
Ember.handleErrors application.js:14910
invoke application.js:18571
iter application.js:18643
RunLoop.flush application.js:18697
RunLoop.end application.js:18602
tryable application.js:18806
Ember.tryFinally application.js:15548
Ember.run.end application.js:18809
Ember.tryFinally application.js:15550
Ember.run application.js:18765
Ember.Mixin.create.init application.js:41369
sendEvent application.js:18480
Ember.Evented.Ember.Mixin.create.trigger application.js:24352
DS.Model.Ember.Object.extend.trigger application.js:45189
superWrapper application.js:15393
    states.rootState.Ember.State.create.loaded.DS.State.create.materializing.DS.State.create.firstTime.DS.State.create.exit application.js:44608
    RunLoop._prev application.js:18573

Ember.handleErrors application.js:14910
invoke application.js:18571
invokeOnceTimer application.js:19016
RunLoop._prev application.js:18573
Ember.handleErrors application.js:14910
invoke application.js:18571
iter application.js:18643
RunLoop.flush application.js:18697
RunLoop.end application.js:18602
tryable application.js:18806
Ember.tryFinally application.js:15548
Ember.run.end application.js:18809
Ember.tryFinally application.js:15550
Ember.run application.js:18765
DS.RESTAdapter.DS.Adapter.extend.findAll.ajax.success application.js:49038
jQuery.Callbacks.fire application.js:1038
jQuery.Callbacks.self.fireWith application.js:1149
done application.js:8075
jQuery.ajaxTransport.send.callback

the error occurs then navigating typing this address (not navigating) transport_documents/2. If i navigate to this path, instead, the error is different: the first transport document I open is ok, while navigating to the second i get You can't call renderToBufferIfNeeded on a destroyed view

Is Ember too young to implement an error handling that can make a sense for the developer, or there’s some way i can debug my code more easily?

EDIT: here are my hbl:

APPLICATION

  
    {{outlet}}
  

TRANSPORT_DOCUMENTS

{{#each controller}} {{outlet}} {{/each}}

TRANSPORT_DOCUMENT

Hello world

ROUTER

App.Router.map ->
  @route "index", path: "/"
  @resource "transport_documents", ->
    @route 'new'
    @resource 'transport_document', {path: "/:transport_document_id"}


App.Router.reopen
  location: 'history'

App.TransportDocumentsRoute = Ember.Route.extend
  model: -> App.TransportDocument.find()

1. There are a couple of debuggers, as chrome extensions:

   ember inspector and ember extension. But they could not work, because ember is evolving faster than these plugins.

   The re-render bug is caused by an outlet wrongly inside a cycle

Originally posted 2013-11-23 09:50:31.