be more strict on when not to re render (#3594)

* add more check to first return false

* fix ;

* fix ; in tests

* fix test

.eslintrc.json

@@ -14,6 +14,7 @@
     "process": true
   },
   "rules": {
+    "semi": 2,
     "eqeqeq": 2,
     "no-eq-null": 2,
     "no-eval": 2,

src/amd/requirejs.js

@@ -3,5 +3,5 @@
 window.fabric = fabric;
 
 if (typeof define === 'function' && define.amd) {
-  define([], function() { return fabric });
+  define([], function() { return fabric; });
 }

src/mixins/canvas_events.mixin.js

@@ -186,7 +186,7 @@
      */
     _onContextMenu: function (e) {
       if (this.stopContextMenu) {
-        e.stopPropagation()
+        e.stopPropagation();
         e.preventDefault();
       }
       return false;
@@ -266,7 +266,7 @@
     _shouldRender: function(target, pointer) {
       var activeObject = this.getActiveGroup() || this.getActiveObject();
 
-      if (activeObject && activeObject.isEditing) {
+      if (activeObject && activeObject.isEditing && target === activeObject) {
         // if we mouse up/down over a editing textbox a cursor change,
         // there is no need to re render
         return false;

src/mixins/canvas_serialization.mixin.js

@@ -126,7 +126,7 @@ fabric.util.object.extend(fabric.StaticCanvas.prototype, /** @lends fabric.Stati
         _this[property] = enlivedObject[0];
         loaded[property] = true;
         callback && callback();
-      })
+      });
     }
     else {
       this['set' + fabric.util.string.capitalize(property, true)](value, function() {

src/mixins/stateful.mixin.js

@@ -21,14 +21,14 @@
     }
     else if (origValue instanceof Array) {
       if (origValue.length !== currentValue.length) {
-        return false
+        return false;
       }
       for (var i = 0, len = origValue.length; i < len; i++) {
         if (origValue[i] !== currentValue[i]) {
           return false;
         }
       }
-      return true
+      return true;
     }
     else if (origValue && typeof origValue === 'object') {
       if (!firstPass && Object.keys(origValue).length !== Object.keys(currentValue).length) {

src/node.js

@@ -174,7 +174,7 @@
     this.contextContainer = this.nodeCanvas.getContext('2d');
     this.contextCache = this.nodeCacheCanvas.getContext('2d');
     this.Font = Canvas.Font;
-  }
+  };
 
   /** @ignore */
   fabric.StaticCanvas.prototype.createPNGStream = function() {

src/shapes/group.class.js

@@ -296,7 +296,7 @@
      */
     isCacheDirty: function() {
       if (this.callSuper('isCacheDirty')) {
-        return true
+        return true;
       }
       if (!this.statefullCache) {
         return false;
@@ -305,7 +305,7 @@
         if (this._objects[i].isCacheDirty(true)) {
           var dim = this._getNonTransformedDimensions();
           this._cacheContext.clearRect(-dim.x / 2, -dim.y / 2, dim.x, dim.y);
-          return true
+          return true;
         }
       }
       return false;

src/shapes/itext.class.js

@@ -1036,7 +1036,7 @@
         width += this._getWidthOfCharSpacing();
       }
       ctx.restore();
-      return width > 0 ? width : 0
+      return width > 0 ? width : 0;
     },
 
     /**

src/shapes/object.class.js

@@ -893,9 +893,9 @@
         this.cacheHeight = height;
         this.zoomX = zoomX;
         this.zoomY = zoomY;
-        return true
+        return true;
       }
-      return false
+      return false;
     },
 
     /**

src/shapes/path.class.js

@@ -485,7 +485,7 @@
      */
     toObject: function(propertiesToInclude) {
       var o = extend(this.callSuper('toObject', ['sourcePath', 'pathOffset'].concat(propertiesToInclude)), {
-        path: this.path.map(function(item) { return item.slice() })
+        path: this.path.map(function(item) { return item.slice(); })
       });
       return o;
     },

src/shapes/path_group.class.js

@@ -112,7 +112,7 @@
      */
     isCacheDirty: function() {
       if (this.callSuper('isCacheDirty')) {
-        return true
+        return true;
       }
       if (!this.statefullCache) {
         return false;
@@ -121,7 +121,7 @@
         if (this.paths[i].isCacheDirty(true)) {
           var dim = this._getNonTransformedDimensions();
           this._cacheContext.clearRect(-dim.x / 2, -dim.y / 2, dim.x, dim.y);
-          return true
+          return true;
         }
       }
       return false;

src/static_canvas.class.js

@@ -458,7 +458,7 @@
      * @private
      */
     _createCanvasElement: function(canvasEl) {
-      var element = fabric.util.createCanvasElement(canvasEl)
+      var element = fabric.util.createCanvasElement(canvasEl);
       if (!element.style) {
         element.style = { };
       }
@@ -783,7 +783,7 @@
       this.backgroundImage = null;
       this.overlayImage = null;
       this.backgroundColor = '';
-      this.overlayColor = ''
+      this.overlayColor = '';
       if (this._hasITextHandlers) {
         this.off('selection:cleared', this._canvasITextSelectionClearedHanlder);
         this.off('object:selected', this._canvasITextSelectionClearedHanlder);
@@ -1082,12 +1082,12 @@
      * @private
      */
     __serializeBgOverlay: function(methodName, propertiesToInclude) {
-      var data = { }
+      var data = { };
 
       if (this.backgroundColor) {
         data.background = this.backgroundColor.toObject
           ? this.backgroundColor.toObject(propertiesToInclude)
-          : this.backgroundColor
+          : this.backgroundColor;
       }
 
       if (this.overlayColor) {

test/unit/canvas.js

@@ -54,7 +54,7 @@
 
   function getAbsolutePath(path) {
     var isAbsolute = /^https?:/.test(path);
-    if (isAbsolute) { return path };
+    if (isAbsolute) { return path; };
     var imgEl = _createImageElement();
     imgEl.src = path;
     var src = imgEl.src;
@@ -258,7 +258,7 @@
 
   test('before:selection:cleared', function() {
     var isFired = false;
-    canvas.on('before:selection:cleared', function() { isFired = true });
+    canvas.on('before:selection:cleared', function() { isFired = true; });
 
     canvas.add(new fabric.Rect());
     canvas.remove(canvas.item(0));
@@ -274,7 +274,7 @@
 
   test('selection:cleared', function() {
     var isFired = false;
-    canvas.on('selection:cleared', function() { isFired = true });
+    canvas.on('selection:cleared', function() { isFired = true; });
 
     canvas.add(new fabric.Rect());
     canvas.remove(canvas.item(0));

test/unit/canvas_static.js

@@ -42,7 +42,7 @@
 
   function getAbsolutePath(path) {
     var isAbsolute = /^https?:/.test(path);
-    if (isAbsolute) { return path };
+    if (isAbsolute) { return path; };
     var imgEl = _createImageElement();
     imgEl.src = path;
     var src = imgEl.src;
@@ -113,7 +113,7 @@
   function setSrc(img, src, callback) {
     if (fabric.isLikelyNode) {
       require('fs').readFile(src, function(err, imgData) {
-        if (err) { throw err };
+        if (err) { throw err; };
         img.src = imgData;
         img._src = src;
         callback && callback();

test/unit/group.js

@@ -534,7 +534,7 @@
     obj.dirty = false;
     equal(g1.dirty, false, 'Group has no dirty flag set');
     obj.set('fill', 'red');
-    equal(obj.dirty, true, 'Obj has dirty flag set')
+    equal(obj.dirty, true, 'Obj has dirty flag set');
     equal(g1.dirty, true, 'Group has dirty flag set');
   });
 

test/unit/image.js

@@ -2,7 +2,7 @@
 
   function getAbsolutePath(path) {
     var isAbsolute = /^https?:/.test(path);
-    if (isAbsolute) { return path };
+    if (isAbsolute) { return path; };
     var imgEl = _createImageElement();
     imgEl.src = path;
     var src = imgEl.src;
@@ -91,7 +91,7 @@
   function setSrc(img, src, callback) {
     if (fabric.isLikelyNode) {
       require('fs').readFile(src, function(err, imgData) {
-        if (err) { throw err };
+        if (err) { throw err; };
         img.src = imgData;
         img._src = src;
         callback && callback();

test/unit/image_filters.js

@@ -2,7 +2,7 @@
 
   function getAbsolutePath(path) {
     var isAbsolute = /^https?:/.test(path);
-    if (isAbsolute) { return path };
+    if (isAbsolute) { return path; };
     var imgEl = _createImageElement();
     imgEl.src = path;
     var src = imgEl.src;
@@ -68,7 +68,7 @@
   function setSrc(img, src, callback) {
     if (fabric.isLikelyNode) {
       require('fs').readFile(src, function(err, imgData) {
-        if (err) { throw err };
+        if (err) { throw err; };
         img.src = imgData;
         callback && callback();
       });

test/unit/itext.js

@@ -154,7 +154,7 @@
   test('empty itext', function() {
     var iText = new fabric.IText('');
     equal(iText.width, iText.cursorWidth);
-  })
+  });
 
   test('setSelectionEnd', function() {
     var iText = new fabric.IText('test');

test/unit/object.js

@@ -1439,7 +1439,7 @@
       top: 40,
       width: 40,
       height: 50,
-      clipTo: function(ctx) { ctx.arc(10, 10, 10, 0, Math.PI * 2, false) }
+      clipTo: function(ctx) { ctx.arc(10, 10, 10, 0, Math.PI * 2, false); }
     });
 
     equal(typeof object.clipTo, 'function');

test/unit/pattern.js

@@ -9,7 +9,7 @@
   function setSrc(img, src, callback) {
     if (fabric.isLikelyNode) {
       require('fs').readFile(src, function(err, imgData) {
-        if (err) { throw err };
+        if (err) { throw err; };
         img.src = imgData;
         img._src = src;
         callback && callback();
@@ -64,11 +64,11 @@
     equal(object.offsetY, 0);
 
     var patternWithGetSource = new fabric.Pattern({
-      source: function() {return fabric.document.createElement('canvas')}
+      source: function() {return fabric.document.createElement('canvas');}
     });
 
     var object2 = patternWithGetSource.toObject();
-    equal(object2.source, 'function () {return fabric.document.createElement(\'canvas\')}');
+    equal(object2.source, 'function () {return fabric.document.createElement(\'canvas\');}');
     equal(object2.repeat, 'repeat');
   });
 

test/unit/util.js

@@ -2,7 +2,7 @@
 
   QUnit.module('fabric.util');
 
-  function K (x) { return x }
+  function K (x) { return x; }
 
   function _createImageElement() {
     return fabric.isLikelyNode
@@ -12,7 +12,7 @@
 
   function getAbsolutePath(path) {
     var isAbsolute = /^https?:/.test(path);
-    if (isAbsolute) { return path };
+    if (isAbsolute) { return path; };
     var imgEl = _createImageElement();
     imgEl.src = path;
     var src = imgEl.src;
@@ -267,7 +267,7 @@
     ok(typeof fabric.util.toArray == 'function');
 
     deepEqual(['x', 'y'], fabric.util.toArray({ 0: 'x', 1: 'y', length: 2 }));
-    deepEqual([1, 3], fabric.util.toArray((function(){ return arguments })(1, 3)));
+    deepEqual([1, 3], fabric.util.toArray((function(){ return arguments; })(1, 3)));
 
     var nodelist = fabric.document.getElementsByTagName('div'),
         converted = fabric.util.toArray(nodelist);
@@ -650,9 +650,9 @@
     ok(typeof Array.prototype.filter === 'function');
 
     var arr = [1,2,3,4,5];
-    deepEqual([3,4,5], arr.filter(function(val){ return val > 2 }));
-    deepEqual([], arr.filter(function(val){ return val > 5 }));
-    deepEqual([1,2], arr.filter(function(val){ return val <= 2 }));
+    deepEqual([3,4,5], arr.filter(function(val){ return val > 2; }));
+    deepEqual([], arr.filter(function(val){ return val > 5; }));
+    deepEqual([1,2], arr.filter(function(val){ return val <= 2; }));
   });
 
   test('Array.prototype.reduce', function() {
@@ -660,14 +660,14 @@
 
     var arr = [1,2,3,4,5];
     equal(15,
-      arr.reduce(function(memo, val) { return memo + val }), 0);
+      arr.reduce(function(memo, val) { return memo + val; }), 0);
 
     deepEqual(['1!', '2!', '3!', '4!', '5!'],
-      arr.reduce(function(memo, val) { memo.push(val + '!'); return memo }, []));
+      arr.reduce(function(memo, val) { memo.push(val + '!'); return memo; }, []));
 
     arr = 'foobar'.split('');
     equal('f0o1o2b3a4r5',
-      arr.reduce(function(memo, val, index) { return memo + val + index }, ''));
+      arr.reduce(function(memo, val, index) { return memo + val + index; }, ''));
   });
 
   test('fabric.util.createClass', function() {
@@ -760,9 +760,9 @@
   test('fabric.util.array.invoke', function() {
     ok(typeof fabric.util.array.invoke === 'function');
 
-    var obj1 = { toString: function(){ return 'obj1' } };
-    var obj2 = { toString: function(){ return 'obj2' } };
-    var obj3 = { toString: function(){ return 'obj3' } };
+    var obj1 = { toString: function(){ return 'obj1'; } };
+    var obj2 = { toString: function(){ return 'obj2'; } };
+    var obj3 = { toString: function(){ return 'obj3'; } };
 
     deepEqual(['obj1', 'obj2', 'obj3'],
       fabric.util.array.invoke([obj1, obj2, obj3], 'toString'));
@@ -782,9 +782,9 @@
     equal(-3, fabric.util.array.min([-1, -2, -3]));
     equal('a', fabric.util.array.min(['a', 'c', 'b']));
 
-    var obj1 = { valueOf: function(){ return 1 } };
-    var obj2 = { valueOf: function(){ return 2 } };
-    var obj3 = { valueOf: function(){ return 3 } };
+    var obj1 = { valueOf: function(){ return 1; } };
+    var obj2 = { valueOf: function(){ return 2; } };
+    var obj3 = { valueOf: function(){ return 3; } };
 
     equal(obj1, fabric.util.array.min([obj1, obj3, obj2]));
   });
@@ -797,9 +797,9 @@
     equal(-1, fabric.util.array.max([-1, -2, -3]));
     equal('c', fabric.util.array.max(['a', 'c', 'b']));
 
-    var obj1 = { valueOf: function(){ return 1 } };
-    var obj2 = { valueOf: function(){ return 2 } };
-    var obj3 = { valueOf: function(){ return 3 } };
+    var obj1 = { valueOf: function(){ return 1; } };
+    var obj2 = { valueOf: function(){ return 2; } };
+    var obj3 = { valueOf: function(){ return 3; } };
 
     equal(obj3, fabric.util.array.max([obj1, obj3, obj2]));
   });