added test for hit region draw from blurred image

src/Shape.js

@@ -319,14 +319,18 @@
         * draw hit graph using the cached scene canvas
         * @method
         * @memberof Kinetic.Shape.prototype
+        * @param {Integer} alphaThreshold alpha channel threshold that determines whether or not
+        *  a pixel should be drawn onto the hit graph.  Must be a value between 0 and 255.  
+        *  The default is 0
         * @returns {Kinetic.Shape}
         * @example
         * shape.cache();
         * shape.drawHitFromCache();
         */
-        drawHitFromCache: function() {
-            var cachedCanvas = this._cache.canvas,
-                sceneCanvas = cachedCanvas.scene,
+        drawHitFromCache: function(alphaThreshold) {
+            var threshold = alphaThreshold || 0,
+                cachedCanvas = this._cache.canvas,
+                sceneCanvas = this._getCachedSceneCanvas(),
                 sceneContext = sceneCanvas.getContext(),
                 hitCanvas = cachedCanvas.hit,
                 hitContext = hitCanvas.getContext(),
@@ -347,11 +351,11 @@
                 // replace non transparent pixels with color key
                 for(i = 0; i < len; i += 4) {
                     alpha = sceneData[i + 3];
-                    if (alpha > 0) {
+                    if (alpha > threshold) {
                         hitData[i] = rgbColorKey.r;
                         hitData[i + 1] = rgbColorKey.g;
                         hitData[i + 2] = rgbColorKey.b;
-                        hitData[i + 3] = alpha;
+                        hitData[i + 3] = 255;
                     }
                 }
 

test/runner.js

@@ -102,6 +102,11 @@ function addContainer() {
   return container;
 }
 
+function showCanvas(canvas) {
+  canvas.style.position = 'relative';
+
+  kineticContainer.appendChild(canvas);
+}
 function showHit(layer) {
   var canvas = layer.hitCanvas._canvas;
   canvas.style.position = 'relative';

test/unit/filters/Blur-test.js

@@ -277,4 +277,43 @@ suite('Blur', function() {
         };
         imageObj.src = 'assets/lion.png';
     });
+
+    // ======================================================
+    test('blur hit region', function(done) {
+        var stage = addStage();
+
+        var imageObj = new Image();
+        imageObj.onload = function() {
+            
+            var layer = new Kinetic.Layer();
+            darth = new Kinetic.Image({
+                x: 10,
+                y: 10,
+                image: imageObj,
+                draggable: true
+            });
+
+            layer.add(darth);
+            stage.add(layer);
+
+            darth.cache();
+            darth.filters([Kinetic.Filters.Blur]);
+            darth.blurRadius(20);
+            darth.drawHitFromCache(100);
+            layer.draw();
+
+            showCanvas(darth._cache.canvas.hit._canvas);
+
+            //console.log(darth._cache.canvas.hit.getContext().getTrace(true));
+
+            assert.equal(darth._cache.canvas.hit.getContext().getTrace(true), 'save();translate();beginPath();rect();closePath();save();fillStyle;fill();restore();restore();clearRect();getImageData();putImageData();');
+
+
+
+            done();
+
+        };
+        imageObj.src = 'assets/lion.png';
+    });
+
 });