huge changes to Text shape. Skinnied it up by removing rectangle rendering component. textFill is now fill, textStroke is now stroke, textShadow is now shadow, and textStrokeWidth is now strokeWidth

tests/js/unit/shapeTests.js

@@ -260,5 +260,73 @@ Test.Modules.SHAPE = {
 
         };
         imageObj.src = '../assets/darth-vader.jpg';
+    },
+    'test size setters and getters': function(containerId) {
+        var stage = new Kinetic.Stage({
+            container: containerId,
+            width: 578,
+            height: 200
+        });
+        var layer = new Kinetic.Layer();
+
+        var circle = new Kinetic.Circle({
+            x: stage.getWidth() / 2,
+            y: stage.getHeight() / 2,
+            radius: 50,
+            fill: 'red'
+        });
+
+        var ellipse = new Kinetic.Ellipse({
+            x: stage.getWidth() / 2,
+            y: stage.getHeight() / 2,
+            radius: {
+                x: 100,
+                y: 50
+            },
+            fill: 'yellow'
+        });
+
+        layer.add(ellipse);
+        layer.add(circle);
+        stage.add(layer);
+
+        // circle tests
+        test(circle.attrs.width === undefined, 'circle.attrs.width should be undefined');
+        test(circle.attrs.height === undefined, 'circle.attrs.height should be undefined');
+        test(circle.getWidth() === 100, 'circle width should be 100');
+        test(circle.getHeight() === 100, 'circle height should be 100');
+        test(circle.getSize().width === 100, 'circle width should be 100');
+        test(circle.getSize().height === 100, 'circle height should be 100');
+        test(circle.getRadius() === 50, 'circle radius should be 50');
+
+        circle.setWidth(200);
+
+        test(circle.attrs.width === 200, 'circle.attrs.width should be 200');
+        test(circle.attrs.height === undefined, 'circle.attrs.height should be undefined');
+        test(circle.getWidth() === 200, 'circle width should be 200');
+        test(circle.getHeight() === 200, 'circle height should be 200');
+        test(circle.getSize().width === 200, 'circle width should be 200');
+        test(circle.getSize().height === 200, 'circle height should be 200');
+        test(circle.getRadius() === 100, 'circle radius should be 100');
+
+        // ellipse tests
+        test(ellipse.attrs.width === undefined, 'ellipse.attrs.width should be undefined');
+        test(ellipse.attrs.height === undefined, 'ellipse.attrs.height should be undefined');
+        test(ellipse.getWidth() === 200, 'ellipse width should be 200');
+        test(ellipse.getHeight() === 100, 'ellipse height should be 100');
+        test(ellipse.getSize().width === 200, 'ellipse width should be 200');
+        test(ellipse.getSize().height === 100, 'ellipse height should be 100');
+        test(ellipse.getRadius().x === 100, 'ellipse radius x should be 100');
+
+        ellipse.setWidth(400);
+
+        test(ellipse.attrs.width === 400, 'ellipse.attrs.width should be 400');
+        test(ellipse.attrs.height === undefined, 'ellipse.attrs.height should be undefined');
+        test(ellipse.getWidth() === 400, 'ellipse width should be 400');
+        test(ellipse.getHeight() === 100, 'ellipse height should be 100');
+        test(ellipse.getSize().width === 400, 'ellipse width should be 400');
+        test(ellipse.getSize().height === 100, 'ellipse height should be 100');
+        test(ellipse.getRadius().x === 200, 'ellipse radius x should be 200');
+
     }
 };