fabric.js resize object on canvas resize

Problem resizing canvas object on canvas resize

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/fabric.js/1.4.13/fabric.min.js"></script>
<div id="canvas">
	<canvas id="clone" width="480" height="317"></canvas>
</div>
<button id="test-resize" type="button" class="btn btn-success btn-sm">resize</button>
<button style="display:none" id="undo-resize" type="button" class="btn btn-success btn-sm">undo</button>

JavaScript

var canvas = new fabric.Canvas("clone", {
      backgroundColor : "#000",
      selection: true
   });
var text1 = new fabric.Text("SOME TEXT", {
	left: 160,
	top: 270,
   fill:"#fff"
});
canvas.add(text1);
$("#test-resize").click(function(){
	canvas.setWidth(1075);
	canvas.setHeight(709);
	canvas.calcOffset();
	canvas.renderAll();
    $("#undo-resize").show();
    $(this).hide();
var svg = canvas.toSVG({
  viewBox: {
    width: 300,
    height: 200
  }
});
    //window.open('data:image/svg+xml;utf8,' + encodeURIComponent(svg));
});
$("#undo-resize").click(function(){
	canvas.setWidth(300);
	canvas.setHeight(200);
	canvas.calcOffset();
	canvas.renderAll();
    $("#test-resize").show();
     $(this).hide();
});