A modified version of core.js from the blossom test project that is not rendering as expected. I would expect to see a maroon rectangle inside of green rectangle.

Blossom sublayer

MyApp.layer = SC.Layer.create({
  layout: { width: 600, height: 400, top: 10, left: 10 },
  render: function(ctx) {
    ctx.fillStyle = '#859900'; // green
    ctx.fillRect(0, 0, ctx.width, ctx.height);
  }
});

MyApp.widget = SC.Widget.create({
  layout: {
    width: 100, height: 60, top: 10,left: 10
  },
  render: function(ctx) {
    ctx.fillStyle = "#990000"; // maroon
    ctx.fillRect(0,0, ctx.width, ctx.height);
  }
});

MyApp.layer.addSublayer(MyApp.widget);

function main() {
  var ui = MyApp.ui,
      layer = MyApp.layer;

  ui.get('layers').pushObject(layer);
  SC.app.set('ui', ui);
}