diff --git a/tests/qunit/index.html b/tests/qunit/index.html
index a9f259569..1a465b504 100644
--- a/tests/qunit/index.html
+++ b/tests/qunit/index.html
@@ -69,14 +69,10 @@
                 <div style="padding: 15% 0 3%;"></div>
             </div>
 
-
-
-
             <div id="backgroundPosition">
                 <div style="background-position: 1px 0;"></div>
                 <div style="background-position: 1em 0;"></div>
                 <div style="background-position: thin medium;"></div>
-
                 <div style="background-position: 5em 5ex;"></div>
                 <div style="background-position: 5in 5cm;"></div>
                 <div style="background-position: 500in 500cm;"></div>
@@ -85,7 +81,6 @@
                 <div style="background-position: 500pc 500px;"></div> 
                 <div style="background-position: 5mm 5pt;"></div> 
                 <div style="background-position: 500mm 500pt;"></div> 
-
             </div>
 
             <div id="backgroundPositionPercentage">
@@ -93,6 +88,43 @@
                 <div style="background-position: center center;"></div> 
                 <div style="background-position: left bottom;"></div> 
             </div>
+
+            <style>
+                .linearGradientSimple {
+                    /* FF 3.6+ */
+                    background: -moz-linear-gradient(left, #ff0000, #ffff00, #00ff00);
+                    /* Chrome,Safari4+ */
+                    background: -webkit-gradient(linear, left top, right top, color-stop(#ff0000), color-stop(#ffff00), color-stop(#00ff00));
+                    /* Chrome 10+, Safari 5.1+ */
+                    background: -webkit-linear-gradient(left, #ff0000, #ffff00, #00ff00);
+                    /* Opera 11.10+ */
+                    background: -o-linear-gradient(left, #ff0000, #ffff00, #00ff00);
+                    /* IE 10+ */
+                    background: -ms-linear-gradient(left, #ff0000, #ffff00, #00ff00);
+                    /* W3C */
+                    background: linear-gradient(left, #ff0000, #ffff00, #00ff00);
+                }
+                .linearGradientWithStops {
+                    /* IE9 SVG */
+                    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2NlZGJlOSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjE3JSIgc3RvcC1jb2xvcj0iI2FhYzVkZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUwJSIgc3RvcC1jb2xvcj0iIzYxOTljNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjUxJSIgc3RvcC1jb2xvcj0iIzNhODRjMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjU5JSIgc3RvcC1jb2xvcj0iIzQxOWFkNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjcxJSIgc3RvcC1jb2xvcj0iIzRiYjhmMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijg0JSIgc3RvcC1jb2xvcj0iIzNhOGJjMiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMyNjU1OGIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
+                    /* FF 3.6+ */
+                    background: -moz-linear-gradient(left, #cedbe9 0%, #aac5de 17%, #6199c7 50%, #3a84c3 51%, #419ad6 59%, #4bb8f0 71%, #3a8bc2 84%, #26558b 100%);
+                    /* Chrome, Safari 4+ */
+                    background: -webkit-gradient(linear, left top, right top, color-stop(0%, #cedbe9), color-stop(17%, #aac5de), color-stop(50%, #6199c7), color-stop(51%, #3a84c3), color-stop(59%, #419ad6), color-stop(71%, #4bb8f0), color-stop(84%, #3a8bc2), color-stop(100%, #26558b));
+                    /* Chrome 10+, Safari 5.1+ */
+                    background: -webkit-linear-gradient(left, #cedbe9 0%, #aac5de 17%, #6199c7 50%, #3a84c3 51%, #419ad6 59%, #4bb8f0 71%, #3a8bc2 84%, #26558b 100%);
+                    /* Opera 11.10+ */
+                    background: -o-linear-gradient(left, #cedbe9 0%, #aac5de 17%, #6199c7 50%, #3a84c3 51%, #419ad6 59%, #4bb8f0 71%, #3a8bc2 84%, #26558b 100%);
+                    /* IE10+ */
+                    background: -ms-linear-gradient(left, #cedbe9 0%, #aac5de 17%, #6199c7 50%, #3a84c3 51%, #419ad6 59%, #4bb8f0 71%, #3a8bc2 84%, #26558b 100%);
+                    /* W3C */
+                    background: linear-gradient(left, #cedbe9 0%, #aac5de 17%, #6199c7 50%, #3a84c3 51%, #419ad6 59%, #4bb8f0 71%, #3a8bc2 84%, #26558b 100%);
+                }
+            </style>
+            <div id="backgroundGradients">
+                <div class="linearGradientSimple"></div>
+                <div class="linearGradientWithStops"></div>
+            </div>
         </div>
         <!--
        <div id="fixture-iframes"></div>
diff --git a/tests/qunit/unit/css.js b/tests/qunit/unit/css.js
index efb17872f..96956c730 100644
--- a/tests/qunit/unit/css.js
+++ b/tests/qunit/unit/css.js
@@ -1,9 +1,19 @@
+// declare vars (preventing JSHint messages)
+var test = test || function(){},
+    QUnit = QUnit || {},
+    _html2canvas = _html2canvas || {};
+
+
 module("CSS");
-$(function() {  
+$(function() {
+    
+    var propsToTest = {},
+        numDivs = {};
+    
    
   
-    var propsToTest = ["borderTopWidth", "borderRightWidth", "borderBottomWidth", "borderLeftWidth"],
-    numDivs = $('#borders div').length;
+    propsToTest['border-width'] = ["borderTopWidth", "borderRightWidth", "borderBottomWidth", "borderLeftWidth"],
+    numDivs['border-width'] = $('#borders div').length;
     /*
     expecting = [
     // #1
@@ -56,10 +66,10 @@ $(function() {
     ];
        */
        
-    test('border-width', propsToTest.length * numDivs, function() {  
+    test('border-width', propsToTest['border-width'].length * numDivs['border-width'], function() {  
             
         $('#borders div').each(function(i, el) {
-            $.each(propsToTest, function(s, prop) {
+            $.each(propsToTest['border-width'], function(s, prop) {
                 var expect = $(el).css(prop);
                 
                 // older IE's don't necessarily return px even with jQuery
@@ -76,32 +86,28 @@ $(function() {
         });
     });  
     
-    var propsToTest2 = ["paddingTop", "paddingRight", "paddingBottom", "paddingLeft"],
-    numDivs2 = $('#padding div').length;
+    propsToTest['padding width'] = ["paddingTop", "paddingRight", "paddingBottom", "paddingLeft"];
+    numDivs['padding width'] = $('#padding div').length;
     
-    test('padding width', propsToTest2.length * numDivs2 * 2, function() {  
+    test('padding width', propsToTest['padding width'].length * numDivs['padding width'] * 2, function() {  
             
         $('#padding div').each(function(i, el) {
-            $.each(propsToTest2, function(s, prop) {
+            $.each(propsToTest['padding width'], function(s, prop) {
                 var isPx = _html2canvas.Util.getCSS(el, prop).indexOf("px");
                 QUnit.notEqual( isPx, -1, "div #" + (i + 1) + " property " + prop + " is in pixels" );
                 QUnit.equal( _html2canvas.Util.getCSS(el, prop), $(el).css(prop), "div #" + (i + 1) + " property " + prop + " equals " + $(el).css(prop) ); 
             });
             
         });
-    }); 
-    
+    });
         
-
-    
-        
-    var propsToTest3 = ["backgroundPosition"],
-    numDivs3 = $('#backgroundPosition div').length;
+    propsToTest['background-position'] = ["backgroundPosition"];
+    numDivs['background-position'] = $('#backgroundPosition div').length;
     
-    test('background-position', propsToTest3.length * numDivs3 * 2, function() {  
+    test('background-position', propsToTest['background-position'].length * numDivs['background-position'] * 2, function() {  
             
         $('#backgroundPosition div').each(function(i, el) {
-            $.each(propsToTest3, function(s, prop) {
+            $.each(propsToTest['background-position'], function(s, prop) {
                 var img =  new Image();
                 img.width = 50;
                 img.height = 50;
@@ -113,7 +119,7 @@ $(function() {
                 if ( window.getComputedStyle ) {
                     split = $(el).css(prop).split(" ");
                 } else {
-                    split = [$(el).css(prop+"X"),$(el).css(prop+"Y")]
+                    split = [$(el).css(prop+"X"),$(el).css(prop+"Y")];
                 }
                 
                 var testEl = $('<div />').css({
@@ -139,4 +145,45 @@ $(function() {
     }); 
     
 // TODO add backgroundPosition % tests
+
+    propsToTest['background-gradient'] = ["backgroundImage"];
+    numDivs['background-gradient'] = $('#backgroundGradients div').length;
+    
+    test('background-gradient', propsToTest['background-gradient'].length * numDivs['background-gradient'], function() {  
+            
+        $('#backgroundGradients div').each(function(i, el) {
+            $.each(propsToTest['background-gradient'], function(s, prop) {
+                var src, img, canvas, ctx, id, data, len, red, green, blue, overallColor = 0;
+                
+                src = _html2canvas.Util.getCSS(el, prop),
+                img = _html2canvas.Generate.Gradient(src, {
+                    width: 50,
+                    height: 50
+                });
+                
+                canvas = document.createElement('canvas');
+                canvas.width = 50;
+                canvas.height = 50;
+                ctx = canvas.getContext('2d');
+                ctx.drawImage(img, 0, 0);
+                id = ctx.getImageData(0, 0, 50, 50);
+                data = id.data;
+                len = data.length;
+                
+                //console.log(img);
+                
+                for (var i = 0; i < len; i += 4) {
+                    red = data[i]; // red
+                    green = data[i + 1]; // green
+                    blue = data[i + 2]; // blue
+                    // i+3 is alpha (the fourth element)
+                    
+                    overallColor += (red + green + blue) / 3;
+                }
+                overallColor /= (len / 4);
+                
+                QUnit.notEqual(overallColor, 255, 'No Background Gradient - CSS was ' + src);
+            });
+        });
+    }); 
 });
\ No newline at end of file