From 3ed0880c6e030b2ea35d2ac7e49052f60bdd1649 Mon Sep 17 00:00:00 2001 From: Aaron Doubek-Kraft Date: Thu, 29 Jun 2017 13:14:38 -0700 Subject: [PATCH] [Fixed Position] Add unit tests for new code Refactored ElementProxy and UnitAccessorMutator slightly to improve encasulation. Added unit tests for UnitAccessorMutator --- .../layout/src/elements/ElementProxy.js | 48 ------------- .../src/elements/UnitAccessorMutator.js | 41 ++++++++++- .../test/elements/UnitAccessorMutatorSpec.js | 72 +++++++++++++++++++ 3 files changed, 111 insertions(+), 50 deletions(-) create mode 100644 platform/features/layout/test/elements/UnitAccessorMutatorSpec.js diff --git a/platform/features/layout/src/elements/ElementProxy.js b/platform/features/layout/src/elements/ElementProxy.js index e85f4197f2..3759799b9b 100644 --- a/platform/features/layout/src/elements/ElementProxy.js +++ b/platform/features/layout/src/elements/ElementProxy.js @@ -174,54 +174,6 @@ define( return this.resizeHandles; }; - /** - * Set whether this elements's position is determined in terms of grid - * units or pixels. - * @param {string} key Which unit to use, px or grid - */ - ElementProxy.prototype.setUnits = function (key) { - if (key === 'px' && this.element.useGrid === true) { - this.element.useGrid = false; - this.convertCoordsTo('px'); - } else if (key === 'grid' && this.element.useGrid === false) { - this.element.useGrid = true; - this.convertCoordsTo('grid'); - } - }; - - /** - * Convert this element's coordinates and size from pixels to grid units, - * or vice-versa. - * @param {string} unit When called with 'px', converts grid units to - * pixels; when called with 'grid', snaps element - * to grid units - */ - ElementProxy.prototype.convertCoordsTo = function (unit) { - var gridSize = this.gridSize; - var element = this.element; - var minWidth = this.getMinWidth(); - var minHeight = this.getMinHeight(); - if (unit === 'px') { - element.x = element.x * gridSize[0]; - element.y = element.y * gridSize[1]; - element.width = element.width * gridSize[0]; - element.height = element.height * gridSize[1]; - if (element.x2 && element.y2) { - element.x2 = element.x2 * gridSize[0]; - element.y2 = element.y2 * gridSize[1]; - } - } else if (unit === 'grid') { - element.x = Math.round(element.x / gridSize[0]); - element.y = Math.round(element.y / gridSize[1]); - element.width = Math.max(Math.round(element.width / gridSize[0]), minWidth); - element.height = Math.max(Math.round(element.height / gridSize[1]), minHeight); - if (element.x2 && element.y2) { - element.x2 = Math.round(element.x2 / gridSize[0]); - element.y2 = Math.round(element.y2 / gridSize[1]); - } - } - }; - /** * Returns which grid size the element is currently using. * @return {number[]} The current grid size in [x,y] form if the element diff --git a/platform/features/layout/src/elements/UnitAccessorMutator.js b/platform/features/layout/src/elements/UnitAccessorMutator.js index dc67186e69..c0b6d5c58f 100644 --- a/platform/features/layout/src/elements/UnitAccessorMutator.js +++ b/platform/features/layout/src/elements/UnitAccessorMutator.js @@ -35,14 +35,17 @@ define( * upon */ function UnitAccessorMutator(elementProxy) { + var self = this; + + this.elementProxy = elementProxy; return function (useGrid) { var current = elementProxy.element.useGrid; if (arguments.length > 0) { elementProxy.element.useGrid = useGrid; if (useGrid && !current) { - elementProxy.convertCoordsTo('grid'); + self.convertCoordsTo('grid'); } else if (!useGrid && current) { - elementProxy.convertCoordsTo('px'); + self.convertCoordsTo('px'); } } @@ -50,6 +53,40 @@ define( }; } + /** + * For the elementProxy object called upon, convert its element's + * coordinates and size from pixels to grid units, or vice-versa. + * @param {string} unit When called with 'px', converts grid units to + * pixels; when called with 'grid', snaps element + * to grid units + */ + UnitAccessorMutator.prototype.convertCoordsTo = function (unit) { + var proxy = this.elementProxy, + gridSize = proxy.gridSize, + element = proxy.element, + minWidth = proxy.getMinWidth(), + minHeight = proxy.getMinHeight(); + if (unit === 'px') { + element.x = element.x * gridSize[0]; + element.y = element.y * gridSize[1]; + element.width = element.width * gridSize[0]; + element.height = element.height * gridSize[1]; + if (element.x2 && element.y2) { + element.x2 = element.x2 * gridSize[0]; + element.y2 = element.y2 * gridSize[1]; + } + } else if (unit === 'grid') { + element.x = Math.round(element.x / gridSize[0]); + element.y = Math.round(element.y / gridSize[1]); + element.width = Math.max(Math.round(element.width / gridSize[0]), minWidth); + element.height = Math.max(Math.round(element.height / gridSize[1]), minHeight); + if (element.x2 && element.y2) { + element.x2 = Math.round(element.x2 / gridSize[0]); + element.y2 = Math.round(element.y2 / gridSize[1]); + } + } + }; + return UnitAccessorMutator; } ); diff --git a/platform/features/layout/test/elements/UnitAccessorMutatorSpec.js b/platform/features/layout/test/elements/UnitAccessorMutatorSpec.js new file mode 100644 index 0000000000..ac296593cd --- /dev/null +++ b/platform/features/layout/test/elements/UnitAccessorMutatorSpec.js @@ -0,0 +1,72 @@ +define( + ['../../src/elements/UnitAccessorMutator'], + function (UnitAccessorMutator) { + + var GRID_SIZE = [13,17]; + + describe("An elementProxy.gridSize accessor-mutator", function () { + var mockElementProxy, + testElement, + uAM; + + beforeEach(function () { + testElement = { + x: 2, + y: 3, + width: 4, + height: 5, + useGrid: true + }; + + mockElementProxy = { + element: testElement, + gridSize: GRID_SIZE, + getMinHeight: jasmine.createSpy('minHeight'), + getMinWidth: jasmine.createSpy('minWidth') + }; + + uAM = new UnitAccessorMutator(mockElementProxy); + + mockElementProxy.getMinWidth.andReturn(1); + mockElementProxy.getMinHeight.andReturn(1); + + }); + + it("allows access to useGrid", function () { + expect(uAM()).toEqual(mockElementProxy.element.useGrid); + }); + + it("allows mutation of useGrid", function () { + uAM(false); + expect(mockElementProxy.element.useGrid).toEqual(false); + }); + + it("converts coordinates appropriately", function () { + uAM(false); + expect(mockElementProxy.element.x).toEqual(26); + expect(mockElementProxy.element.y).toEqual(51); + expect(mockElementProxy.element.width).toEqual(52); + expect(mockElementProxy.element.height).toEqual(85); + uAM(true); + expect(mockElementProxy.element.x).toEqual(2); + expect(mockElementProxy.element.y).toEqual(3); + expect(mockElementProxy.element.width).toEqual(4); + expect(mockElementProxy.element.height).toEqual(5); + }); + + it("doesn't covert coordinates unecessarily", function () { + uAM(false); + expect(mockElementProxy.element.x).toEqual(26); + expect(mockElementProxy.element.y).toEqual(51); + expect(mockElementProxy.element.width).toEqual(52); + expect(mockElementProxy.element.height).toEqual(85); + uAM(false); + expect(mockElementProxy.element.x).toEqual(26); + expect(mockElementProxy.element.y).toEqual(51); + expect(mockElementProxy.element.width).toEqual(52); + expect(mockElementProxy.element.height).toEqual(85); + }); + + }); + } +);