From 1f075ab889e6dae328f997ad4c760368773c5391 Mon Sep 17 00:00:00 2001
From: tsayen <anatoly.sayenko@gmail.com>
Date: Thu, 23 Apr 2015 12:54:43 +0200
Subject: [PATCH] add regression test for simple css

---
 .gitignore                            |  1 +
 Gruntfile.js                          |  8 +++-----
 demo/firefox/firefox.html             |  1 -
 dist/dom-to-image.min.js              |  2 +-
 spec/domvas.spec.js                   | 20 +++++++++++++++-----
 spec/resources/regression-simple.html | 20 +++++++++++++++-----
 6 files changed, 35 insertions(+), 17 deletions(-)

diff --git a/.gitignore b/.gitignore
index 1bcc565b..816f2901 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,4 @@
 node_modules
 bower_components
 *.iml
+.sublime*
diff --git a/Gruntfile.js b/Gruntfile.js
index bf9f2fba..d278d0fe 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -6,16 +6,14 @@ module.exports = function (grunt) {
             files: ['Gruntfile.js', 'src/**/*.js', 'spec/**/*.js'],
             options: {
                 globals: {
-                    console: true,
-                    module: true,
-                    document: true
+                    console: true
                 }
             }
         },
         karma: {
             unit: {
                 configFile: 'karma.conf.js',
-                background: true,
+                background: false,
                 autoWatch: false
             }
         },
@@ -41,5 +39,5 @@ module.exports = function (grunt) {
     grunt.loadNpmTasks('grunt-contrib-watch');
 
     grunt.registerTask('test', ['karma']);
-    grunt.registerTask('default', ['test', 'uglify']);
+    grunt.registerTask('default', ['jshint', 'test', 'uglify']);
 };
diff --git a/demo/firefox/firefox.html b/demo/firefox/firefox.html
index 663a3cc3..cf425232 100644
--- a/demo/firefox/firefox.html
+++ b/demo/firefox/firefox.html
@@ -36,7 +36,6 @@
         height: 33.333333%;
         width: 100%;
         border: 1px solid lightgrey;
-        border-radius: 6px;
     }
     
     .image {
diff --git a/dist/dom-to-image.min.js b/dist/dom-to-image.min.js
index cfdbc056..907a47ce 100644
--- a/dist/dom-to-image.min.js
+++ b/dist/dom-to-image.min.js
@@ -1,2 +1,2 @@
-/*! dom-to-image 22-04-2015 */
+/*! dom-to-image 23-04-2015 */
 !function(a){"use strict";function b(b,c){var d=a.window.getComputedStyle(b);if(d.cssText)return void(c.style.cssText=d.cssText);for(var e=0;e<d.length;e++){var f=d[e];c.style.setProperty(f,d.getPropertyValue(f),d.getPropertyPriority(f))}}function c(a,c){var d=a.querySelectorAll("*"),e=c.querySelectorAll("*");b(c,a),Array.prototype.forEach.call(d,function(a,c){b(e[c],a)}),a.style.margin=a.style.marginLeft=a.style.marginTop=a.style.marginBottom=a.style.marginRight=""}function d(){return{toImage:function(a,b,d,e,f,g){f=f||0,g=g||0;var h=a.cloneNode(!0);c(h,a),h.setAttribute("xmlns","http://www.w3.org/1999/xhtml");var i=(new XMLSerializer).serializeToString(h),j="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='"+((d||a.offsetWidth)+f)+"' height='"+((e||a.offsetHeight)+g)+"'><foreignObject width='100%' height='100%' x='"+f+"' y='"+g+"'>"+i+"</foreignObject></svg>",k=new Image;k.src=j,k.onload=function(){b&&b.call(k,k)}}}}a.domvas=d()}(this);
\ No newline at end of file
diff --git a/spec/domvas.spec.js b/spec/domvas.spec.js
index eac6ada6..99065008 100644
--- a/spec/domvas.spec.js
+++ b/spec/domvas.spec.js
@@ -10,8 +10,19 @@ describe('domvas', function () {
     it('should render simple css correctly', function (done) {
         loadHtml('regression-simple.html').then(function () {
             var dom_node = $('#dom-node')[0];
-            console.log('hey! ' + dom_node);
-            done();
+            domvas.toImage(dom_node, function (image) {
+                var canvas = $('#rendered-image')[0];
+                canvas.getContext('2d').drawImage(image, 0, 0);
+                var renderedImage = new Image();
+                renderedImage.src = canvas.toDataURL();
+
+                var controlImage = $('#control-image')[0];
+
+                assert.ok(imagediff.equal(renderedImage, controlImage));
+                done();
+            });
+        }).catch(function (e) {
+            console.error(e);
         });
     });
 
@@ -19,7 +30,6 @@ describe('domvas', function () {
         return new Promise(function (resolve, reject) {
             var url = '/base/spec/resources/' + fileName;
             var request = new XMLHttpRequest();
-            console.log('request ' + request);
             request.open('GET', url, true);
             request.responseType = 'text/html';
 
@@ -29,9 +39,9 @@ describe('domvas', function () {
                     content.innerHTML = request.response.toString();
                     $('body')[0].appendChild(content);
                     resolve();
-                };
+                }
             };
-            
+
             request.send();
         });
     }
diff --git a/spec/resources/regression-simple.html b/spec/resources/regression-simple.html
index 61110e89..a1fb08e6 100644
--- a/spec/resources/regression-simple.html
+++ b/spec/resources/regression-simple.html
@@ -27,11 +27,21 @@
     height: 33.333333%;
     width: 100%;
     border: 1px solid lightgrey;
-    border-radius: 6px;
 }
 </style>
-<div id="dom-node">
-    <div class="red"></div>
-    <div class="green"></div>
-    <div class="blue"></div>
+<div>
+    <h1>DOM node</h1>
+    <div id="dom-node">
+        <div class="red"></div>
+        <div class="green"></div>
+        <div class="blue"></div>
+    </div>
+</div>
+<div>
+    <h1>rendered image</h1>
+    <canvas id="rendered-image" width="100px" height="100px"></canvas>
+</div>
+<div>
+    <h1>control image</h1>
+    <img id="control-image" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAABFUlEQVR4nO3bsQkDMBAEwS/dPaogOTMIFaAFTzAVLFx2MzOblNlrLQKOIHuGhwSJESRGkBhBYgSJESRGkBhBYgSJESRGkBhBYgSJESRGkBhBYgSJESRGkBhBYgSJESRGkBhBYgSJESRGkBhBYgSJESTmCsJ7gsQcQeYzPCRIjCAxgsQIEiNIjCAxgsQIEiNIjCAxgsQIEiNIjCAxgsQIEiNIjCAxgsQIEiNIjCAxgsQIEiNIjCAxgsQIEiNIzBWE9wSJOSfr/avrrwkSI0iMIDGCxAgSI0iMIDGCxAgSI0iMIDGCxAgSI0iMIDGCxAgSI0iMIDGCxAgSI0iMIDGCxAgSI0iMIDGCxAgSI0jMFYT3fkHo+ALCsir6OVPgZwAAAABJRU5ErkJggg==">
 </div>