Stack blur filter issue on canvas load

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.7.3/fabric.min.js"></script>
<canvas id="my-canvas"></canvas>
<div>
  <button id="load-canvas2" class="green">LOAD CANVAS</button>
  <button  class="blue">ADD BLUR</button>
  <input id="add-blur" type="range" min="1" max="100" step="1">
</div>
<button id="load-canvas1" class="red">LOAD WITH BLUR</button>

CSS

button {
	border: 0 none;
	background: #fff;
	border-radius: 5px;
	cursor: pointer;
	color: #333;
	box-shadow: 0 4px 6px rgba(50, 50, 93, 0.11), 0 1px 3px rgba(0, 0, 0, 0.08);
	padding: 11px 22px;
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 1px;
	margin: 10px auto;
	outline: 0 none;
}

button.blue {
  background: #1877FF;
  color: #fff;
}

button.red {
  background: #C35A2D;
  color: #fff;
}

button.green {
  background: #65C879;
  color: #fff;
}

JavaScript

/**
 * Stack blur filter for fabricjs
 * Example:
 * obj.filters.push(new fabric.Image.filters.StackBlur(6));
 * obj.applyFilters(canvas.renderAll.bind(canvas));
 *
 * Heavily inspired by:
 * https://gist.github.com/pierrickouw/2ab679159beee9d80ca6
 * http://www.quasimondo.com/StackBlurForCanvas/StackBlurDemo.html
 * uses stackBlurCanvasRGBA function but could be swapped be stackBlurCanvasRGB
 * @see: http://www.quasimondo.com/StackBlurForCanvas/StackBlur.js
 */
var fabric = window.fabric,
    extend = fabric.util.object.extend;

var mul_table = [
  512,512,456,512,328,456,335,512,405,328,271,456,388,335,292,512,
  454,405,364,328,298,271,496,456,420,388,360,335,312,292,273,512,
  482,454,428,405,383,364,345,328,312,298,284,271,259,496,475,456,
  437,420,404,388,374,360,347,335,323,312,302,292,282,273,265,512,
  497,482,468,454,441,428,417,405,394,383,373,364,354,345,337,328,
  320,312,305,298,291,284,278,271,265,259,507,496,485,475,465,456,
  446,437,428,420,412,404,396,388,381,374,367,360,354,347,341,335,
  329,323,318,312,307,302,297,292,287,282,278,273,269,265,261,512,
  505,497,489,482,475,468,461,454,447,441,435,428,422,417,411,405,
  399,394,389,383,378,373,368,364,359,354,350,345,341,337,332,328,
  324,320,316,312,309,305,301,298,294,291,287,284,281,278,274,271,
  268,265,262,259,257,507,501,496,491,485,480,475,470,465,460,456,
  451,446,442,437,433,428,424,420,416,412,408,404,400,396,392,388,
  385,381,377,374,370,367,363,360,357,354,350,347,344,341,338,335,
  332,329,326,323,320,318,315,312,310,307,304,302,299,297,294,292,
  289,287,285,282,280,278,275,273,271,269,267,265,263,261,259
];
var shg_table = [
  9, 11, 12, 13, 13, 14, 14, 15, 15, 15, 15, 16, 16, 16, 16, 17,
  17, 17, 17, 17, 17, 17, 18, 18, 18, 18, 18, 18, 18, 18, 18, 19,
  19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 20, 20, 20,
  20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 21,
  21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21,
  21, 21, 21, 21, 21, 21,...