starting work on composite view rendering through the collection view…

…. failing specs, i think caused by ItemView not rendering without a template

backbone.marionette.js

@@ -134,6 +134,8 @@ Backbone.Marionette = (function(Backbone, _, $){
   // A view that iterates over a Backbone.Collection
   // and renders an individual ItemView for each model.
   Marionette.CollectionView = Backbone.View.extend({
+    itemView: Marionette.ItemView,
+
     constructor: function(){
       Backbone.View.prototype.constructor.apply(this, arguments);
 
@@ -147,13 +149,30 @@ Backbone.Marionette = (function(Backbone, _, $){
     // Loop through all of the items and render 
     // each of them with the specified `itemView`.
     render: function(){
+      this.renderModel();
+
       this.collection.each(this.addChildView);
       if (this.onRender){
         this.onRender();
       }
       return this;
     },
 
+    // Render an individual model, if we have one, as
+    // part of a composite view (branch / leaf). For example:
+    // a treeview.
+    renderModel: function(){
+      if (this.model){
+        var itemView = new Marionette.ItemView({
+          model: this.model,
+          template: this.template
+        });
+        itemView.render();
+
+        this.el.append(itemView.el.html());
+      }
+    },
+
     // Render the child item's view and add it to the
     // HTML for the collection view.
     addChildView: function(item){

spec/javascripts/collectionView.spec.js

@@ -35,6 +35,10 @@ describe("collection view", function(){
       el.prepend(html);
     }
   });
+
+  var CompositeView = Backbone.Marionette.CollectionView.extend({
+    template: "#composite-template"
+  });
 
   describe("when rendering a collection view", function(){
     var collection = new Collection([{foo: "bar"}, {foo: "baz"}]);
@@ -118,6 +122,34 @@ describe("collection view", function(){
     });
   });
 
+  describe("when a collection view has a model and a template", function(){
+    var compositeView;
+    var model, collection;
+
+    beforeEach(function(){
+      loadFixtures("compositeTemplate.html");
+
+      model = new Model({foo: "bar"});
+      collection = new Collection();
+      collection.add(model);
+
+      compositeView = new CompositeView({
+        model: model,
+        collection: collection
+      });
+
+      compositeView.render();
+    });
+
+    it("should render the template with the model", function(){
+      expect(compositeView.el).toHaveHtml(/composite bar/);
+    });
+
+    it("should render the collection's items", function(){
+      expect(compositeView.el).toHaveHtml(/item bar/);
+    });
+  });
+
   describe("when a model is removed from the collection", function(){
     var collectionView;
     var collection;

spec/javascripts/fixtures/compositeTemplate.html

@@ -0,0 +1,3 @@
+<script id="composite-template" type="text/template">
+  composite <%= foo %>
+</script>