Fix TeacherClassView sometimes not loading

This was a race condition where the view would trigger a render
before courses loaded, and the template required them when it had
some of its other resources.

app/templates/courses/teacher-class-view.jade

@@ -368,6 +368,7 @@ mixin copyCodes
 
 mixin bulkAssignControls
   .bulk-assign-controls.form-inline
+    - console.log('state errors', state.get('errors'))
     .no-students-selected.small-details(class=state.get('errors').assigningToNobody ? 'visible' : '')
       span(data-i18n='teacher.no_students_selected')
     .cant-assign-to-unenrolled.small-details(class=state.get('errors').assigningToUnenrolled ? 'visible' : '')
@@ -378,6 +379,7 @@ mixin bulkAssignControls
     select.bulk-course-select.form-control
       each trimCourse in _.rest(view.classroom.get('courses'))
         - var course = view.courses.get(trimCourse._id)
+        - console.log('???', course)
         option(value=course.id selected=(course===state.get('selectedCourse')))
           = course.get('name')
     button.btn.btn-primary-alt.assign-to-selected-students

app/views/courses/TeacherClassView.coffee

@@ -71,6 +71,10 @@ module.exports = class TeacherClassView extends RootView
     @singleStudentLevelProgressDotTemplate = require 'templates/teachers/hovers/progress-dot-single-student-level'
     @allStudentsLevelProgressDotTemplate = require 'templates/teachers/hovers/progress-dot-all-students-single-level'
     
+    @debouncedRender = _.debounce ->
+      console.log 'we debounced', @
+      @render()
+    
     @state = new State(@getInitialState())
     @updateHash @state.get('activeTab') # TODO: Don't push to URL history (maybe don't use url fragment for default tab)
     
@@ -121,10 +125,13 @@ module.exports = class TeacherClassView extends RootView
 
   attachMediatorEvents: () ->
     @listenTo @state, 'sync change', ->
+      console.log '...'
       if _.isEmpty(_.omit(@state.changed, 'searchTerm'))
-        @renderSelectors('#enrollment-status-table')
+        console.log 'render selectors...'
+#        @renderSelectors('#enrollment-status-table')
       else
-        @render()
+        console.log 'render...'
+#        @render()
     # Model/Collection events
     @listenTo @classroom, 'sync change update', ->
       classCode = @classroom.get('codeCamel') or @classroom.get('code')
@@ -137,7 +144,6 @@ module.exports = class TeacherClassView extends RootView
       @state.set selectedCourse: @courses.first() unless @state.get('selectedCourse')
     @listenTo @courseInstances, 'sync change update', ->
       @setCourseMembers()
-      @render() # TODO: use state
     @listenTo @courseInstances, 'add-members', ->
       noty text: $.i18n.t('teacher.assigned'), layout: 'center', type: 'information', killer: true, timeout: 5000
     @listenTo @students, 'sync change update add remove reset', ->
@@ -149,7 +155,6 @@ module.exports = class TeacherClassView extends RootView
       @state.set students: @students
     @listenTo @students, 'sort', ->
       @state.set students: @students
-      @render()
     @listenTo @, 'course-select:change', ({ selectedCourse }) ->
       @state.set selectedCourse: selectedCourse
 
@@ -162,6 +167,17 @@ module.exports = class TeacherClassView extends RootView
   onLoaded: ->
     @removeDeletedStudents() # TODO: Move this to mediator listeners? For both classroom and students?
     @calculateProgressAndLevels()
+    
+    # render callback setup
+    @listenTo @courseInstances, 'sync change update', @debouncedRender
+    console.log 'attaching'
+    @listenTo @state, 'sync change', ->
+      console.log 'we good'
+      if _.isEmpty(_.omit(@state.changed, 'searchTerm'))
+        @renderSelectors('#enrollment-status-table')
+      else
+        @debouncedRender()
+    @listenTo @students, 'sort', @debouncedRender
     super()
   
   afterRender: ->

test/app/views/teachers/TeacherClassView.spec.coffee

@@ -75,24 +75,29 @@ describe 'TeacherClassView', ->
     # it "shows the classroom's join code"
     
     describe 'the Students tab', ->
-      beforeEach ->
+      beforeEach (done) ->
         @view.state.set('activeTab', '#students-tab')
+        _.defer(done)
 
       # it 'shows all of the students'
       # it 'sorts correctly by Name'
       # it 'sorts correctly by Progress'
       
       describe 'bulk-assign controls', ->
-        it 'shows alert when assigning course 2 to unenrolled students', ->
+        it 'shows alert when assigning course 2 to unenrolled students', (done) ->
           expect(@view.$('.cant-assign-to-unenrolled').hasClass('visible')).toBe(false)
           @view.$('.student-row .checkbox-flat').click()
           @view.$('.assign-to-selected-students').click()
-          expect(@view.$('.cant-assign-to-unenrolled').hasClass('visible')).toBe(true)
+          _.defer =>
+            expect(@view.$('.cant-assign-to-unenrolled').hasClass('visible')).toBe(true)
+            done()
           
-        it 'shows alert when assigning but no students are selected', ->
+        it 'shows alert when assigning but no students are selected', (done) ->
           expect(@view.$('.no-students-selected').hasClass('visible')).toBe(false)
           @view.$('.assign-to-selected-students').click()
-          expect(@view.$('.no-students-selected').hasClass('visible')).toBe(true)
+          _.defer =>
+            expect(@view.$('.no-students-selected').hasClass('visible')).toBe(true)
+            done()
     
     # describe 'the Course Progress tab', ->
     #   it 'shows the correct Course Overview progress'