nested children

lib/jasmine-2.0.0/jasmine.js

@@ -1767,10 +1767,10 @@ getJasmineRequireObj().matchersUtil = function(j$) {
         expected = args.slice(3),
         englishyPredicate = matcherName.replace(/[A-Z]/g, function(s) { return ' ' + s.toLowerCase(); });
 
-      var message = "Expected " +
+      var message = "Expected \n " +
         j$.pp(actual) +
-        (isNot ? " not " : " ") +
-        englishyPredicate;
+        (isNot ? " not " : " \n") +
+        englishyPredicate + "\n";
 
       if (expected.length > 0) {
         for (var i = 0; i < expected.length; i++) {

spec/LayoutSpec.js

@@ -88,7 +88,7 @@ describe('Layout', function() {
     testLayout({
       style: {width: 100, height: 200}
     }, {
-      width: 100, height: 200, left: 0, top: 0
+      width: 100, height: 200, top: 0, left: 0
     });
   });
 
@@ -101,7 +101,7 @@ describe('Layout', function() {
         {style: {width: 125, height: 125}}
       ]
     }, {
-      width: 1000, height: 1000, left: 0, top: 0,
+      width: 1000, height: 1000, top: 0, left: 0,
       children: [
         {width: 500, height: 500, top: 0, left: 0},
         {width: 250, height: 250, top: 500, left: 0},
@@ -109,5 +109,31 @@ describe('Layout', function() {
       ]
     });
   });
+
+  it('should layout node with nested children', function() {
+    testLayout({
+      style: {width: 1000, height: 1000},
+      children: [{
+        style: {width: 500, height: 500}
+      }, {
+        style: {width: 500, height: 500},
+        children: [
+          {style: {width: 250, height: 250}},
+          {style: {width: 250, height: 250}}
+        ]
+      }]
+    }, {
+      width: 1000, height: 1000, top: 0, left: 0,
+      children: [{
+        width: 500, height: 500, top: 0, left: 0
+      }, {
+        width: 500, height: 500, top: 500, left: 0,
+        children: [
+          {width: 250, height: 250, top: 0, left: 0},
+          {width: 250, height: 250, top: 250, left: 0},
+        ]
+      }]
+    });
+  });
 });
 

src/Layout.js

@@ -1,23 +1,22 @@
 
 function computeLayout(node) {
+
+  function layoutNode(node, parent) {
     var top = 0;
     var children = [];
     (node.children || []).forEach(function(child) {
-    console.log(child);
-    children.push({
+      children.push(layoutNode(child, {
         top: top,
-      left: 0,
-      width: child.style.width,
-      height: child.style.height
-    });
+        left: 0
+      }));
       top += child.style.height;
     });
 
     var result = {
-    top: 0,
-    left: 0,
       width: node.style.width,
-    height: node.style.height
+      height: node.style.height,
+      top: parent.top + 0,
+      left: parent.left + 0
     };
 
     if (children.length > 0) {
@@ -26,3 +25,6 @@ function computeLayout(node) {
     return result;
   }
 
+  return layoutNode(node, {top: 0, left: 0});
+}
+