diff options
Diffstat (limited to 'library/cropperjs/test')
145 files changed, 3451 insertions, 2358 deletions
diff --git a/library/cropperjs/test/css/main.css b/library/cropperjs/test/css/main.css deleted file mode 100644 index 6a86d123c..000000000 --- a/library/cropperjs/test/css/main.css +++ /dev/null @@ -1,9 +0,0 @@ -.container { - max-width: 640px; - max-height: 360px; - margin: 20px auto; -} - -.container > img { - max-width: 100%; -} diff --git a/library/cropperjs/test/events/crop.js b/library/cropperjs/test/events/crop.js deleted file mode 100644 index 1f769cf60..000000000 --- a/library/cropperjs/test/events/crop.js +++ /dev/null @@ -1,21 +0,0 @@ -QUnit.test('events#crop', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(7); - - image.addEventListener('crop', function (e) { - assert.ok(util.isNumber(e.detail.x)); - assert.ok(util.isNumber(e.detail.y)); - assert.ok(util.isNumber(e.detail.width)); - assert.ok(util.isNumber(e.detail.height)); - assert.ok(util.isNumber(e.detail.rotate)); - assert.ok(util.isNumber(e.detail.scaleX)); - assert.ok(util.isNumber(e.detail.scaleY)); - - done(); - }); - - return new Cropper(image); -}); diff --git a/library/cropperjs/test/events/cropend.js b/library/cropperjs/test/events/cropend.js deleted file mode 100644 index 1f18fb435..000000000 --- a/library/cropperjs/test/events/cropend.js +++ /dev/null @@ -1,24 +0,0 @@ -QUnit.test('events#cropend', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - image.addEventListener('ready', function () { - var PointerEvent = window.PointerEvent; - var cropper = this.cropper; - - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointerdown' : 'mousedown'); - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointermove' : 'mousemove'); - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointerup' : 'mouseup'); - - done(); - }); - - image.addEventListener('cropend', function (e) { - assert.strictEqual(e.detail.action, 'crop'); - }); - - return new Cropper(image); -}); diff --git a/library/cropperjs/test/events/cropmove.js b/library/cropperjs/test/events/cropmove.js deleted file mode 100644 index c695b7fdd..000000000 --- a/library/cropperjs/test/events/cropmove.js +++ /dev/null @@ -1,24 +0,0 @@ -QUnit.test('events#cropmove', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - image.addEventListener('ready', function () { - var PointerEvent = window.PointerEvent; - var cropper = this.cropper; - - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointerdown' : 'mousedown'); - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointermove' : 'mousemove'); - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointerup' : 'mouseup'); - - done(); - }); - - image.addEventListener('cropmove', function (e) { - assert.strictEqual(e.detail.action, 'crop'); - }); - - return new Cropper(image); -}); diff --git a/library/cropperjs/test/events/cropstart.js b/library/cropperjs/test/events/cropstart.js deleted file mode 100644 index 7d9b597a0..000000000 --- a/library/cropperjs/test/events/cropstart.js +++ /dev/null @@ -1,56 +0,0 @@ -QUnit.test('events#cropstart', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - image.addEventListener('ready', function () { - var PointerEvent = window.PointerEvent; - var cropper = this.cropper; - - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointerdown' : 'mousedown'); - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointerup' : 'mouseup'); - - done(); - }); - - image.addEventListener('cropstart', function (e) { - assert.strictEqual(e.detail.action, 'crop'); - }); - - return new Cropper(image); -}); - -QUnit.test('events#cropstart: default prevented', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(0); - - image.addEventListener('ready', function () { - var PointerEvent = window.PointerEvent; - var cropper = this.cropper; - - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointerdown' : 'mousedown'); - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointermove' : 'mousemove'); - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointerup' : 'mouseup'); - - done(); - }); - - image.addEventListener('cropstart', function (e) { - e.preventDefault(); - }); - - image.addEventListener('cropmove', function () { - assert.ok(false); - }); - - image.addEventListener('cropend', function () { - assert.ok(false); - }); - - return new Cropper(image); -}); diff --git a/library/cropperjs/test/events/ready.js b/library/cropperjs/test/events/ready.js deleted file mode 100644 index fbec2ff0c..000000000 --- a/library/cropperjs/test/events/ready.js +++ /dev/null @@ -1,15 +0,0 @@ -QUnit.test('events#ready', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - image.addEventListener('ready', function () { - assert.ok(true); - - done(); - }); - - return new Cropper(image); -}); diff --git a/library/cropperjs/test/events/zoom.js b/library/cropperjs/test/events/zoom.js deleted file mode 100644 index 99fda34b5..000000000 --- a/library/cropperjs/test/events/zoom.js +++ /dev/null @@ -1,46 +0,0 @@ -QUnit.test('events#zoom', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(3); - - image.addEventListener('ready', function () { - var cropper = this.cropper; - - cropper.zoom(0.1); - - done(); - }); - - image.addEventListener('zoom', function (e) { - assert.ok(e.detail.ratio > 0); - assert.ok(e.detail.oldRatio > 0); - assert.ok(e.detail.ratio > e.detail.oldRatio); - }); - - return new Cropper(image); -}); - -QUnit.test('events#zoom: default prevented', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - image.addEventListener('ready', function () { - var cropper = this.cropper; - var canvasData = cropper.getCanvasData(); - - assert.deepEqual(cropper.zoom(0.1).getCanvasData(), canvasData); - - done(); - }); - - image.addEventListener('zoom', function (e) { - e.preventDefault(); - }); - - return new Cropper(image); -}); diff --git a/library/cropperjs/test/helpers.js b/library/cropperjs/test/helpers.js new file mode 100644 index 000000000..69d4f3132 --- /dev/null +++ b/library/cropperjs/test/helpers.js @@ -0,0 +1,46 @@ +window.createImage = (attrs = {}) => { + const container = document.createElement('div'); + const image = document.createElement('img'); + + if (!attrs.src) { + attrs.src = '/base/docs/images/picture.jpg'; + } + + Object.keys(attrs).forEach((attr) => { + image[attr] = attrs[attr]; + }); + + container.appendChild(image); + document.body.appendChild(container); + + return image; +}; + +window.createEvent = (type, data) => { + let event; + + if (typeof Event === 'function' && typeof CustomEvent === 'function') { + if (typeof data === 'undefined') { + event = new Event(type, { + bubbles: true, + cancelable: true, + }); + } else { + event = new CustomEvent(type, { + detail: data, + bubbles: true, + cancelable: true, + }); + } + } else if (typeof data === 'undefined') { + event = document.createEvent('Event'); + event.initEvent(type, true, true); + } else { + event = document.createEvent('CustomEvent'); + event.initCustomEvent(type, true, true, data); + } + + event.buttons = 1; + + return event; +}; diff --git a/library/cropperjs/test/index.html b/library/cropperjs/test/index.html deleted file mode 100644 index bdcaf6b21..000000000 --- a/library/cropperjs/test/index.html +++ /dev/null @@ -1,90 +0,0 @@ -<!DOCTYPE html> -<html> -<head> - <meta charset="utf-8"> - <meta http-equiv="x-ua-compatible" content="ie=edge"> - <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> - <title>Cropper.js</title> - <link rel="stylesheet" href="https://code.jquery.com/qunit/qunit-2.4.0.css"> - <link rel="stylesheet" href="../dist/cropper.css"> - <link rel="stylesheet" href="css/main.css"> -</head> -<body> - <div id="qunit"></div> - <div id="qunit-fixture"></div> - <script src="https://code.jquery.com/qunit/qunit-2.4.0.js"></script> - <script src="../dist/cropper.js"></script> - <script src="js/main.js"></script> - - <!-- Options --> - <script src="options/viewMode.js"></script> - <script src="options/dragMode.js"></script> - <script src="options/aspectRatio.js"></script> - <script src="options/data.js"></script> - <!-- <script src="options/checkCrossOrigin.js"></script> --> - <script src="options/checkOrientation.js"></script> - <script src="options/modal.js"></script> - <script src="options/guides.js"></script> - <script src="options/center.js"></script> - <script src="options/highlight.js"></script> - <script src="options/background.js"></script> - <script src="options/autoCrop.js"></script> - <script src="options/movable.js"></script> - <script src="options/rotatable.js"></script> - <script src="options/scalable.js"></script> - <script src="options/zoomable.js"></script> - <script src="options/zoomOnWheel.js"></script> - <script src="options/cropBoxMovable.js"></script> - <script src="options/cropBoxResizable.js"></script> - <script src="options/toggleDragModeOnDblclick.js"></script> - <script src="options/minCanvasWidth.js"></script> - <script src="options/minCanvasHeight.js"></script> - <script src="options/minCropBoxWidth.js"></script> - <script src="options/minCropBoxHeight.js"></script> - <script src="options/minContainerWidth.js"></script> - <script src="options/minContainerHeight.js"></script> - <script src="options/ready.js"></script> - <script src="options/cropstart.js"></script> - <script src="options/cropmove.js"></script> - <script src="options/cropend.js"></script> - <script src="options/crop.js"></script> - <script src="options/zoom.js"></script> - - <!-- Methods --> - <script src="methods/crop.js"></script> - <script src="methods/reset.js"></script> - <script src="methods/clear.js"></script> - <script src="methods/replace.js"></script> - <script src="methods/enable.js"></script> - <script src="methods/disable.js"></script> - <script src="methods/destroy.js"></script> - <script src="methods/move.js"></script> - <script src="methods/moveTo.js"></script> - <script src="methods/zoom.js"></script> - <script src="methods/zoomTo.js"></script> - <script src="methods/rotate.js"></script> - <script src="methods/rotateTo.js"></script> - <script src="methods/scale.js"></script> - <script src="methods/scaleX.js"></script> - <script src="methods/scaleY.js"></script> - <script src="methods/getData.js"></script> - <script src="methods/setData.js"></script> - <script src="methods/getContainerData.js"></script> - <script src="methods/getImageData.js"></script> - <script src="methods/getCanvasData.js"></script> - <script src="methods/setCanvasData.js"></script> - <script src="methods/getCropBoxData.js"></script> - <script src="methods/setCropBoxData.js"></script> - <script src="methods/getCroppedCanvas.js"></script> - <script src="methods/setAspectRatio.js"></script> - <script src="methods/setDragMode.js"></script> - - <!-- Events --> - <script src="events/ready.js"></script> - <script src="events/cropstart.js"></script> - <script src="events/cropmove.js"></script> - <script src="events/cropend.js"></script> - <script src="events/crop.js"></script> - <script src="events/zoom.js"></script> -</body> -</html> diff --git a/library/cropperjs/test/js/main.js b/library/cropperjs/test/js/main.js deleted file mode 100644 index 79fda799f..000000000 --- a/library/cropperjs/test/js/main.js +++ /dev/null @@ -1,74 +0,0 @@ -window.Util = { - isNumber: function (n) { - return typeof n === 'number' && !isNaN(n); - }, - isFunction: function (fn) { - return typeof fn === 'function'; - }, - hasClass: function (element, className) { - return element.classList.contains(className); - }, - getByClass: function (element, className) { - return element.getElementsByClassName ? - element.getElementsByClassName(className) : - element.querySelectorAll('.' + className); - }, - createImage: function (attrs) { - var container = document.createElement('div'); - var image = new Image(); - var attr; - - if (typeof attrs !== 'object') { - attrs = {}; - } - - if (!attrs.src) { - attrs.src = '../docs/images/picture.jpg'; - } - - for (attr in attrs) { - if (attrs.hasOwnProperty(attr)) { - image[attr] = attrs[attr]; - } - } - - container.className = 'container'; - container.appendChild(image); - document.body.appendChild(container); - - return image; - }, - dispatchEvent: function (element, type, data) { - var event; - - if (element.dispatchEvent) { - // Event and CustomEvent on IE9-11 are global objects, not constructors - if (typeof Event === 'function' && typeof CustomEvent === 'function') { - if (!data) { - event = new Event(type, { - bubbles: true, - cancelable: true - }); - } else { - event = new CustomEvent(type, { - detail: data, - bubbles: true, - cancelable: true - }); - } - } else if (!data) { - event = document.createEvent('Event'); - event.initEvent(type, true, true); - } else { - event = document.createEvent('CustomEvent'); - event.initCustomEvent(type, true, true, data); - } - - // IE9+ - return element.dispatchEvent(event); - } else if (element.fireEvent) { - // IE6-10 (native events only) - return element.fireEvent('on' + type); - } - } -}; diff --git a/library/cropperjs/test/karma.conf.js b/library/cropperjs/test/karma.conf.js new file mode 100644 index 000000000..1ccf4d6d7 --- /dev/null +++ b/library/cropperjs/test/karma.conf.js @@ -0,0 +1,46 @@ +const puppeteer = require('puppeteer'); +const rollupConfig = require('../rollup.config'); + +process.env.CHROME_BIN = puppeteer.executablePath(); + +module.exports = (config) => { + config.set({ + autoWatch: false, + basePath: '..', + browsers: ['ChromeHeadless'], + client: { + mocha: { + timeout: 10000, + }, + }, + coverageIstanbulReporter: { + reports: ['html', 'lcovonly', 'text-summary'], + }, + files: [ + 'src/index.js', + 'dist/cropper.css', + 'test/helpers.js', + 'test/specs/**/*.spec.js', + { + pattern: 'docs/images/*', + included: false, + }, + ], + frameworks: ['mocha', 'chai'], + preprocessors: { + 'src/index.js': ['rollup'], + 'test/helpers.js': ['rollup'], + 'test/specs/**/*.spec.js': ['rollup'], + }, + reporters: ['mocha', 'coverage-istanbul'], + rollupPreprocessor: { + plugins: rollupConfig.plugins, + output: { + format: 'iife', + name: rollupConfig.output[0].name, + sourcemap: 'inline', + }, + }, + singleRun: true, + }); +}; diff --git a/library/cropperjs/test/methods/clear.js b/library/cropperjs/test/methods/clear.js deleted file mode 100644 index 6510ebad2..000000000 --- a/library/cropperjs/test/methods/clear.js +++ /dev/null @@ -1,29 +0,0 @@ -QUnit.test('methods#clear', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(4); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - - cropper.clear(); - assert.notOk(cropper.cropped); - assert.deepEqual(cropper.getData(), { - x: 0, - y: 0, - width: 0, - height: 0, - rotate: 0, - scaleX: 1, - scaleY: 1 - }); - assert.deepEqual(cropper.getCropBoxData(), {}); - assert.ok(util.hasClass(cropper.cropBox, 'cropper-hidden')); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/crop.js b/library/cropperjs/test/methods/crop.js deleted file mode 100644 index e4ae679f1..000000000 --- a/library/cropperjs/test/methods/crop.js +++ /dev/null @@ -1,24 +0,0 @@ -QUnit.test('methods#crop', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(4); - - return new Cropper(image, { - autoCrop: false, - - ready: function () { - var cropper = this.cropper; - - assert.notOk(cropper.cropped); - assert.ok(util.hasClass(cropper.cropBox, 'cropper-hidden')); - - cropper.crop(); - assert.ok(cropper.cropped); - assert.notOk(util.hasClass(cropper.cropBox, 'cropper-hidden')); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/destroy.js b/library/cropperjs/test/methods/destroy.js deleted file mode 100644 index cb65e0696..000000000 --- a/library/cropperjs/test/methods/destroy.js +++ /dev/null @@ -1,22 +0,0 @@ -QUnit.test('methods#destroy', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(4); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - - assert.ok(typeof cropper === 'object'); - assert.ok(util.hasClass(image, 'cropper-hidden')); - - cropper.destroy(); - assert.ok(typeof this.cropper === 'undefined'); - assert.notOk(util.hasClass(image, 'cropper-hidden')); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/disable.js b/library/cropperjs/test/methods/disable.js deleted file mode 100644 index c87f7aa91..000000000 --- a/library/cropperjs/test/methods/disable.js +++ /dev/null @@ -1,60 +0,0 @@ -QUnit.test('methods#disable', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(11); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var options = cropper.options; - var cropBoxData; - var canvasData; - var imageData; - var action; - - cropper.disable(); - assert.ok(cropper.disabled); - assert.ok(util.hasClass(cropper.cropper, 'cropper-disabled')); - - cropBoxData = cropper.getCropBoxData(); - cropper.clear(); - assert.deepEqual(cropper.getCropBoxData(), cropBoxData); - - imageData = cropper.getImageData(); - cropper.move(10, 10); - assert.deepEqual(cropper.getImageData(), imageData); - - cropper.zoom(0.5); - assert.strictEqual(cropper.getImageData().ratio, imageData.ratio); - - cropper.rotate(15); - assert.strictEqual(cropper.getImageData().rotate, imageData.rotate); - - cropper.scale(-1); - assert.strictEqual(cropper.getImageData().scaleX, imageData.scaleX); - - canvasData = cropper.getCanvasData(); - cropper.setCanvasData({ - width: canvasData.width - 160 - }); - assert.deepEqual(cropper.getCanvasData(), canvasData); - - cropBoxData = cropper.getCropBoxData(); - cropper.setCropBoxData({ - height: cropBoxData.height - 90 - }); - assert.deepEqual(cropper.getCropBoxData(), cropBoxData); - - cropper.setAspectRatio(0.618); - assert.ok(isNaN(options.aspectRatio)); - - action = cropper.dragBox.dataset.action; - cropper.setDragMode('none'); - assert.strictEqual(cropper.dragBox.dataset.action, action); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/enable.js b/library/cropperjs/test/methods/enable.js deleted file mode 100644 index ebd5b9529..000000000 --- a/library/cropperjs/test/methods/enable.js +++ /dev/null @@ -1,23 +0,0 @@ -QUnit.test('methods#enable', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(4); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - - cropper.disable(); - assert.ok(cropper.disabled); - assert.ok(util.hasClass(cropper.cropper, 'cropper-disabled')); - - cropper.enable(); - assert.notOk(cropper.disabled); - assert.notOk(util.hasClass(cropper.cropper, 'cropper-disabled')); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/getCanvasData.js b/library/cropperjs/test/methods/getCanvasData.js deleted file mode 100644 index 60d96af4e..000000000 --- a/library/cropperjs/test/methods/getCanvasData.js +++ /dev/null @@ -1,23 +0,0 @@ -QUnit.test('methods#getCanvasData', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(6); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var canvasData = cropper.getCanvasData(); - - assert.ok(util.isNumber(canvasData.left)); - assert.ok(util.isNumber(canvasData.top)); - assert.ok(util.isNumber(canvasData.width)); - assert.ok(util.isNumber(canvasData.height)); - assert.ok(util.isNumber(canvasData.naturalWidth)); - assert.ok(util.isNumber(canvasData.naturalHeight)); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/getContainerData.js b/library/cropperjs/test/methods/getContainerData.js deleted file mode 100644 index 094421ba0..000000000 --- a/library/cropperjs/test/methods/getContainerData.js +++ /dev/null @@ -1,19 +0,0 @@ -QUnit.test('methods#getContainerData', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(2); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var containerData = cropper.getContainerData(); - - assert.ok(util.isNumber(containerData.width)); - assert.ok(util.isNumber(containerData.height)); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/getCropBoxData.js b/library/cropperjs/test/methods/getCropBoxData.js deleted file mode 100644 index 844c7953e..000000000 --- a/library/cropperjs/test/methods/getCropBoxData.js +++ /dev/null @@ -1,21 +0,0 @@ -QUnit.test('methods#getCropBoxData', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(4); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var cropBoxData = cropper.getCropBoxData(); - - assert.ok(util.isNumber(cropBoxData.left)); - assert.ok(util.isNumber(cropBoxData.top)); - assert.ok(util.isNumber(cropBoxData.width)); - assert.ok(util.isNumber(cropBoxData.height)); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/getCroppedCanvas.js b/library/cropperjs/test/methods/getCroppedCanvas.js deleted file mode 100644 index 4117497a5..000000000 --- a/library/cropperjs/test/methods/getCroppedCanvas.js +++ /dev/null @@ -1,33 +0,0 @@ -QUnit.test('methods#getCroppedCanvas', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(7); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var canvas = cropper.getCroppedCanvas({ - width: 160, - height: 90 - }); - var pixelData; - - assert.ok(canvas instanceof HTMLCanvasElement); - assert.strictEqual(canvas.width, 160); - assert.strictEqual(canvas.height, 90); - - canvas = cropper.rotate(90).getCroppedCanvas({ - fillColor: '#010101' - }); - pixelData = canvas.getContext('2d').getImageData(0, 0, 1, 1).data; - assert.strictEqual(pixelData[0], 1, 'red is 1'); - assert.strictEqual(pixelData[1], 1, 'green is 1'); - assert.strictEqual(pixelData[2], 1, 'blue is 1'); - assert.strictEqual(pixelData[3], 255, 'color is opaque'); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/getData.js b/library/cropperjs/test/methods/getData.js deleted file mode 100644 index 9c519eb7f..000000000 --- a/library/cropperjs/test/methods/getData.js +++ /dev/null @@ -1,46 +0,0 @@ -QUnit.test('methods#getData', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(7); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var data = cropper.getData(); - - assert.ok(util.isNumber(data.x)); - assert.ok(util.isNumber(data.y)); - assert.ok(util.isNumber(data.width)); - assert.ok(util.isNumber(data.height)); - assert.ok(util.isNumber(data.rotate)); - assert.ok(util.isNumber(data.scaleX)); - assert.ok(util.isNumber(data.scaleY)); - - done(); - } - }); -}); - -QUnit.test('methods#getData: rounded', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(4); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var data = cropper.getData(true); - - assert.ok(data.x % 1 === 0); - assert.ok(data.y % 1 === 0); - assert.ok(data.width % 1 === 0); - assert.ok(data.height % 1 === 0); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/getImageData.js b/library/cropperjs/test/methods/getImageData.js deleted file mode 100644 index bd6e1941d..000000000 --- a/library/cropperjs/test/methods/getImageData.js +++ /dev/null @@ -1,31 +0,0 @@ -QUnit.test('methods#getImageData', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(10); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var imageData = cropper.getImageData(); - - assert.ok(util.isNumber(imageData.naturalWidth)); - assert.ok(util.isNumber(imageData.naturalHeight)); - assert.ok(util.isNumber(imageData.aspectRatio)); - assert.ok(util.isNumber(imageData.left)); - assert.ok(util.isNumber(imageData.top)); - assert.ok(util.isNumber(imageData.width)); - assert.ok(util.isNumber(imageData.height)); - - imageData = cropper.rotateTo(45).getImageData(); - assert.strictEqual(imageData.rotate, 45); - - imageData = cropper.scale(-1, -1).getImageData(); - assert.strictEqual(imageData.scaleX, -1); - assert.strictEqual(imageData.scaleY, -1); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/move.js b/library/cropperjs/test/methods/move.js deleted file mode 100644 index c2ead8412..000000000 --- a/library/cropperjs/test/methods/move.js +++ /dev/null @@ -1,20 +0,0 @@ -QUnit.test('methods#move', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(2); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var canvasData = cropper.getCanvasData(); - var changedCanvasData = cropper.move(1, 1).getCanvasData(); - - assert.strictEqual(changedCanvasData.left, canvasData.left + 1); - assert.strictEqual(changedCanvasData.top, canvasData.top + 1); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/moveTo.js b/library/cropperjs/test/methods/moveTo.js deleted file mode 100644 index e8bf0eebd..000000000 --- a/library/cropperjs/test/methods/moveTo.js +++ /dev/null @@ -1,19 +0,0 @@ -QUnit.test('methods#moveTo', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(2); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var canvasData = cropper.moveTo(0, 0).getCanvasData(); - - assert.strictEqual(canvasData.left, 0); - assert.strictEqual(canvasData.top, 0); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/replace.js b/library/cropperjs/test/methods/replace.js deleted file mode 100644 index 3fc8fe0b6..000000000 --- a/library/cropperjs/test/methods/replace.js +++ /dev/null @@ -1,23 +0,0 @@ -QUnit.test('methods#replace', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(2); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - - cropper.options.ready = function () { - assert.notOk(cropper.cropped); - cropper.crop(); - assert.ok(cropper.cropped); - done(); - }; - - cropper.options.autoCrop = false; - cropper.replace('../docs/images/picture-2.jpg'); - } - }); -}); diff --git a/library/cropperjs/test/methods/reset.js b/library/cropperjs/test/methods/reset.js deleted file mode 100644 index 3e047394c..000000000 --- a/library/cropperjs/test/methods/reset.js +++ /dev/null @@ -1,35 +0,0 @@ -QUnit.test('methods#reset', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(4); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var canvasData = cropper.getCanvasData(); - var cropBoxData = cropper.getCropBoxData(); - - cropper.setCanvasData({ - top: canvasData.top + 10, - width: canvasData.width - 10 - }); - - assert.notDeepEqual(cropper.getCanvasData(), canvasData); - - cropper.setCropBoxData({ - left: cropBoxData.left + 10, - height: cropBoxData.height - 10 - }); - - assert.notDeepEqual(cropper.getCropBoxData(), cropBoxData); - - cropper.reset(); - assert.deepEqual(cropper.getCanvasData(), canvasData); - assert.deepEqual(cropper.getCropBoxData(), cropBoxData); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/rotate.js b/library/cropperjs/test/methods/rotate.js deleted file mode 100644 index 749096f0b..000000000 --- a/library/cropperjs/test/methods/rotate.js +++ /dev/null @@ -1,19 +0,0 @@ -QUnit.test('methods#rotate', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(3); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - - assert.strictEqual(cropper.rotate(360).getImageData().rotate, 0); - assert.strictEqual(cropper.rotate(90).getImageData().rotate, 90); - assert.strictEqual(cropper.rotate(-180).getImageData().rotate, -90); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/rotateTo.js b/library/cropperjs/test/methods/rotateTo.js deleted file mode 100644 index 323431e76..000000000 --- a/library/cropperjs/test/methods/rotateTo.js +++ /dev/null @@ -1,20 +0,0 @@ -QUnit.test('methods#rotateTo', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(4); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - - assert.strictEqual(cropper.rotateTo(360).getImageData().rotate, 0); - assert.strictEqual(cropper.rotateTo(90).getImageData().rotate, 90); - assert.strictEqual(cropper.rotateTo(0).getImageData().rotate, 0); - assert.strictEqual(cropper.rotateTo(-180).getImageData().rotate, -180); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/scale.js b/library/cropperjs/test/methods/scale.js deleted file mode 100644 index be1caa589..000000000 --- a/library/cropperjs/test/methods/scale.js +++ /dev/null @@ -1,19 +0,0 @@ -QUnit.test('methods#scale', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(2); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var imageData = cropper.scale(-1, -1).getImageData(); - - assert.strictEqual(imageData.scaleX, -1); - assert.strictEqual(imageData.scaleY, -1); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/scaleX.js b/library/cropperjs/test/methods/scaleX.js deleted file mode 100644 index c799df58d..000000000 --- a/library/cropperjs/test/methods/scaleX.js +++ /dev/null @@ -1,18 +0,0 @@ -QUnit.test('methods#scaleX', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var imageData = cropper.scaleX(-1).getImageData(); - - assert.strictEqual(imageData.scaleX, -1); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/scaleY.js b/library/cropperjs/test/methods/scaleY.js deleted file mode 100644 index 026b93a1f..000000000 --- a/library/cropperjs/test/methods/scaleY.js +++ /dev/null @@ -1,18 +0,0 @@ -QUnit.test('methods#scaleY', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var imageData = cropper.scaleY(-1).getImageData(); - - assert.strictEqual(imageData.scaleY, -1); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/setAspectRatio.js b/library/cropperjs/test/methods/setAspectRatio.js deleted file mode 100644 index ddf46798d..000000000 --- a/library/cropperjs/test/methods/setAspectRatio.js +++ /dev/null @@ -1,20 +0,0 @@ -QUnit.test('methods#setAspectRatio', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(2); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var options = cropper.options; - - assert.ok(isNaN(options.aspectRatio)); - cropper.setAspectRatio(1); - assert.strictEqual(options.aspectRatio, 1); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/setCanvasData.js b/library/cropperjs/test/methods/setCanvasData.js deleted file mode 100644 index e8f6511dc..000000000 --- a/library/cropperjs/test/methods/setCanvasData.js +++ /dev/null @@ -1,34 +0,0 @@ -QUnit.test('methods#setCanvasData', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(6); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var canvasData = cropper.getCanvasData(); - var changedCanvasData = cropper.setCanvasData({ - left: 16, - top: 9 - }).getCanvasData(); - - assert.notStrictEqual(changedCanvasData.left, canvasData.left); - assert.notStrictEqual(changedCanvasData.top, canvasData.top); - assert.strictEqual(changedCanvasData.width, canvasData.width); - assert.strictEqual(changedCanvasData.height, canvasData.height); - - canvasData = cropper.getCanvasData(); - changedCanvasData = cropper.setCanvasData({ - width: 320, - height: 180 - }).getCanvasData(); - - assert.notStrictEqual(changedCanvasData.width, canvasData.width); - assert.notStrictEqual(changedCanvasData.height, canvasData.height); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/setCropBoxData.js b/library/cropperjs/test/methods/setCropBoxData.js deleted file mode 100644 index e78767cfc..000000000 --- a/library/cropperjs/test/methods/setCropBoxData.js +++ /dev/null @@ -1,36 +0,0 @@ -QUnit.test('methods#setCropBoxData', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(8); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var cropBoxData = cropper.getCropBoxData(); - var changedCropBoxData = cropper.setCropBoxData({ - left: 16, - top: 9 - }).getCropBoxData(); - - assert.notStrictEqual(changedCropBoxData.left, cropBoxData.left); - assert.notStrictEqual(changedCropBoxData.top, cropBoxData.top); - assert.strictEqual(changedCropBoxData.width, cropBoxData.width); - assert.strictEqual(changedCropBoxData.height, cropBoxData.height); - - cropBoxData = cropper.getCropBoxData(); - changedCropBoxData = cropper.setCropBoxData({ - width: 320, - height: 180 - }).getCropBoxData(); - - assert.strictEqual(changedCropBoxData.left, cropBoxData.left); - assert.strictEqual(changedCropBoxData.top, cropBoxData.top); - assert.notStrictEqual(changedCropBoxData.width, cropBoxData.width); - assert.notStrictEqual(changedCropBoxData.height, cropBoxData.height); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/setData.js b/library/cropperjs/test/methods/setData.js deleted file mode 100644 index 4e1360f09..000000000 --- a/library/cropperjs/test/methods/setData.js +++ /dev/null @@ -1,36 +0,0 @@ -QUnit.test('methods#setData', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(8); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var data = cropper.getData(); - var changedData = cropper.setData({ - x: 16, - y: 9 - }).getData(); - - assert.notStrictEqual(changedData.x, data.x); - assert.notStrictEqual(changedData.y, data.y); - assert.strictEqual(changedData.width, data.width); - assert.strictEqual(changedData.height, data.height); - - data = cropper.getData(); - changedData = cropper.setData({ - width: 320, - height: 180 - }).getData(); - - assert.strictEqual(changedData.x, data.x); - assert.strictEqual(changedData.y, data.y); - assert.notStrictEqual(changedData.width, data.width); - assert.notStrictEqual(changedData.height, data.height); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/setDragMode.js b/library/cropperjs/test/methods/setDragMode.js deleted file mode 100644 index 1b611af9b..000000000 --- a/library/cropperjs/test/methods/setDragMode.js +++ /dev/null @@ -1,27 +0,0 @@ -QUnit.test('methods#setDragMode', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(4); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var dragBox = cropper.dragBox; - - assert.strictEqual(dragBox.dataset.action, 'crop'); - - cropper.setDragMode('move'); - assert.strictEqual(dragBox.dataset.action, 'move'); - - cropper.setDragMode('crop'); - assert.strictEqual(dragBox.dataset.action, 'crop'); - - cropper.setDragMode('none'); - assert.strictEqual(dragBox.dataset.action, 'none'); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/zoom.js b/library/cropperjs/test/methods/zoom.js deleted file mode 100644 index 70a1a763a..000000000 --- a/library/cropperjs/test/methods/zoom.js +++ /dev/null @@ -1,20 +0,0 @@ -QUnit.test('methods#zoom', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(2); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var canvasData = cropper.getCanvasData(); - var changedCanvasData = cropper.zoom(0.1).getCanvasData(); - - assert.ok(changedCanvasData.width > canvasData.width); - assert.ok(changedCanvasData.height > canvasData.height); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/methods/zoomTo.js b/library/cropperjs/test/methods/zoomTo.js deleted file mode 100644 index dd9e81760..000000000 --- a/library/cropperjs/test/methods/zoomTo.js +++ /dev/null @@ -1,21 +0,0 @@ -QUnit.test('methods#zoomTo', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(3); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var imageData = cropper.zoomTo(1).getImageData(); - var canvasData = cropper.getCanvasData(); - - assert.strictEqual(imageData.width, imageData.naturalWidth); - assert.strictEqual(canvasData.width, canvasData.naturalWidth); - assert.strictEqual(canvasData.naturalWidth, imageData.naturalWidth); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/aspectRatio.js b/library/cropperjs/test/options/aspectRatio.js deleted file mode 100644 index d7ba89401..000000000 --- a/library/cropperjs/test/options/aspectRatio.js +++ /dev/null @@ -1,39 +0,0 @@ -QUnit.test('options#aspectRatio: NaN', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - // aspectRatio: NaN, - - ready: function () { - var cropper = this.cropper; - - assert.ok(isNaN(cropper.options.aspectRatio)); - - done(); - } - }); -}); - -QUnit.test('options#aspectRatio: 1', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - aspectRatio: 1, - - ready: function () { - var cropper = this.cropper; - - assert.strictEqual(cropper.options.aspectRatio, 1); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/autoCrop.js b/library/cropperjs/test/options/autoCrop.js deleted file mode 100644 index f010966eb..000000000 --- a/library/cropperjs/test/options/autoCrop.js +++ /dev/null @@ -1,39 +0,0 @@ -QUnit.test('options#autoCrop: true', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - // autoCrop: true, - - ready: function () { - var cropper = this.cropper; - - assert.ok(cropper.cropped); - - done(); - } - }); -}); - -QUnit.test('options#autoCrop: false', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - autoCrop: false, - - ready: function () { - var cropper = this.cropper; - - assert.notOk(cropper.cropped); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/background.js b/library/cropperjs/test/options/background.js deleted file mode 100644 index 21dbb8b12..000000000 --- a/library/cropperjs/test/options/background.js +++ /dev/null @@ -1,40 +0,0 @@ -QUnit.test('options#background: true', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - // background: true, - - ready: function () { - var cropper = this.cropper; - - assert.ok(util.hasClass(cropper.cropper, 'cropper-bg')); - - done(); - } - }); -}); - -QUnit.test('options#background: false', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - background: false, - - ready: function () { - var cropper = this.cropper; - - assert.notOk(util.hasClass(cropper.cropper, 'cropper-bg')); - - done(); - } - }); - -}); diff --git a/library/cropperjs/test/options/center.js b/library/cropperjs/test/options/center.js deleted file mode 100644 index 5d45eb021..000000000 --- a/library/cropperjs/test/options/center.js +++ /dev/null @@ -1,41 +0,0 @@ -QUnit.test('options#center: true', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - // center: true, - - ready: function () { - var cropper = this.cropper; - var center = util.getByClass(cropper.cropBox, 'cropper-center'); - - assert.notOk(util.hasClass(center[0], 'cropper-hidden')); - - done(); - } - }); -}); - -QUnit.test('options#center: false', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - center: false, - - ready: function () { - var cropper = this.cropper; - var center = util.getByClass(cropper.cropBox, 'cropper-center'); - - assert.ok(util.hasClass(center[0], 'cropper-hidden')); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/checkCrossOrigin.js b/library/cropperjs/test/options/checkCrossOrigin.js deleted file mode 100644 index 86fde8f6f..000000000 --- a/library/cropperjs/test/options/checkCrossOrigin.js +++ /dev/null @@ -1,67 +0,0 @@ -QUnit.test('options#checkCrossOrigin: true', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage({ - src: 'https://fengyuanchen.github.io/cropperjs/images/picture.jpg' - }); - - assert.expect(2); - - return new Cropper(image, { - // checkCrossOrigin: true, - - ready: function () { - var cropper = this.cropper; - - assert.strictEqual(cropper.image.crossOrigin, 'anonymous'); - assert.ok(cropper.image.src.indexOf('timestamp') >= 0); - - done(); - } - }); -}); - -QUnit.test('options#checkCrossOrigin: false', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage({ - src: 'https://fengyuanchen.github.io/cropperjs/images/picture.jpg' - }); - - assert.expect(2); - - return new Cropper(image, { - checkCrossOrigin: false, - - ready: function () { - var cropper = this.cropper; - - assert.notStrictEqual(cropper.image.crossOrigin, 'anonymous'); - assert.ok(cropper.image.src.indexOf('timestamp') < 0); - - done(); - } - }); -}); - -QUnit.test('options#checkCrossOrigin: exists crossOrigin attribute', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage({ - src: 'https://fengyuanchen.github.io/cropperjs/images/picture.jpg', - crossOrigin: 'anonymous' - }); - - assert.expect(2); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - - assert.strictEqual(cropper.image.crossOrigin, 'anonymous'); - assert.ok(cropper.image.src.indexOf('timestamp') < 0); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/checkOrientation.js b/library/cropperjs/test/options/checkOrientation.js deleted file mode 100644 index 0fe548404..000000000 --- a/library/cropperjs/test/options/checkOrientation.js +++ /dev/null @@ -1,43 +0,0 @@ -QUnit.test('options#checkOrientation: true', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage({ - src: '../docs/images/picture-3.jpg' - }); - - assert.expect(1); - - return new Cropper(image, { - // checkOrientation: true, - - ready: function () { - var cropper = this.cropper; - - assert.notStrictEqual(cropper.getData().rotate, 0); - - done(); - } - }); -}); - -QUnit.test('options#checkOrientation: false', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage({ - src: '../docs/images/picture-3.jpg' - }); - - assert.expect(1); - - return new Cropper(image, { - checkOrientation: false, - - ready: function () { - var cropper = this.cropper; - - assert.strictEqual(cropper.getData().rotate, 0); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/crop.js b/library/cropperjs/test/options/crop.js deleted file mode 100644 index a4b48585e..000000000 --- a/library/cropperjs/test/options/crop.js +++ /dev/null @@ -1,21 +0,0 @@ -QUnit.test('options#crop', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(7); - - return new Cropper(image, { - crop: function (e) { - assert.ok(util.isNumber(e.detail.x)); - assert.ok(util.isNumber(e.detail.y)); - assert.ok(util.isNumber(e.detail.width)); - assert.ok(util.isNumber(e.detail.height)); - assert.ok(util.isNumber(e.detail.rotate)); - assert.ok(util.isNumber(e.detail.scaleX)); - assert.ok(util.isNumber(e.detail.scaleY)); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/cropBoxMovable.js b/library/cropperjs/test/options/cropBoxMovable.js deleted file mode 100644 index d5d3e1d7d..000000000 --- a/library/cropperjs/test/options/cropBoxMovable.js +++ /dev/null @@ -1,41 +0,0 @@ -QUnit.test('options#cropBoxMovable: true', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - // cropBoxMovable: true, - - ready: function () { - var cropper = this.cropper; - var face = util.getByClass(cropper.cropBox, 'cropper-face'); - - assert.strictEqual(face[0].dataset.action, 'all'); - - done(); - } - }); -}); - -QUnit.test('options#cropBoxMovable: false', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - cropBoxMovable: false, - - ready: function () { - var cropper = this.cropper; - var face = util.getByClass(cropper.cropBox, 'cropper-face'); - - assert.strictEqual(face[0].dataset.action, cropper.options.dragMode); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/cropBoxResizable.js b/library/cropperjs/test/options/cropBoxResizable.js deleted file mode 100644 index 37093642b..000000000 --- a/library/cropperjs/test/options/cropBoxResizable.js +++ /dev/null @@ -1,65 +0,0 @@ -QUnit.test('options#cropBoxResizable: true', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(12); - - return new Cropper(image, { - // cropBoxResizable: true, - - ready: function () { - var cropper = this.cropper; - var line = util.getByClass(cropper.cropBox, 'cropper-line'); - var point = util.getByClass(cropper.cropBox, 'cropper-point'); - - assert.notOk(util.hasClass(line[0], 'cropper-hidden')); - assert.notOk(util.hasClass(line[1], 'cropper-hidden')); - assert.notOk(util.hasClass(line[2], 'cropper-hidden')); - assert.notOk(util.hasClass(line[3], 'cropper-hidden')); - assert.notOk(util.hasClass(point[0], 'cropper-hidden')); - assert.notOk(util.hasClass(point[1], 'cropper-hidden')); - assert.notOk(util.hasClass(point[2], 'cropper-hidden')); - assert.notOk(util.hasClass(point[3], 'cropper-hidden')); - assert.notOk(util.hasClass(point[4], 'cropper-hidden')); - assert.notOk(util.hasClass(point[5], 'cropper-hidden')); - assert.notOk(util.hasClass(point[6], 'cropper-hidden')); - assert.notOk(util.hasClass(point[7], 'cropper-hidden')); - - done(); - } - }); -}); - -QUnit.test('options#cropBoxResizable: false', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(12); - - return new Cropper(image, { - cropBoxResizable: false, - - ready: function () { - var cropper = this.cropper; - var line = util.getByClass(cropper.cropBox, 'cropper-line'); - var point = util.getByClass(cropper.cropBox, 'cropper-point'); - - assert.ok(util.hasClass(line[0], 'cropper-hidden')); - assert.ok(util.hasClass(line[1], 'cropper-hidden')); - assert.ok(util.hasClass(line[2], 'cropper-hidden')); - assert.ok(util.hasClass(line[3], 'cropper-hidden')); - assert.ok(util.hasClass(point[0], 'cropper-hidden')); - assert.ok(util.hasClass(point[1], 'cropper-hidden')); - assert.ok(util.hasClass(point[2], 'cropper-hidden')); - assert.ok(util.hasClass(point[3], 'cropper-hidden')); - assert.ok(util.hasClass(point[4], 'cropper-hidden')); - assert.ok(util.hasClass(point[5], 'cropper-hidden')); - assert.ok(util.hasClass(point[6], 'cropper-hidden')); - assert.ok(util.hasClass(point[7], 'cropper-hidden')); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/cropend.js b/library/cropperjs/test/options/cropend.js deleted file mode 100644 index abfe815c0..000000000 --- a/library/cropperjs/test/options/cropend.js +++ /dev/null @@ -1,24 +0,0 @@ -QUnit.test('options#cropend', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - ready: function () { - var PointerEvent = window.PointerEvent; - var cropper = this.cropper; - - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointerdown' : 'mousedown'); - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointermove' : 'mousemove'); - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointerup' : 'mouseup'); - - done(); - }, - - cropend: function (e) { - assert.strictEqual(e.detail.action, 'crop'); - } - }); -}); diff --git a/library/cropperjs/test/options/cropmove.js b/library/cropperjs/test/options/cropmove.js deleted file mode 100644 index fa20f4011..000000000 --- a/library/cropperjs/test/options/cropmove.js +++ /dev/null @@ -1,24 +0,0 @@ -QUnit.test('options#cropmove', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - ready: function () { - var PointerEvent = window.PointerEvent; - var cropper = this.cropper; - - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointerdown' : 'mousedown'); - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointermove' : 'mousemove'); - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointerup' : 'mouseup'); - - done(); - }, - - cropmove: function (e) { - assert.strictEqual(e.detail.action, 'crop'); - } - }); -}); diff --git a/library/cropperjs/test/options/cropstart.js b/library/cropperjs/test/options/cropstart.js deleted file mode 100644 index f547269cd..000000000 --- a/library/cropperjs/test/options/cropstart.js +++ /dev/null @@ -1,56 +0,0 @@ -QUnit.test('options#cropstart', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - ready: function () { - var PointerEvent = window.PointerEvent; - var cropper = this.cropper; - - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointerdown' : 'mousedown'); - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointerup' : 'mouseup'); - - done(); - }, - - cropstart: function (e) { - assert.strictEqual(e.detail.action, 'crop'); - } - }); -}); - -QUnit.test('options#cropstart: default prevented', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(0); - - return new Cropper(image, { - ready: function () { - var PointerEvent = window.PointerEvent; - var cropper = this.cropper; - - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointerdown' : 'mousedown'); - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointermove' : 'mousemove'); - util.dispatchEvent(cropper.dragBox, PointerEvent ? 'pointerup' : 'mouseup'); - - done(); - }, - - cropstart: function (e) { - e.preventDefault(); - }, - - cropmove: function () { - assert.ok(false); - }, - - cropend: function () { - assert.ok(false); - } - }); -}); diff --git a/library/cropperjs/test/options/data.js b/library/cropperjs/test/options/data.js deleted file mode 100644 index e9da6a4dd..000000000 --- a/library/cropperjs/test/options/data.js +++ /dev/null @@ -1,35 +0,0 @@ -QUnit.test('options#data', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - var initialData = { - x: 360, - y: 450, - width: 640, - height: 360, - rotate: 45, - scaleX: -1, - scaleY: -1 - }; - - assert.expect(7); - - return new Cropper(image, { - data: initialData, - - ready: function () { - var cropper = this.cropper; - var data = cropper.getData(true); - - assert.strictEqual(data.x, initialData.x); - assert.strictEqual(data.y, initialData.y); - assert.strictEqual(data.width, initialData.width); - assert.strictEqual(data.height, initialData.height); - assert.strictEqual(data.rotate, initialData.rotate); - assert.strictEqual(data.scaleX, initialData.scaleX); - assert.strictEqual(data.scaleY, initialData.scaleY); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/dragMode.js b/library/cropperjs/test/options/dragMode.js deleted file mode 100644 index 57f31ff13..000000000 --- a/library/cropperjs/test/options/dragMode.js +++ /dev/null @@ -1,60 +0,0 @@ -QUnit.test('options#dragMode: crop', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - // dragMode: 'crop', - - ready: function () { - var cropper = this.cropper; - - assert.strictEqual(cropper.dragBox.dataset.action, 'crop'); - - done(); - } - }); -}); - -QUnit.test('options#dragMode: move', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - dragMode: 'move', - - ready: function () { - var cropper = this.cropper; - - assert.strictEqual(cropper.dragBox.dataset.action, 'move'); - - done(); - } - }); -}); - - -QUnit.test('options#dragMode: none', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - dragMode: 'none', - - ready: function () { - var cropper = this.cropper; - - assert.strictEqual(cropper.dragBox.dataset.action, 'none'); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/guides.js b/library/cropperjs/test/options/guides.js deleted file mode 100644 index 298c3ad3a..000000000 --- a/library/cropperjs/test/options/guides.js +++ /dev/null @@ -1,43 +0,0 @@ -QUnit.test('options#guides: true', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(2); - - return new Cropper(image, { - // guides: true, - - ready: function () { - var cropper = this.cropper; - var dashed = util.getByClass(cropper.cropBox, 'cropper-dashed'); - - assert.notOk(util.hasClass(dashed[0], 'cropper-hidden')); - assert.notOk(util.hasClass(dashed[1], 'cropper-hidden')); - - done(); - } - }); -}); - -QUnit.test('options#guides: false', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(2); - - return new Cropper(image, { - guides: false, - - ready: function () { - var cropper = this.cropper; - var dashed = util.getByClass(cropper.cropBox, 'cropper-dashed'); - - assert.ok(util.hasClass(dashed[0], 'cropper-hidden')); - assert.ok(util.hasClass(dashed[1], 'cropper-hidden')); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/highlight.js b/library/cropperjs/test/options/highlight.js deleted file mode 100644 index a1db4687f..000000000 --- a/library/cropperjs/test/options/highlight.js +++ /dev/null @@ -1,41 +0,0 @@ -QUnit.test('options#highlight: true', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - // highlight: true, - - ready: function () { - var cropper = this.cropper; - var face = util.getByClass(cropper.cropBox, 'cropper-face'); - - assert.notOk(util.hasClass(face[0], 'cropper-invisible')); - - done(); - } - }); -}); - -QUnit.test('options#highlight: false', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - highlight: false, - - ready: function () { - var cropper = this.cropper; - var face = util.getByClass(cropper.cropBox, 'cropper-face'); - - assert.ok(util.hasClass(face[0], 'cropper-invisible')); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/minCanvasHeight.js b/library/cropperjs/test/options/minCanvasHeight.js deleted file mode 100644 index c9745a9b1..000000000 --- a/library/cropperjs/test/options/minCanvasHeight.js +++ /dev/null @@ -1,23 +0,0 @@ -QUnit.test('options#minCanvasHeight', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - var minCanvasHeight = 270; - - assert.expect(1); - - return new Cropper(image, { - minCanvasHeight: minCanvasHeight, - - ready: function () { - var cropper = this.cropper; - var canvasData = cropper.setCanvasData({ - height: 180 - }).getCanvasData(); - - assert.strictEqual(Math.round(canvasData.height), minCanvasHeight); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/minCanvasWidth.js b/library/cropperjs/test/options/minCanvasWidth.js deleted file mode 100644 index 61601e4f9..000000000 --- a/library/cropperjs/test/options/minCanvasWidth.js +++ /dev/null @@ -1,23 +0,0 @@ -QUnit.test('options#minCanvasWidth', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - var minCanvasWidth = 480; - - assert.expect(1); - - return new Cropper(image, { - minCanvasWidth: minCanvasWidth, - - ready: function () { - var cropper = this.cropper; - var canvasData = cropper.setCanvasData({ - width: 320 - }).getCanvasData(); - - assert.strictEqual(Math.round(canvasData.width), minCanvasWidth); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/minContainerHeight.js b/library/cropperjs/test/options/minContainerHeight.js deleted file mode 100644 index 85d7a70ef..000000000 --- a/library/cropperjs/test/options/minContainerHeight.js +++ /dev/null @@ -1,21 +0,0 @@ -QUnit.test('options#minContainerHeight', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - var minContainerHeight = 361; - - assert.expect(1); - - return new Cropper(image, { - minContainerHeight: minContainerHeight, - - ready: function () { - var cropper = this.cropper; - var containerData = cropper.getContainerData(); - - assert.strictEqual(Math.round(containerData.height), minContainerHeight); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/minContainerWidth.js b/library/cropperjs/test/options/minContainerWidth.js deleted file mode 100644 index 2119cc96e..000000000 --- a/library/cropperjs/test/options/minContainerWidth.js +++ /dev/null @@ -1,21 +0,0 @@ -QUnit.test('options#minContainerWidth', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - var minContainerWidth = 641; - - assert.expect(1); - - return new Cropper(image, { - minContainerWidth: minContainerWidth, - - ready: function () { - var cropper = this.cropper; - var containerData = cropper.getContainerData(); - - assert.strictEqual(Math.round(containerData.width), minContainerWidth); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/minCropBoxHeight.js b/library/cropperjs/test/options/minCropBoxHeight.js deleted file mode 100644 index ccf50aefe..000000000 --- a/library/cropperjs/test/options/minCropBoxHeight.js +++ /dev/null @@ -1,23 +0,0 @@ -QUnit.test('options#minCropBoxHeight', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - var minCropBoxHeight = 150; - - assert.expect(1); - - return new Cropper(image, { - minCropBoxHeight: minCropBoxHeight, - - ready: function () { - var cropper = this.cropper; - var cropBoxData = cropper.setCropBoxData({ - height: 100 - }).getCropBoxData(); - - assert.strictEqual(Math.round(cropBoxData.height), minCropBoxHeight); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/minCropBoxWidth.js b/library/cropperjs/test/options/minCropBoxWidth.js deleted file mode 100644 index acde5c366..000000000 --- a/library/cropperjs/test/options/minCropBoxWidth.js +++ /dev/null @@ -1,23 +0,0 @@ -QUnit.test('options#minCropBoxWidth', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - var minCropBoxWidth = 300; - - assert.expect(1); - - return new Cropper(image, { - minCropBoxWidth: minCropBoxWidth, - - ready: function () { - var cropper = this.cropper; - var cropBoxData = cropper.setCropBoxData({ - width: 200 - }).getCropBoxData(); - - assert.strictEqual(Math.round(cropBoxData.width), minCropBoxWidth); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/modal.js b/library/cropperjs/test/options/modal.js deleted file mode 100644 index 7284cb264..000000000 --- a/library/cropperjs/test/options/modal.js +++ /dev/null @@ -1,39 +0,0 @@ -QUnit.test('options#modal: true', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - // modal: true, - - ready: function () { - var cropper = this.cropper; - - assert.ok(util.hasClass(cropper.dragBox, 'cropper-modal')); - - done(); - } - }); -}); - -QUnit.test('options#modal: false', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - modal: false, - - ready: function () { - var cropper = this.cropper; - - assert.notOk(util.hasClass(cropper.dragBox, 'cropper-modal')); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/movable.js b/library/cropperjs/test/options/movable.js deleted file mode 100644 index 0e2c53506..000000000 --- a/library/cropperjs/test/options/movable.js +++ /dev/null @@ -1,45 +0,0 @@ -QUnit.test('options#movable: true', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(2); - - return new Cropper(image, { - // movable: true, - - ready: function () { - var cropper = this.cropper; - var canvasData = cropper.getCanvasData(); - var changedCanvasData = cropper.move(10, 10).getCanvasData(); - - assert.strictEqual(changedCanvasData.left, canvasData.left + 10); - assert.strictEqual(changedCanvasData.top, canvasData.top + 10); - - done(); - } - }); -}); - -QUnit.test('options#movable: false', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(2); - - return new Cropper(image, { - movable: false, - - ready: function () { - var cropper = this.cropper; - var canvasData = cropper.getCanvasData(); - var changedCanvasData = cropper.move(10, 10).getCanvasData(); - - assert.strictEqual(changedCanvasData.left, canvasData.left); - assert.strictEqual(changedCanvasData.top, canvasData.top); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/ready.js b/library/cropperjs/test/options/ready.js deleted file mode 100644 index e09e8369c..000000000 --- a/library/cropperjs/test/options/ready.js +++ /dev/null @@ -1,15 +0,0 @@ -QUnit.test('options#ready', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - ready: function () { - assert.ok(true); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/rotatable.js b/library/cropperjs/test/options/rotatable.js deleted file mode 100644 index 992e9362f..000000000 --- a/library/cropperjs/test/options/rotatable.js +++ /dev/null @@ -1,39 +0,0 @@ -QUnit.test('options#rotatable: true', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - // rotatable: true, - - ready: function () { - var cropper = this.cropper; - - assert.strictEqual(cropper.rotate(90).getImageData().rotate, 90); - - done(); - } - }); -}); - -QUnit.test('options#rotatable: false', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - rotatable: false, - - ready: function () { - var cropper = this.cropper; - - assert.strictEqual(cropper.rotate(90).getImageData().rotate, undefined); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/scalable.js b/library/cropperjs/test/options/scalable.js deleted file mode 100644 index c523eaf63..000000000 --- a/library/cropperjs/test/options/scalable.js +++ /dev/null @@ -1,43 +0,0 @@ -QUnit.test('options#scalable: true', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(2); - - return new Cropper(image, { - // scalable: true, - - ready: function () { - var cropper = this.cropper; - var imageData = cropper.scale(-1, -1).getImageData(); - - assert.strictEqual(imageData.scaleX, -1); - assert.strictEqual(imageData.scaleY, -1); - - done(); - } - }); -}); - -QUnit.test('options#scalable: false', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(2); - - return new Cropper(image, { - scalable: false, - - ready: function () { - var cropper = this.cropper; - var imageData = cropper.scale(-1, -1).getImageData(); - - assert.strictEqual(imageData.scaleX, undefined); - assert.strictEqual(imageData.scaleY, undefined); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/toggleDragModeOnDblclick.js b/library/cropperjs/test/options/toggleDragModeOnDblclick.js deleted file mode 100644 index df64327b2..000000000 --- a/library/cropperjs/test/options/toggleDragModeOnDblclick.js +++ /dev/null @@ -1,45 +0,0 @@ -QUnit.test('options#toggleDragModeOnDblclick: true', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(2); - - return new Cropper(image, { - // toggleDragModeOnDblclick: true, - - ready: function () { - var cropper = this.cropper; - var dragBox = cropper.dragBox; - - util.dispatchEvent(dragBox, 'dblclick'); - assert.ok(util.hasClass(dragBox, 'cropper-move')); - assert.strictEqual(dragBox.dataset.action, 'move'); - - done(); - } - }); -}); - -QUnit.test('options#toggleDragModeOnDblclick: false', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(2); - - return new Cropper(image, { - toggleDragModeOnDblclick: false, - - ready: function () { - var cropper = this.cropper; - var dragBox = cropper.dragBox; - - util.dispatchEvent(dragBox, 'dblclick'); - assert.ok(util.hasClass(dragBox, 'cropper-crop')); - assert.strictEqual(dragBox.dataset.action, 'crop'); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/viewMode.js b/library/cropperjs/test/options/viewMode.js deleted file mode 100644 index e39ec5fc1..000000000 --- a/library/cropperjs/test/options/viewMode.js +++ /dev/null @@ -1,100 +0,0 @@ -QUnit.test('options#viewMode: 0', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(4); - - return new Cropper(image, { - // viewMode: 0, - - ready: function () { - var cropper = this.cropper; - var canvasData = { - left: 100, - top: 100, - width: 160, - height: 90 - }; - var changedCanvasData = cropper.setCanvasData(canvasData).getCanvasData(); - - assert.strictEqual(changedCanvasData.left, canvasData.left); - assert.strictEqual(changedCanvasData.top, canvasData.top); - assert.strictEqual(changedCanvasData.width, canvasData.width); - assert.strictEqual(changedCanvasData.height, canvasData.height); - - done(); - } - }); -}); - -QUnit.test('options#viewMode: 1', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(2); - - return new Cropper(image, { - viewMode: 1, - - ready: function () { - var cropper = this.cropper; - var canvasData = cropper.zoom(-0.5).getCanvasData(); // Zoom out - var cropBoxData = cropper.getCropBoxData(); - - assert.ok(canvasData.width >= cropBoxData.width); - assert.ok(canvasData.height >= cropBoxData.height); - - done(); - } - }); -}); - -QUnit.test('options#viewMode: 2', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - viewMode: 2, - - ready: function () { - var cropper = this.cropper; - var canvasData = cropper.zoom(-0.5).getCanvasData(); // Zoom out - var containerData = cropper.getContainerData(); - - assert.ok(canvasData.width >= containerData.width || - canvasData.height >= containerData.height); - - done(); - } - }); -}); - -QUnit.test('options#viewMode: 3', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(4); - - return new Cropper(image, { - viewMode: 3, - - ready: function () { - var cropper = this.cropper; - var canvasData = cropper.zoom(-0.5).getCanvasData(); // Zoom out - var containerData = cropper.getContainerData(); - - assert.ok(canvasData.left <= 0); - assert.ok(canvasData.top <= 0); - assert.ok(canvasData.width >= containerData.width); - assert.ok(canvasData.height >= containerData.height); - - done(); - } - }); -}); diff --git a/library/cropperjs/test/options/zoom.js b/library/cropperjs/test/options/zoom.js deleted file mode 100644 index 51ebc76ad..000000000 --- a/library/cropperjs/test/options/zoom.js +++ /dev/null @@ -1,46 +0,0 @@ -QUnit.test('options#zoom', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(3); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - - cropper.zoom(0.1); - - done(); - }, - - zoom: function (e) { - assert.ok(e.detail.ratio > 0); - assert.ok(e.detail.oldRatio > 0); - assert.ok(e.detail.ratio > e.detail.oldRatio); - } - }); -}); - -QUnit.test('options#zoom: default prevented', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - ready: function () { - var cropper = this.cropper; - var canvasData = cropper.getCanvasData(); - - assert.deepEqual(cropper.zoom(0.1).getCanvasData(), canvasData); - - done(); - }, - - zoom: function (e) { - e.preventDefault(); - } - }); -}); diff --git a/library/cropperjs/test/options/zoomOnWheel.js b/library/cropperjs/test/options/zoomOnWheel.js deleted file mode 100644 index 1a1bf6dce..000000000 --- a/library/cropperjs/test/options/zoomOnWheel.js +++ /dev/null @@ -1,47 +0,0 @@ -QUnit.test('options#zoomOnWheel: true', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(1); - - return new Cropper(image, { - // zoomOnWheel: true, - - ready: function () { - var cropper = this.cropper; - - util.dispatchEvent(cropper.cropper, 'wheel'); - - done(); - }, - - zoom: function () { - assert.ok(true); - } - }); -}); - -QUnit.test('options#zoomOnWheel: false', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(0); - - return new Cropper(image, { - zoomOnWheel: false, - - ready: function () { - var cropper = this.cropper; - - util.dispatchEvent(cropper.cropper, 'wheel'); - - done(); - }, - - zoom: function () { - assert.ok(false); - } - }); -}); diff --git a/library/cropperjs/test/options/zoomable.js b/library/cropperjs/test/options/zoomable.js deleted file mode 100644 index 9f8ec6fce..000000000 --- a/library/cropperjs/test/options/zoomable.js +++ /dev/null @@ -1,51 +0,0 @@ -QUnit.test('options#zoomable: true', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(3); - - return new Cropper(image, { - // zoomable: true, - - ready: function () { - var cropper = this.cropper; - var canvasData = cropper.getCanvasData(); - var changedCanvasData = cropper.zoom(0.1).getCanvasData(); - - assert.ok(changedCanvasData.width > canvasData.width); - assert.ok(changedCanvasData.height > canvasData.height); - - done(); - }, - zoom: function () { - assert.ok(true); - } - }); -}); - -QUnit.test('options#zoomable: false', function (assert) { - var done = assert.async(); - var util = window.Util; - var image = util.createImage(); - - assert.expect(2); - - return new Cropper(image, { - zoomable: false, - - ready: function () { - var cropper = this.cropper; - var canvasData = cropper.getCanvasData(); - var changedCanvasData = cropper.zoom(0.1).getCanvasData(); - - assert.ok(changedCanvasData.width === canvasData.width); - assert.ok(changedCanvasData.height === canvasData.height); - - done(); - }, - zoom: function () { - assert.ok(false); - } - }); -}); diff --git a/library/cropperjs/test/specs/Cropper.spec.js b/library/cropperjs/test/specs/Cropper.spec.js new file mode 100644 index 000000000..ed20ad1fd --- /dev/null +++ b/library/cropperjs/test/specs/Cropper.spec.js @@ -0,0 +1,11 @@ +describe('Cropper', () => { + it('should be a class (function)', () => { + expect(Cropper).to.be.a('function'); + }); + + it('should throw error when the first argument is not an element', () => { + expect(() => { + new Cropper(document); + }).to.throw('The first argument is required and must be an <img> or <canvas> element.'); + }); +}); diff --git a/library/cropperjs/test/specs/events/crop.spec.js b/library/cropperjs/test/specs/events/crop.spec.js new file mode 100644 index 000000000..04ec1fd10 --- /dev/null +++ b/library/cropperjs/test/specs/events/crop.spec.js @@ -0,0 +1,30 @@ +describe('crop (event)', () => { + it('should trigger the `crop` event', (done) => { + const image = window.createImage(); + + image.addEventListener('crop', (event) => { + expect(event.type).to.equal('crop'); + done(); + }); + + new Cropper(image); + }); + + it('should have expected properties in `event.detail`', (done) => { + const image = window.createImage(); + + image.addEventListener('crop', (event) => { + expect(event.detail).to.be.an('object').that.has.all.keys(['x', 'y', 'width', 'height', 'rotate', 'scaleX', 'scaleY']); + expect(event.detail.x).to.be.a('number'); + expect(event.detail.y).to.be.a('number'); + expect(event.detail.width).to.be.a('number'); + expect(event.detail.height).to.be.a('number'); + expect(event.detail.rotate).to.be.a('number'); + expect(event.detail.scaleX).to.be.a('number'); + expect(event.detail.scaleY).to.be.a('number'); + done(); + }); + + new Cropper(image); + }); +}); diff --git a/library/cropperjs/test/specs/events/cropend.spec.js b/library/cropperjs/test/specs/events/cropend.spec.js new file mode 100644 index 000000000..8bdbc92d7 --- /dev/null +++ b/library/cropperjs/test/specs/events/cropend.spec.js @@ -0,0 +1,47 @@ +describe('cropend (event)', () => { + const POINTER_DOWN = window.PointerEvent ? 'pointerdown' : 'mousedown'; + const POINTER_MOVE = window.PointerEvent ? 'pointermove' : 'mousemove'; + const POINTER_UP = window.PointerEvent ? 'pointerup' : 'mouseup'; + + it('should trigger the `cropend` event', (done) => { + const image = window.createImage(); + let cropper; + + image.addEventListener('ready', () => { + const { dragBox } = cropper; + + dragBox.dispatchEvent(window.createEvent(POINTER_DOWN)); + dragBox.dispatchEvent(window.createEvent(POINTER_MOVE)); + dragBox.dispatchEvent(window.createEvent(POINTER_UP)); + }); + + image.addEventListener('cropend', (event) => { + expect(event.type).to.equal('cropend'); + done(); + }); + + cropper = new Cropper(image); + }); + + it('should have expected properties in `event.detail`', (done) => { + const image = window.createImage(); + let cropper; + + image.addEventListener('ready', () => { + const { dragBox } = cropper; + + dragBox.dispatchEvent(window.createEvent(POINTER_DOWN)); + dragBox.dispatchEvent(window.createEvent(POINTER_MOVE)); + dragBox.dispatchEvent(window.createEvent(POINTER_UP)); + }); + + image.addEventListener('cropend', (event) => { + expect(event.detail).to.be.an('object').that.has.all.keys(['action', 'originalEvent']); + expect(event.detail.action).to.equal('crop'); + expect(event.detail.originalEvent.type).to.equal(POINTER_UP); + done(); + }); + + cropper = new Cropper(image); + }); +}); diff --git a/library/cropperjs/test/specs/events/cropmove.spec.js b/library/cropperjs/test/specs/events/cropmove.spec.js new file mode 100644 index 000000000..1349bf3e2 --- /dev/null +++ b/library/cropperjs/test/specs/events/cropmove.spec.js @@ -0,0 +1,71 @@ +describe('cropmove (event)', () => { + const POINTER_DOWN = window.PointerEvent ? 'pointerdown' : 'mousedown'; + const POINTER_MOVE = window.PointerEvent ? 'pointermove' : 'mousemove'; + const POINTER_UP = window.PointerEvent ? 'pointerup' : 'mouseup'; + + it('should trigger the `cropmove` event', (done) => { + const image = window.createImage(); + let cropper; + + image.addEventListener('ready', () => { + const { dragBox } = cropper; + + dragBox.dispatchEvent(window.createEvent(POINTER_DOWN)); + dragBox.dispatchEvent(window.createEvent(POINTER_MOVE)); + dragBox.dispatchEvent(window.createEvent(POINTER_UP)); + }); + + image.addEventListener('cropmove', (event) => { + expect(event.detail.action).to.equal('crop'); + done(); + }); + + cropper = new Cropper(image); + }); + + it('should have expected properties in `event.detail`', (done) => { + const image = window.createImage(); + let cropper; + + image.addEventListener('ready', () => { + const { dragBox } = cropper; + + dragBox.dispatchEvent(window.createEvent(POINTER_DOWN)); + dragBox.dispatchEvent(window.createEvent(POINTER_MOVE)); + dragBox.dispatchEvent(window.createEvent(POINTER_UP)); + }); + + image.addEventListener('cropmove', (event) => { + expect(event.detail).to.be.an('object').that.has.all.keys(['action', 'originalEvent']); + expect(event.detail.action).to.equal('crop'); + expect(event.detail.originalEvent.type).to.equal(POINTER_MOVE); + done(); + }); + + cropper = new Cropper(image); + }); + + it('should not trigger the `crop` event when default prevented', (done) => { + const image = window.createImage(); + let cropper; + + image.addEventListener('ready', () => { + const { dragBox } = cropper; + + image.addEventListener('crop', () => { + expect.fail(1, 0); + }); + + dragBox.dispatchEvent(window.createEvent(POINTER_DOWN)); + dragBox.dispatchEvent(window.createEvent(POINTER_MOVE)); + dragBox.dispatchEvent(window.createEvent(POINTER_UP)); + }); + + image.addEventListener('cropmove', (event) => { + event.preventDefault(); + done(); + }); + + cropper = new Cropper(image); + }); +}); diff --git a/library/cropperjs/test/specs/events/cropstart.spec.js b/library/cropperjs/test/specs/events/cropstart.spec.js new file mode 100644 index 000000000..41e21ce62 --- /dev/null +++ b/library/cropperjs/test/specs/events/cropstart.spec.js @@ -0,0 +1,75 @@ +describe('cropstart (event)', () => { + const POINTER_DOWN = window.PointerEvent ? 'pointerdown' : 'mousedown'; + const POINTER_MOVE = window.PointerEvent ? 'pointermove' : 'mousemove'; + const POINTER_UP = window.PointerEvent ? 'pointerup' : 'mouseup'; + + it('should trigger the `cropstart` event', (done) => { + const image = window.createImage(); + let cropper; + + image.addEventListener('ready', () => { + const { dragBox } = cropper; + + dragBox.dispatchEvent(window.createEvent(POINTER_DOWN)); + dragBox.dispatchEvent(window.createEvent(POINTER_MOVE)); + dragBox.dispatchEvent(window.createEvent(POINTER_UP)); + }); + + image.addEventListener('cropstart', (event) => { + expect(event.type).to.equal('cropstart'); + done(); + }); + + cropper = new Cropper(image); + }); + + it('should have expected properties in `event.detail`', (done) => { + const image = window.createImage(); + let cropper; + + image.addEventListener('ready', () => { + const { dragBox } = cropper; + + dragBox.dispatchEvent(window.createEvent(POINTER_DOWN)); + dragBox.dispatchEvent(window.createEvent(POINTER_MOVE)); + dragBox.dispatchEvent(window.createEvent(POINTER_UP)); + }); + + image.addEventListener('cropstart', (event) => { + expect(event.detail).to.be.an('object').that.has.all.keys(['action', 'originalEvent']); + expect(event.detail.action).to.equal('crop'); + expect(event.detail.originalEvent.type).to.equal(POINTER_DOWN); + done(); + }); + + cropper = new Cropper(image); + }); + + it('should not trigger the `cropmove` and `cropend` events when default prevented', (done) => { + const image = window.createImage(); + let cropper; + + image.addEventListener('ready', () => { + const { dragBox } = cropper; + + dragBox.dispatchEvent(window.createEvent(POINTER_DOWN)); + dragBox.dispatchEvent(window.createEvent(POINTER_MOVE)); + dragBox.dispatchEvent(window.createEvent(POINTER_UP)); + }); + + image.addEventListener('cropstart', (event) => { + event.preventDefault(); + done(); + }); + + image.addEventListener('cropmove', () => { + expect.fail(1, 0); + }); + + image.addEventListener('cropend', () => { + expect.fail(1, 0); + }); + + cropper = new Cropper(image); + }); +}); diff --git a/library/cropperjs/test/specs/events/ready.spec.js b/library/cropperjs/test/specs/events/ready.spec.js new file mode 100644 index 000000000..fd88314f0 --- /dev/null +++ b/library/cropperjs/test/specs/events/ready.spec.js @@ -0,0 +1,26 @@ +describe('ready (event)', () => { + it('should trigger the `ready` event', (done) => { + const image = window.createImage(); + + image.addEventListener('ready', (event) => { + expect(event.type).to.equal('ready'); + done(); + }); + + new Cropper(image); + }); + + it('should trigger the `crop` event even though default prevented', (done) => { + const image = window.createImage(); + + image.addEventListener('ready', (event) => { + event.preventDefault(); + }); + + image.addEventListener('crop', () => { + done(); + }); + + new Cropper(image); + }); +}); diff --git a/library/cropperjs/test/specs/events/zoom.spec.js b/library/cropperjs/test/specs/events/zoom.spec.js new file mode 100644 index 000000000..c827067b7 --- /dev/null +++ b/library/cropperjs/test/specs/events/zoom.spec.js @@ -0,0 +1,56 @@ +describe('zoom (event)', () => { + it('should trigger the `zoom` event', (done) => { + const image = window.createImage(); + let cropper; + + image.addEventListener('ready', () => { + cropper.zoom(0.1); + }); + + image.addEventListener('zoom', (event) => { + expect(event.type).to.equal('zoom'); + done(); + }); + + cropper = new Cropper(image); + }); + + it('should have correct properties in `event.detail`', (done) => { + const image = window.createImage(); + let cropper; + + image.addEventListener('ready', () => { + cropper.zoom(0.1); + }); + + image.addEventListener('zoom', (event) => { + expect(event.detail).to.be.an('object').that.has.all.keys(['ratio', 'oldRatio', 'originalEvent']); + expect(event.detail.ratio).to.be.a('number'); + expect(event.detail.oldRatio).to.be.a('number'); + expect(event.detail.ratio).to.be.above(0); + expect(event.detail.oldRatio).to.be.above(0); + expect(event.detail.ratio).to.be.above(event.detail.oldRatio); + done(); + }); + + cropper = new Cropper(image); + }); + + it('should not change the canvas sizes when default prevented', (done) => { + const image = window.createImage(); + let cropper; + + image.addEventListener('ready', () => { + const canvasData = cropper.getCanvasData(); + + expect(cropper.zoom(0.1).getCanvasData()).to.deep.equal(canvasData); + done(); + }); + + image.addEventListener('zoom', (event) => { + event.preventDefault(); + }); + + cropper = new Cropper(image); + }); +}); diff --git a/library/cropperjs/test/specs/methods/clear.spec.js b/library/cropperjs/test/specs/methods/clear.spec.js new file mode 100644 index 000000000..f9ccb6f6e --- /dev/null +++ b/library/cropperjs/test/specs/methods/clear.spec.js @@ -0,0 +1,37 @@ +describe('clear (method)', () => { + it('should match the expected behaviors after cleared', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + expect(cropper.cropped).to.be.true; + cropper.clear(); + expect(cropper.cropped).to.be.false; + expect(cropper.getData()).to.deep.equal({ + x: 0, + y: 0, + width: 0, + height: 0, + rotate: 0, + scaleX: 1, + scaleY: 1, + }); + expect(cropper.getCropBoxData()).to.be.an('object').that.is.empty; + expect(window.getComputedStyle(cropper.cropBox).display).to.equal('none'); + done(); + }, + }); + }); + + it('should not clear when it is disabled', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + cropper.disable().clear(); + expect(cropper.cropped).to.be.true; + expect(cropper.getCropBoxData()).to.be.an('object').that.is.not.empty; + expect(window.getComputedStyle(cropper.cropBox).display).to.not.equal('none'); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/crop.spec.js b/library/cropperjs/test/specs/methods/crop.spec.js new file mode 100644 index 000000000..b760e7592 --- /dev/null +++ b/library/cropperjs/test/specs/methods/crop.spec.js @@ -0,0 +1,50 @@ +describe('crop (method)', () => { + it('should match the expected behaviors by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + autoCrop: false, + + ready() { + expect(cropper.cropped).to.be.false; + expect(window.getComputedStyle(cropper.cropBox).display).to.equal('none'); + cropper.crop(); + expect(cropper.cropped).to.be.true; + expect(window.getComputedStyle(cropper.cropBox).display).to.not.equal('none'); + done(); + }, + }); + }); + + it('should trigger the `crop` event', (done) => { + const image = window.createImage(); + + image.addEventListener('crop', () => { + done(); + }); + + const cropper = new Cropper(image, { + autoCrop: false, + + ready() { + cropper.crop(); + }, + }); + }); + + it('should not crop again when it is already cropped', (done) => { + const image = window.createImage(); + let count = 0; + const cropper = new Cropper(image, { + crop() { + count += 1; + + if (count > 1) { + expect.fail(1, 0); + } else { + cropper.crop(); + done(); + } + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/destroy.spec.js b/library/cropperjs/test/specs/methods/destroy.spec.js new file mode 100644 index 000000000..c8df79ee8 --- /dev/null +++ b/library/cropperjs/test/specs/methods/destroy.spec.js @@ -0,0 +1,30 @@ +describe('destroy (method)', () => { + it('should destroy before ready', () => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + expect.fail(1, 0); + }, + }); + + expect(image.cropper).to.be.an.instanceof(Cropper); + expect(cropper.xhr).to.be.an.instanceof(XMLHttpRequest); + cropper.destroy(); + expect(cropper.xhr).to.be.not.exist; + expect(image.cropper).to.be.not.exist; + }); + + it('should destroy after ready', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + expect(this.cropper).to.be.an.instanceof(Cropper); + expect(window.getComputedStyle(image).display).to.equal('none'); + cropper.destroy(); + expect(this.cropper).to.be.not.exist; + expect(window.getComputedStyle(image).display).to.not.equal('none'); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/disable.spec.js b/library/cropperjs/test/specs/methods/disable.spec.js new file mode 100644 index 000000000..64deb16a3 --- /dev/null +++ b/library/cropperjs/test/specs/methods/disable.spec.js @@ -0,0 +1,278 @@ +describe('disable (method)', () => { + it('should be disabled after call the method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + expect(cropper.disabled).to.be.false; + expect(cropper.cropper.className).to.not.include('cropper-disabled'); + cropper.disable(); + expect(cropper.disabled).to.be.true; + expect(cropper.cropper.className).to.include('cropper-disabled'); + done(); + }, + }); + }); + + it('should disable the `crop` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + autoCrop: false, + + ready() { + expect(cropper.cropped).to.be.false; + cropper.disable().crop(); + expect(cropper.cropped).to.be.false; + done(); + }, + }); + }); + + it('should disable the `reset` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.moveTo(0).getCanvasData(); + + cropper.disable().reset(); + expect(cropper.getCanvasData()).to.deep.equal(canvasData); + done(); + }, + }); + }); + + it('should disable the `clear` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + expect(cropper.cropped).to.be.true; + cropper.disable().clear(); + expect(cropper.cropped).to.be.true; + done(); + }, + }); + }); + + it('should disable the `replace` method', (done) => { + const image = window.createImage(); + const imageURL = image.src; + const cropper = new Cropper(image, { + ready() { + if (!cropper.replaced) { + cropper.disable().replace('/base/docs/images/picture-2.jpg'); + expect(image.src).to.equal(imageURL); + done(); + } else { + expect.fail(1, 0); + } + }, + }); + }); + + it('should disable the `move` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + + cropper.disable().move(10, 10); + expect(cropper.getCanvasData()).to.deep.equal(canvasData); + done(); + }, + }); + }); + + it('should disable the `moveTo` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + + cropper.disable().moveTo(0); + expect(cropper.getCanvasData()).to.deep.equal(canvasData); + done(); + }, + }); + }); + + it('should disable the `zoom` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + + cropper.disable().zoom(0.1); + expect(cropper.getCanvasData()).to.deep.equal(canvasData); + done(); + }, + }); + }); + + it('should disable the `zoomTo` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + + cropper.disable().zoomTo(1); + expect(cropper.getCanvasData()).to.deep.equal(canvasData); + done(); + }, + }); + }); + + it('should disable the `rotate` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + + cropper.disable().rotate(45); + expect(cropper.getCanvasData()).to.deep.equal(canvasData); + done(); + }, + }); + }); + + it('should disable the `rotateTo` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + + cropper.disable().rotateTo(45); + expect(cropper.getCanvasData()).to.deep.equal(canvasData); + done(); + }, + }); + }); + + it('should disable the `scaleX` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + + cropper.disable().scaleX(2); + expect(cropper.getCanvasData()).to.deep.equal(canvasData); + done(); + }, + }); + }); + + it('should disable the `scaleY` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + + cropper.disable().scaleY(2); + expect(cropper.getCanvasData()).to.deep.equal(canvasData); + done(); + }, + }); + }); + + it('should disable the `scale` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + + cropper.disable().scale(2); + expect(cropper.getCanvasData()).to.deep.equal(canvasData); + done(); + }, + }); + }); + + it('should disable the `setData` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const data = cropper.getData(); + + cropper.disable().setData({ + width: 160, + }); + expect(cropper.getData()).to.deep.equal(data); + done(); + }, + }); + }); + + it('should disable the `setCanvasData` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + + cropper.disable().setCanvasData({ + width: 160, + }); + expect(cropper.getCanvasData()).to.deep.equal(canvasData); + done(); + }, + }); + }); + + it('should disable the `setCropBoxData` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const cropBoxData = cropper.getCropBoxData(); + + cropper.disable().setCropBoxData({ + width: 160, + }); + expect(cropper.getCropBoxData()).to.deep.equal(cropBoxData); + done(); + }, + }); + }); + + it('should disable the `setAspectRatio` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + cropper.disable().setAspectRatio(0.618); + expect(cropper.options.aspectRatio).to.be.NaN; + done(); + }, + }); + }); + + it('should disable the `setDragMode` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const { dragMode } = cropper.options; + + cropper.disable().setDragMode('none'); + expect(cropper.options.dragMode).to.equal(dragMode); + done(); + }, + }); + }); + + it('should not disable the `enable` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + cropper.disable().enable(); + expect(cropper.disabled).to.be.false; + done(); + }, + }); + }); + + it('should not disable the `destroy` method', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + cropper.disable().destroy(); + expect(image.cropper).to.be.undefined; + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/enable.spec.js b/library/cropperjs/test/specs/methods/enable.spec.js new file mode 100644 index 000000000..9a8c16fed --- /dev/null +++ b/library/cropperjs/test/specs/methods/enable.spec.js @@ -0,0 +1,16 @@ +describe('enable (method)', () => { + it('should be enabled', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + cropper.disable(); + expect(cropper.disabled).to.be.true; + expect(cropper.cropper.className).to.include('cropper-disabled'); + cropper.enable(); + expect(cropper.disabled).to.be.false; + expect(cropper.cropper.className).to.not.include('cropper-disabled'); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/getCanvasData.spec.js b/library/cropperjs/test/specs/methods/getCanvasData.spec.js new file mode 100644 index 000000000..679c39269 --- /dev/null +++ b/library/cropperjs/test/specs/methods/getCanvasData.spec.js @@ -0,0 +1,27 @@ +describe('getCanvasData (method)', () => { + it('should get an empty object when it is not ready', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + const canvasData = cropper.getCanvasData(); + + expect(canvasData).to.be.an('object').that.is.empty; + }); + + it('should get expect canvas data when ready', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + + expect(canvasData).to.be.an('object').that.has.all.keys(['left', 'top', 'width', 'height', 'naturalWidth', 'naturalHeight']); + expect(canvasData.left).to.be.a('number'); + expect(canvasData.top).to.be.a('number'); + expect(canvasData.width).to.be.a('number'); + expect(canvasData.height).to.be.a('number'); + expect(canvasData.naturalWidth).to.be.a('number'); + expect(canvasData.naturalHeight).to.be.a('number'); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/getContainerData.spec.js b/library/cropperjs/test/specs/methods/getContainerData.spec.js new file mode 100644 index 000000000..7ab676277 --- /dev/null +++ b/library/cropperjs/test/specs/methods/getContainerData.spec.js @@ -0,0 +1,23 @@ +describe('getContainerData (method)', () => { + it('should get an empty object when it is not ready', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + const containerData = cropper.getContainerData(); + + expect(containerData).to.be.an('object').that.is.empty; + }); + + it('should get expect container data when ready', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const containerData = cropper.getContainerData(); + + expect(containerData).to.be.an('object').that.has.all.keys(['width', 'height']); + expect(containerData.width).to.be.a('number'); + expect(containerData.height).to.be.a('number'); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/getCropBoxData.spec.js b/library/cropperjs/test/specs/methods/getCropBoxData.spec.js new file mode 100644 index 000000000..f2760ca99 --- /dev/null +++ b/library/cropperjs/test/specs/methods/getCropBoxData.spec.js @@ -0,0 +1,25 @@ +describe('getCropBoxData (method)', () => { + it('should get an empty object when it is not ready', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + const cropBoxData = cropper.getCropBoxData(); + + expect(cropBoxData).to.be.an('object').that.is.empty; + }); + + it('should get expect crop box data when ready', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const cropBoxData = cropper.getCropBoxData(); + + expect(cropBoxData).to.be.an('object').that.has.all.keys(['left', 'top', 'width', 'height']); + expect(cropBoxData.left).to.be.a('number'); + expect(cropBoxData.top).to.be.a('number'); + expect(cropBoxData.width).to.be.a('number'); + expect(cropBoxData.height).to.be.a('number'); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/getCroppedCanvas.spec.js b/library/cropperjs/test/specs/methods/getCroppedCanvas.spec.js new file mode 100644 index 000000000..16441773f --- /dev/null +++ b/library/cropperjs/test/specs/methods/getCroppedCanvas.spec.js @@ -0,0 +1,195 @@ +describe('getCroppedCanvas (method)', () => { + it('should get a canvas with the whole image drew when it is not cropped', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + autoCrop: false, + + ready() { + const canvasData = cropper.getCanvasData(); + const canvas = cropper.getCroppedCanvas(); + + expect(canvas).to.be.an.instanceof(HTMLCanvasElement); + expect(canvas.width).to.equal(canvasData.naturalWidth); + expect(canvas.height).to.equal(canvasData.naturalHeight); + done(); + }, + }); + }); + + it('should get a canvas with the cropped area of the image drew', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const data = cropper.getData(); + const canvas = cropper.getCroppedCanvas(); + + expect(canvas).to.be.an.instanceof(HTMLCanvasElement); + expect(canvas.width).to.equal(data.width); + expect(canvas.height).to.equal(data.height); + done(); + }, + }); + }); + + it('should match the given width', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const width = 160; + const canvas = cropper.getCroppedCanvas({ + width, + }); + + expect(canvas.width).to.equal(width); + done(); + }, + }); + }); + + it('should match the given height', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const height = 90; + const canvas = cropper.getCroppedCanvas({ + height, + }); + + expect(canvas.height).to.equal(height); + done(); + }, + }); + }); + + it('should be contained when both width and height are given', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const width = 160; + const height = 90; + const canvas = cropper.getCroppedCanvas({ + width, + height, + }); + + expect(canvas.width).to.be.most(width); + expect(canvas.height).to.be.most(height); + done(); + }, + }); + }); + + it('should not be greater than the maximum width', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const maxWidth = 160; + const canvas = cropper.getCroppedCanvas({ + maxWidth, + }); + + expect(canvas.width).to.be.most(maxWidth); + done(); + }, + }); + }); + + it('should not be greater than the maximum height', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const maxHeight = 90; + const canvas = cropper.getCroppedCanvas({ + maxHeight, + }); + + expect(canvas.height).to.be.most(maxHeight); + done(); + }, + }); + }); + + it('should not be greater than both the maximum width and maximum height', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const maxWidth = 160; + const maxHeight = 90; + const canvas = cropper.getCroppedCanvas({ + maxWidth, + maxHeight, + }); + + expect(canvas.width).to.be.most(maxWidth); + expect(canvas.height).to.be.most(maxHeight); + done(); + }, + }); + }); + + it('should not be less than the minimum width', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const minWidth = 1600; + const canvas = cropper.getCroppedCanvas({ + minWidth, + }); + + expect(canvas.width).to.be.least(minWidth); + done(); + }, + }); + }); + + it('should not be less than the minimum height', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const minHeight = 900; + const canvas = cropper.getCroppedCanvas({ + minHeight, + }); + + expect(canvas.height).to.be.least(minHeight); + done(); + }, + }); + }); + + it('should not be less than both the minimum width and minimum height', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const minWidth = 1600; + const minHeight = 900; + const canvas = cropper.getCroppedCanvas({ + minWidth, + minHeight, + }); + + expect(canvas.width).to.be.least(minWidth); + expect(canvas.height).to.be.least(minHeight); + done(); + }, + }); + }); + + it('should match the given fill color', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvas = cropper.zoomTo(0.1).getCroppedCanvas({ + fillColor: '#010101', + }); + const pixelData = canvas.getContext('2d').getImageData(0, 0, 1, 1).data; + + expect(pixelData[0]).to.equal(1, 'red is 1'); + expect(pixelData[1]).to.equal(1, 'green is 1'); + expect(pixelData[2]).to.equal(1, 'blue is 1'); + expect(pixelData[3]).to.equal(255, 'color is opaque'); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/getData.spec.js b/library/cropperjs/test/specs/methods/getData.spec.js new file mode 100644 index 000000000..13bcd2304 --- /dev/null +++ b/library/cropperjs/test/specs/methods/getData.spec.js @@ -0,0 +1,91 @@ +describe('getData (method)', () => { + const initialData = { + x: 0, + y: 0, + width: 0, + height: 0, + rotate: 0, + scaleX: 1, + scaleY: 1, + }; + + it('should get initial data when it is not ready', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + + expect(cropper.getData()).to.deep.equal(initialData); + }); + + it('should get initial data when it is not cropped', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + autoCrop: false, + + ready() { + expect(cropper.cropped).to.be.false; + expect(cropper.getData()).to.deep.equal(initialData); + done(); + }, + }); + }); + + it('should get data with expected properties', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const data = cropper.getData(); + + expect(data).to.be.an('object').that.has.all.keys(['x', 'y', 'width', 'height', 'rotate', 'scaleX', 'scaleY']); + expect(data.x).to.be.a('number'); + expect(data.y).to.be.a('number'); + expect(data.width).to.be.a('number'); + expect(data.height).to.be.a('number'); + expect(data.rotate).to.be.a('number'); + expect(data.scaleX).to.be.a('number'); + expect(data.scaleY).to.be.a('number'); + done(); + }, + }); + }); + + it('should get data with rounded property values', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const data = cropper.getData(true); + + expect(data.x % 1).to.equal(0); + expect(data.y % 1).to.equal(0); + expect(data.width % 1).to.equal(0); + expect(data.height % 1).to.equal(0); + done(); + }, + }); + }); + + it('should not exceed the natural width/height after rounded', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + viewMode: 1, + + ready() { + const imageData = cropper.getImageData(); + const left = 155.5; + const top = 155.5; + + cropper.setData({ + left, + top, + width: imageData.naturalWidth - left, + height: imageData.naturalHeight - top, + }); + + const roundedData = cropper.getData(true); + + expect(roundedData.x + roundedData.width).to.be.at.most(imageData.naturalWidth); + expect(roundedData.y + roundedData.height).to.be.at.most(imageData.naturalHeight); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/getImageData.spec.js b/library/cropperjs/test/specs/methods/getImageData.spec.js new file mode 100644 index 000000000..c8d9ea703 --- /dev/null +++ b/library/cropperjs/test/specs/methods/getImageData.spec.js @@ -0,0 +1,62 @@ +describe('getImageData (method)', () => { + it('should get an empty object when it is not loaded', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + const imageData = cropper.getImageData(); + + expect(imageData).to.be.an('object').that.is.empty; + }); + + it('should get expect image data when loaded', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const imageData = cropper.getImageData(); + + expect(imageData).to.have.all.keys(['left', 'top', 'width', 'height', 'rotate', 'scaleX', 'scaleY', 'naturalWidth', 'naturalHeight', 'aspectRatio']); + expect(imageData.left).to.be.a('number'); + expect(imageData.top).to.be.a('number'); + expect(imageData.width).to.be.a('number'); + expect(imageData.height).to.be.a('number'); + expect(imageData.rotate).to.be.a('number'); + expect(imageData.scaleX).to.be.a('number'); + expect(imageData.scaleY).to.be.a('number'); + expect(imageData.naturalWidth).to.be.a('number'); + expect(imageData.naturalHeight).to.be.a('number'); + expect(imageData.aspectRatio).to.be.a('number'); + done(); + }, + }); + }); + + it('should not have the `rotate` property when it is not rotatable', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + rotatable: false, + + ready() { + const imageData = cropper.getImageData(); + + expect(imageData).to.have.all.keys(['left', 'top', 'width', 'height', 'scaleX', 'scaleY', 'naturalWidth', 'naturalHeight', 'aspectRatio']); + expect(imageData.rotate).to.be.undefined; + done(); + }, + }); + }); + + it('should not have the `scaleX` and `scaleY` properties when it is not scalable', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + scalable: false, + + ready() { + const imageData = cropper.getImageData(); + + expect(imageData).to.have.all.keys(['left', 'top', 'width', 'height', 'rotate', 'naturalWidth', 'naturalHeight', 'aspectRatio']); + expect(imageData.scaleX).to.be.undefined; + expect(imageData.scaleY).to.be.undefined; + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/move.spec.js b/library/cropperjs/test/specs/methods/move.spec.js new file mode 100644 index 000000000..8f89ba5e8 --- /dev/null +++ b/library/cropperjs/test/specs/methods/move.spec.js @@ -0,0 +1,31 @@ +describe('move (method)', () => { + it('should move with the given offsets', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + const changedCanvasData = cropper.move(1, 1).getCanvasData(); + + expect(changedCanvasData.left).to.equal(canvasData.left + 1); + expect(changedCanvasData.top).to.equal(canvasData.top + 1); + done(); + }, + }); + }); + + it('should not work when it is not movable', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + movable: false, + + ready() { + const canvasData = cropper.getCanvasData(); + const changedCanvasData = cropper.move(1, 1).getCanvasData(); + + expect(changedCanvasData.left).to.equal(canvasData.left); + expect(changedCanvasData.top).to.equal(canvasData.top); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/moveTo.spec.js b/library/cropperjs/test/specs/methods/moveTo.spec.js new file mode 100644 index 000000000..42403b41c --- /dev/null +++ b/library/cropperjs/test/specs/methods/moveTo.spec.js @@ -0,0 +1,29 @@ +describe('moveTo (method)', () => { + it('should move to the given coordinate', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.moveTo(100, 100).getCanvasData(); + + expect(canvasData.left).to.equal(100); + expect(canvasData.top).to.equal(100); + done(); + }, + }); + }); + + it('should not work when it is not movable', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + movable: false, + + ready() { + const canvasData = cropper.moveTo(100, 100).getCanvasData(); + + expect(canvasData.left).to.not.equal(100); + expect(canvasData.top).to.not.equal(100); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/noConflict.spec.js b/library/cropperjs/test/specs/methods/noConflict.spec.js new file mode 100644 index 000000000..d5c1c43d8 --- /dev/null +++ b/library/cropperjs/test/specs/methods/noConflict.spec.js @@ -0,0 +1,16 @@ +describe('noConflict', () => { + it('should be a static method', () => { + expect(Cropper.noConflict).to.be.a('function'); + }); + + it('should return the Cropper class itself', () => { + const { Cropper } = window; + const ImageCropper = Cropper.noConflict(); + + expect(ImageCropper).to.equal(Cropper); + expect(window.Cropper).to.be.undefined; + + // Reverts it for the rest test suites + window.Cropper = ImageCropper; + }); +}); diff --git a/library/cropperjs/test/specs/methods/replace.spec.js b/library/cropperjs/test/specs/methods/replace.spec.js new file mode 100644 index 000000000..378cb0af8 --- /dev/null +++ b/library/cropperjs/test/specs/methods/replace.spec.js @@ -0,0 +1,17 @@ +describe('replace (method)', () => { + it('should replace the image url with a new one', (done) => { + const image = window.createImage(); + const imageURL = '/base/docs/images/picture-2.jpg'; + const cropper = new Cropper(image, { + ready() { + cropper.options.ready = () => { + expect(image.src).to.include(imageURL); + done(); + }; + + expect(image.src).to.not.include(imageURL); + cropper.replace(imageURL); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/reset.spec.js b/library/cropperjs/test/specs/methods/reset.spec.js new file mode 100644 index 000000000..e060d9794 --- /dev/null +++ b/library/cropperjs/test/specs/methods/reset.spec.js @@ -0,0 +1,30 @@ +describe('reset (method)', () => { + it('should reset the cropper to its initial state', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + const cropBoxData = cropper.getCropBoxData(); + + cropper.setCanvasData({ + top: canvasData.top + 10, + width: canvasData.width - 10, + }); + + expect(cropper.getCanvasData()).to.not.deep.equal(canvasData); + + cropper.setCropBoxData({ + left: cropBoxData.left + 10, + height: cropBoxData.height - 10, + }); + + expect(cropper.getCropBoxData()).to.not.deep.equal(cropBoxData); + + cropper.reset(); + expect(cropper.getCanvasData()).to.deep.equal(canvasData); + expect(cropper.getCropBoxData()).to.deep.equal(cropBoxData); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/rotate.spec.js b/library/cropperjs/test/specs/methods/rotate.spec.js new file mode 100644 index 000000000..b4cfef511 --- /dev/null +++ b/library/cropperjs/test/specs/methods/rotate.spec.js @@ -0,0 +1,27 @@ +describe('rotate (method)', () => { + it('should rotate with the given degree', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + expect(cropper.rotate(360).getImageData().rotate).to.equal(0); + expect(cropper.rotate(90).getImageData().rotate).to.equal(90); + expect(cropper.rotate(-180).getImageData().rotate).to.equal(-90); + done(); + }, + }); + }); + + it('should not work when it is not rotatable', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + rotatable: false, + + ready() { + expect(cropper.rotate(360).getImageData().rotate).to.be.undefined; + expect(cropper.rotate(90).getImageData().rotate).to.be.undefined; + expect(cropper.rotate(-180).getImageData().rotate).to.be.undefined; + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/rotateTo.spec.js b/library/cropperjs/test/specs/methods/rotateTo.spec.js new file mode 100644 index 000000000..0ae59ee55 --- /dev/null +++ b/library/cropperjs/test/specs/methods/rotateTo.spec.js @@ -0,0 +1,28 @@ +describe('rotateTo (method)', () => { + it('should rotate to the given degree', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + expect(cropper.rotateTo(360).getImageData().rotate).to.equal(0); + expect(cropper.rotateTo(90).getImageData().rotate).to.equal(90); + expect(cropper.rotateTo(0).getImageData().rotate).to.equal(0); + expect(cropper.rotateTo(-180).getImageData().rotate).to.equal(-180); + done(); + }, + }); + }); + + it('should not work when it is not rotatable', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + rotatable: false, + + ready() { + expect(cropper.rotateTo(360).getImageData().rotate).to.be.undefined; + expect(cropper.rotateTo(90).getImageData().rotate).to.be.undefined; + expect(cropper.rotateTo(-180).getImageData().rotate).to.be.undefined; + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/scale.spec.js b/library/cropperjs/test/specs/methods/scale.spec.js new file mode 100644 index 000000000..9918cba3a --- /dev/null +++ b/library/cropperjs/test/specs/methods/scale.spec.js @@ -0,0 +1,29 @@ +describe('scale (method)', () => { + it('should scale with the given values', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const imageData = cropper.scale(-1, -1).getImageData(); + + expect(imageData.scaleX).to.equal(-1); + expect(imageData.scaleY).to.equal(-1); + done(); + }, + }); + }); + + it('should not work when it is not scalable', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + scalable: false, + + ready() { + const imageData = cropper.scale(-1, -1).getImageData(); + + expect(imageData.scaleX).to.be.undefined; + expect(imageData.scaleY).to.be.undefined; + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/scaleX.spec.js b/library/cropperjs/test/specs/methods/scaleX.spec.js new file mode 100644 index 000000000..72ac8e28a --- /dev/null +++ b/library/cropperjs/test/specs/methods/scaleX.spec.js @@ -0,0 +1,27 @@ +describe('scaleX (method)', () => { + it('should be scaled in the x-axis', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const imageData = cropper.scaleX(-1).getImageData(); + + expect(imageData.scaleX).to.equal(-1); + done(); + }, + }); + }); + + it('should not work when it is not scalable', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + scalable: false, + + ready() { + const imageData = cropper.scaleX(-1).getImageData(); + + expect(imageData.scaleX).to.be.undefined; + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/scaleY.spec.js b/library/cropperjs/test/specs/methods/scaleY.spec.js new file mode 100644 index 000000000..f983a2fbf --- /dev/null +++ b/library/cropperjs/test/specs/methods/scaleY.spec.js @@ -0,0 +1,27 @@ +describe('scaleY (method)', () => { + it('should be scaled in the y-axis', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const imageData = cropper.scaleY(-1).getImageData(); + + expect(imageData.scaleY).to.equal(-1); + done(); + }, + }); + }); + + it('should not work when it is not scalable', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + scalable: false, + + ready() { + const imageData = cropper.scaleY(-1).getImageData(); + + expect(imageData.scaleY).to.be.undefined; + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/setAspectRatio.spec.js b/library/cropperjs/test/specs/methods/setAspectRatio.spec.js new file mode 100644 index 000000000..dc76ad18f --- /dev/null +++ b/library/cropperjs/test/specs/methods/setAspectRatio.spec.js @@ -0,0 +1,31 @@ +describe('setAspectRatio (method)', () => { + it('should change the aspect ratio to `1`', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const { options } = cropper; + + expect(options.aspectRatio).to.be.NaN; + cropper.setAspectRatio(1); + expect(options.aspectRatio).to.equal(1); + done(); + }, + }); + }); + + it('should change the aspect ratio to `NaN`', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + aspectRatio: 1, + + ready() { + const { options } = cropper; + + expect(options.aspectRatio).to.equal(1); + cropper.setAspectRatio(NaN); + expect(options.aspectRatio).to.be.NaN; + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/setCanvasData.spec.js b/library/cropperjs/test/specs/methods/setCanvasData.spec.js new file mode 100644 index 000000000..316161acc --- /dev/null +++ b/library/cropperjs/test/specs/methods/setCanvasData.spec.js @@ -0,0 +1,39 @@ +describe('setCanvasData (method)', () => { + it('should change the positions only', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + const changedCanvasData = cropper.setCanvasData({ + left: 16, + top: 9, + }).getCanvasData(); + + expect(changedCanvasData.left).to.not.equal(canvasData.left); + expect(changedCanvasData.top).to.not.equal(canvasData.top); + expect(changedCanvasData.width).to.equal(canvasData.width); + expect(changedCanvasData.height).to.equal(canvasData.height); + done(); + }, + }); + }); + + it('should change the sizes only', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + const changedCanvasData = cropper.setCanvasData({ + width: 320, + height: 180, + }).getCanvasData(); + + expect(changedCanvasData.left).to.equal(canvasData.left); + expect(changedCanvasData.top).to.equal(canvasData.top); + expect(changedCanvasData.width).to.not.equal(canvasData.width); + expect(changedCanvasData.height).to.not.equal(canvasData.height); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/setCropBoxData.spec.js b/library/cropperjs/test/specs/methods/setCropBoxData.spec.js new file mode 100644 index 000000000..829c83419 --- /dev/null +++ b/library/cropperjs/test/specs/methods/setCropBoxData.spec.js @@ -0,0 +1,39 @@ +describe('setCropBoxData (method)', () => { + it('should change the positions only', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const cropBoxData = cropper.getCropBoxData(); + const changedCropBoxData = cropper.setCropBoxData({ + left: 16, + top: 9, + }).getCropBoxData(); + + expect(changedCropBoxData.left).to.not.equal(cropBoxData.left); + expect(changedCropBoxData.top).to.not.equal(cropBoxData.top); + expect(changedCropBoxData.width).to.equal(cropBoxData.width); + expect(changedCropBoxData.height).to.equal(cropBoxData.height); + done(); + }, + }); + }); + + it('should change the sizes only', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const cropBoxData = cropper.getCropBoxData(); + const changedCropBoxData = cropper.setCropBoxData({ + width: 320, + height: 180, + }).getCropBoxData(); + + expect(changedCropBoxData.left).to.equal(cropBoxData.left); + expect(changedCropBoxData.top).to.equal(cropBoxData.top); + expect(changedCropBoxData.width).to.not.equal(cropBoxData.width); + expect(changedCropBoxData.height).to.not.equal(cropBoxData.height); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/setData.spec.js b/library/cropperjs/test/specs/methods/setData.spec.js new file mode 100644 index 000000000..418052409 --- /dev/null +++ b/library/cropperjs/test/specs/methods/setData.spec.js @@ -0,0 +1,71 @@ +describe('setData (method)', () => { + it('should change the positions only', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const data = cropper.getData(); + const changedData = cropper.setData({ + x: 1, + y: 1, + }).getData(); + + expect(changedData.x).to.not.equal(data.x); + expect(changedData.y).to.not.equal(data.y); + expect(changedData.width).to.equal(data.width); + expect(changedData.height).to.equal(data.height); + done(); + }, + }); + }); + + it('should change the positions only', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const data = cropper.getData(); + const changedData = cropper.setData({ + width: 160, + height: 90, + }).getData(); + + expect(changedData.x).to.equal(data.x); + expect(changedData.y).to.equal(data.y); + expect(changedData.width).to.not.equal(data.width); + expect(changedData.height).to.not.equal(data.height); + done(); + }, + }); + }); + + it('should change the rotate degrees', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const data = cropper.getData(); + const changedData = cropper.setData({ + rotate: 90, + }).getData(); + + expect(changedData.rotate).to.not.equal(data.rotate); + done(); + }, + }); + }); + + it('should change the scale in both x-axis and y-axis', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const data = cropper.getData(); + const changedData = cropper.setData({ + scaleX: -1, + scaleY: -1, + }).getData(); + + expect(changedData.scaleX).to.not.equal(data.scaleX); + expect(changedData.scaleY).to.not.equal(data.scaleY); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/setDefaults.spec.js b/library/cropperjs/test/specs/methods/setDefaults.spec.js new file mode 100644 index 000000000..fb894db3b --- /dev/null +++ b/library/cropperjs/test/specs/methods/setDefaults.spec.js @@ -0,0 +1,30 @@ +describe('setDefaults', () => { + it('should be a static method', () => { + expect(Cropper.setDefaults).to.be.a('function'); + }); + + it('should change the global default options', (done) => { + Cropper.setDefaults({ + aspectRatio: 1, + }); + + const image = window.createImage(); + const cropper = new Cropper(image, { + aspectRatio: 1, + + crop() { + const cropBoxData = cropper.getCropBoxData(); + + expect(cropBoxData.width).to.equal(cropBoxData.height); + done(); + }, + }); + + expect(cropper.options.aspectRatio).to.equal(1); + + // Reverts it for the rest test suites + Cropper.setDefaults({ + aspectRatio: NaN, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/setDragMode.spec.js b/library/cropperjs/test/specs/methods/setDragMode.spec.js new file mode 100644 index 000000000..612220ec2 --- /dev/null +++ b/library/cropperjs/test/specs/methods/setDragMode.spec.js @@ -0,0 +1,29 @@ +describe('setDragMode (method)', () => { + it('should set the drag mode to "move"', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const { dragBox } = cropper; + + expect(dragBox.dataset.cropperAction).to.equal('crop'); + cropper.setDragMode('move'); + expect(dragBox.dataset.cropperAction).to.equal('move'); + done(); + }, + }); + }); + + it('should set the drag mode to "none"', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const { dragBox } = cropper; + + expect(dragBox.dataset.cropperAction).to.equal('crop'); + cropper.setDragMode('none'); + expect(dragBox.dataset.cropperAction).to.equal('none'); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/zoom.spec.js b/library/cropperjs/test/specs/methods/zoom.spec.js new file mode 100644 index 000000000..4989d27e6 --- /dev/null +++ b/library/cropperjs/test/specs/methods/zoom.spec.js @@ -0,0 +1,31 @@ +describe('zoom (method)', () => { + it('should be zoomed', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + const changedCanvasData = cropper.zoom(0.1).getCanvasData(); + + expect(changedCanvasData.width).to.be.above(canvasData.width); + expect(changedCanvasData.height).to.be.above(canvasData.height); + done(); + }, + }); + }); + + it('should not be zoomed when it is not zoomable', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + zoomable: false, + + ready() { + const canvasData = cropper.getCanvasData(); + const changedCanvasData = cropper.zoom(0.1).getCanvasData(); + + expect(changedCanvasData.width).to.equal(canvasData.width); + expect(changedCanvasData.height).to.equal(canvasData.height); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/methods/zoomTo.spec.js b/library/cropperjs/test/specs/methods/zoomTo.spec.js new file mode 100644 index 000000000..a06730485 --- /dev/null +++ b/library/cropperjs/test/specs/methods/zoomTo.spec.js @@ -0,0 +1,33 @@ +describe('zoomTo (method)', () => { + it('should zoom to the certain ratio', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const imageData = cropper.zoomTo(1).getImageData(); + const canvasData = cropper.getCanvasData(); + + expect(imageData.width).to.equal(imageData.naturalWidth); + expect(canvasData.width).to.equal(canvasData.naturalWidth); + expect(canvasData.naturalWidth).to.equal(imageData.naturalWidth); + done(); + }, + }); + }); + + it('should not be zoomed when it is not zoomable', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + zoomable: false, + + ready() { + const imageData = cropper.zoomTo(1).getImageData(); + const canvasData = cropper.getCanvasData(); + + expect(imageData.width).to.not.equal(imageData.naturalWidth); + expect(canvasData.width).to.not.equal(canvasData.naturalWidth); + expect(canvasData.naturalWidth).to.equal(imageData.naturalWidth); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/options/aspectRatio.spec.js b/library/cropperjs/test/specs/options/aspectRatio.spec.js new file mode 100644 index 000000000..4524d2810 --- /dev/null +++ b/library/cropperjs/test/specs/options/aspectRatio.spec.js @@ -0,0 +1,24 @@ +describe('aspectRatio (option)', () => { + it('should be `NaN` by default', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + + expect(cropper.options.aspectRatio).to.be.NaN; + }); + + it('should match the given aspect ratio', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + aspectRatio: 1, + + crop() { + const cropBoxData = cropper.getCropBoxData(); + + expect(cropBoxData.width).to.equal(cropBoxData.height); + done(); + }, + }); + + expect(cropper.options.aspectRatio).to.equal(1); + }); +}); diff --git a/library/cropperjs/test/specs/options/autoCrop.spec.js b/library/cropperjs/test/specs/options/autoCrop.spec.js new file mode 100644 index 000000000..19899e94d --- /dev/null +++ b/library/cropperjs/test/specs/options/autoCrop.spec.js @@ -0,0 +1,29 @@ +describe('autoCrop (option)', () => { + it('should crop automatically by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + expect(cropper.cropped).to.be.true; + expect(window.getComputedStyle(cropper.cropBox).display).to.not.equal('none'); + done(); + }, + }); + + expect(cropper.options.autoCrop).to.be.true; + }); + + it('should not crop automatically', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + autoCrop: false, + + ready() { + expect(cropper.cropped).to.be.false; + expect(window.getComputedStyle(cropper.cropBox).display).to.equal('none'); + done(); + }, + }); + + expect(cropper.options.autoCrop).to.be.false; + }); +}); diff --git a/library/cropperjs/test/specs/options/autoCropArea.spec.js b/library/cropperjs/test/specs/options/autoCropArea.spec.js new file mode 100644 index 000000000..40513f4f3 --- /dev/null +++ b/library/cropperjs/test/specs/options/autoCropArea.spec.js @@ -0,0 +1,35 @@ +describe('autoCropArea (option)', () => { + it('should be 80% by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + const cropBoxData = cropper.getCropBoxData(); + + expect(canvasData.width * 0.8).to.equal(cropBoxData.width); + expect(canvasData.height * 0.8).to.equal(cropBoxData.height); + done(); + }, + }); + + expect(cropper.options.autoCropArea).to.equal(0.8); + }); + + it('should be 100%', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + autoCropArea: 1, + + ready() { + const canvasData = cropper.getCanvasData(); + const cropBoxData = cropper.getCropBoxData(); + + expect(canvasData.width).to.equal(cropBoxData.width); + expect(canvasData.height).to.equal(cropBoxData.height); + done(); + }, + }); + + expect(cropper.options.autoCropArea).to.equal(1); + }); +}); diff --git a/library/cropperjs/test/specs/options/background.spec.js b/library/cropperjs/test/specs/options/background.spec.js new file mode 100644 index 000000000..d1f9866e2 --- /dev/null +++ b/library/cropperjs/test/specs/options/background.spec.js @@ -0,0 +1,27 @@ +describe('background (option)', () => { + it('should show the background by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + expect(window.getComputedStyle(cropper.cropper).backgroundImage).to.not.equal('none'); + done(); + }, + }); + + expect(cropper.options.background).to.be.true; + }); + + it('should not show the background', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + background: false, + + ready() { + expect(window.getComputedStyle(cropper.cropper).backgroundImage).to.equal('none'); + done(); + }, + }); + + expect(cropper.options.background).to.be.false; + }); +}); diff --git a/library/cropperjs/test/specs/options/center.spec.js b/library/cropperjs/test/specs/options/center.spec.js new file mode 100644 index 000000000..37551435e --- /dev/null +++ b/library/cropperjs/test/specs/options/center.spec.js @@ -0,0 +1,31 @@ +describe('center (option)', () => { + it('should show the center cross hair by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const center = cropper.cropper.querySelector('.cropper-center'); + + expect(window.getComputedStyle(center).display).to.not.equal('none'); + done(); + }, + }); + + expect(cropper.options.center).to.be.true; + }); + + it('should hide the center cross hair', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + center: false, + + ready() { + const center = cropper.cropper.querySelector('.cropper-center'); + + expect(window.getComputedStyle(center).display).to.equal('none'); + done(); + }, + }); + + expect(cropper.options.center).to.be.false; + }); +}); diff --git a/library/cropperjs/test/specs/options/checkCrossOrigin.spec.js b/library/cropperjs/test/specs/options/checkCrossOrigin.spec.js new file mode 100644 index 000000000..52d9b4682 --- /dev/null +++ b/library/cropperjs/test/specs/options/checkCrossOrigin.spec.js @@ -0,0 +1,49 @@ +describe('checkCrossOrigin (option)', () => { + const crossOriginImageURL = 'https://fengyuanchen.github.io/cropperjs/images/picture.jpg'; + + it('should check cross origin by default', (done) => { + const image = window.createImage({ + src: crossOriginImageURL, + }); + const cropper = new Cropper(image, { + ready() { + expect(cropper.image.crossOrigin).to.equal('anonymous'); + expect(cropper.image.src).to.include('timestamp'); + done(); + }, + }); + + expect(cropper.options.checkCrossOrigin).to.be.true; + }); + + it('should not check cross origin', (done) => { + const image = window.createImage({ + src: crossOriginImageURL, + }); + const cropper = new Cropper(image, { + checkCrossOrigin: false, + + ready() { + expect(cropper.image.crossOrigin).to.be.null; + expect(cropper.image.src).to.not.include('timestamp'); + done(); + }, + }); + + expect(cropper.options.checkCrossOrigin).to.be.false; + }); + + it('should add timestamp even though the image has the `crossOrigin` attribute', (done) => { + const image = window.createImage({ + src: crossOriginImageURL, + crossOrigin: 'anonymous', + }); + const cropper = new Cropper(image, { + ready() { + expect(cropper.image.crossOrigin).to.equal('anonymous'); + expect(cropper.image.src).to.include('timestamp'); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/options/checkOrientation.spec.js b/library/cropperjs/test/specs/options/checkOrientation.spec.js new file mode 100644 index 000000000..6f37e6db2 --- /dev/null +++ b/library/cropperjs/test/specs/options/checkOrientation.spec.js @@ -0,0 +1,45 @@ +describe('checkOrientation (option)', () => { + const imageURL = '/base/docs/images/picture-3.jpg'; + + it('should check orientation be default', (done) => { + const image = window.createImage({ + src: imageURL, + }); + const cropper = new Cropper(image, { + ready() { + expect(cropper.getData().rotate).to.not.equal(0); + done(); + }, + }); + + expect(cropper.options.checkOrientation).to.be.true; + }); + + it('should not check orientation', (done) => { + const image = window.createImage({ + src: imageURL, + }); + const cropper = new Cropper(image, { + checkOrientation: false, + + ready() { + expect(cropper.getData().rotate).to.equal(0); + done(); + }, + }); + + expect(cropper.options.checkOrientation).to.be.false; + }); + + it('should not check orientation when it is not rotatable and not scalable', () => { + const image = window.createImage({ + src: imageURL, + }); + const cropper = new Cropper(image, { + rotatable: false, + scalable: false, + }); + + expect(cropper.options.checkOrientation).to.be.false; + }); +}); diff --git a/library/cropperjs/test/specs/options/crop.spec.js b/library/cropperjs/test/specs/options/crop.spec.js new file mode 100644 index 000000000..a3e11f2d7 --- /dev/null +++ b/library/cropperjs/test/specs/options/crop.spec.js @@ -0,0 +1,28 @@ +describe('crop (option)', () => { + it('should be `null` be default', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + + expect(cropper.options.crop).to.be.null; + }); + + it('should execute the `crop` hook function', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + crop(event) { + expect(event.type).to.equal('crop'); + expect(event.detail).to.be.an('object').that.has.all.keys(['x', 'y', 'width', 'height', 'rotate', 'scaleX', 'scaleY']); + expect(event.detail.x).to.be.a('number'); + expect(event.detail.y).to.be.a('number'); + expect(event.detail.width).to.be.a('number'); + expect(event.detail.height).to.be.a('number'); + expect(event.detail.rotate).to.be.a('number'); + expect(event.detail.scaleX).to.be.a('number'); + expect(event.detail.scaleY).to.be.a('number'); + done(); + }, + }); + + expect(cropper.options.crop).to.be.a('function'); + }); +}); diff --git a/library/cropperjs/test/specs/options/cropBoxMovable.spec.js b/library/cropperjs/test/specs/options/cropBoxMovable.spec.js new file mode 100644 index 000000000..8a1e52cc4 --- /dev/null +++ b/library/cropperjs/test/specs/options/cropBoxMovable.spec.js @@ -0,0 +1,31 @@ +describe('cropBoxMovable (option)', () => { + it('should by movable by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const face = cropper.cropper.querySelector('.cropper-face'); + + expect(face.dataset.cropperAction).to.equal('all'); + done(); + }, + }); + + expect(cropper.options.cropBoxMovable).to.be.true; + }); + + it('should not be movable', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + cropBoxMovable: false, + + ready() { + const face = cropper.cropper.querySelector('.cropper-face'); + + expect(face.dataset.cropperAction).to.not.equal('all'); + done(); + }, + }); + + expect(cropper.options.cropBoxMovable).to.be.false; + }); +}); diff --git a/library/cropperjs/test/specs/options/cropBoxResizable.spec.js b/library/cropperjs/test/specs/options/cropBoxResizable.spec.js new file mode 100644 index 000000000..2955a0407 --- /dev/null +++ b/library/cropperjs/test/specs/options/cropBoxResizable.spec.js @@ -0,0 +1,31 @@ +describe('cropBoxResizable (option)', () => { + it('should be resizable by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + Array.from(cropper.cropper.querySelectorAll('.cropper-line, .cropper-point')).forEach((handler) => { + expect(window.getComputedStyle(handler).display).to.not.equal('none'); + }); + done(); + }, + }); + + expect(cropper.options.cropBoxResizable).to.be.true; + }); + + it('should not be resizable', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + cropBoxResizable: false, + + ready() { + Array.from(cropper.cropper.querySelectorAll('.cropper-line, .cropper-point')).forEach((handler) => { + expect(window.getComputedStyle(handler).display).to.equal('none'); + }); + done(); + }, + }); + + expect(cropper.options.cropBoxResizable).to.be.false; + }); +}); diff --git a/library/cropperjs/test/specs/options/cropend.spec.js b/library/cropperjs/test/specs/options/cropend.spec.js new file mode 100644 index 000000000..c2e9f0f01 --- /dev/null +++ b/library/cropperjs/test/specs/options/cropend.spec.js @@ -0,0 +1,35 @@ +describe('cropend (option)', () => { + const POINTER_DOWN = window.PointerEvent ? 'pointerdown' : 'mousedown'; + const POINTER_MOVE = window.PointerEvent ? 'pointermove' : 'mousemove'; + const POINTER_UP = window.PointerEvent ? 'pointerup' : 'mouseup'; + + it('should be `null` be default', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + + expect(cropper.options.cropend).to.be.null; + }); + + it('should execute the `cropend` hook function', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const { dragBox } = cropper; + + dragBox.dispatchEvent(window.createEvent(POINTER_DOWN)); + dragBox.dispatchEvent(window.createEvent(POINTER_MOVE)); + dragBox.dispatchEvent(window.createEvent(POINTER_UP)); + }, + + cropend(event) { + expect(event.type).to.equal('cropend'); + expect(event.detail).to.be.an('object').that.has.all.keys(['action', 'originalEvent']); + expect(event.detail.action).to.equal('crop'); + expect(event.detail.originalEvent.type).to.equal(POINTER_UP); + done(); + }, + }); + + expect(cropper.options.cropend).to.be.a('function'); + }); +}); diff --git a/library/cropperjs/test/specs/options/cropmove.spec.js b/library/cropperjs/test/specs/options/cropmove.spec.js new file mode 100644 index 000000000..d18735923 --- /dev/null +++ b/library/cropperjs/test/specs/options/cropmove.spec.js @@ -0,0 +1,57 @@ +describe('cropmove (option)', () => { + const POINTER_DOWN = window.PointerEvent ? 'pointerdown' : 'mousedown'; + const POINTER_MOVE = window.PointerEvent ? 'pointermove' : 'mousemove'; + const POINTER_UP = window.PointerEvent ? 'pointerup' : 'mouseup'; + + it('should be `null` be default', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + + expect(cropper.options.cropmove).to.be.null; + }); + + it('should execute the `cropmove` hook function', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const { dragBox } = cropper; + + dragBox.dispatchEvent(window.createEvent(POINTER_DOWN)); + dragBox.dispatchEvent(window.createEvent(POINTER_MOVE)); + dragBox.dispatchEvent(window.createEvent(POINTER_UP)); + }, + + cropmove(event) { + expect(event.type).to.equal('cropmove'); + expect(event.detail).to.be.an('object').that.has.all.keys(['action', 'originalEvent']); + expect(event.detail.action).to.equal('crop'); + expect(event.detail.originalEvent.type).to.equal(POINTER_MOVE); + done(); + }, + }); + + expect(cropper.options.cropmove).to.be.a('function'); + }); + + it('should not execute the `crop` hook function when default prevented', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const { dragBox } = cropper; + + cropper.options.crop = () => { + expect.fail(1, 0); + }; + + dragBox.dispatchEvent(window.createEvent(POINTER_DOWN)); + dragBox.dispatchEvent(window.createEvent(POINTER_MOVE)); + dragBox.dispatchEvent(window.createEvent(POINTER_UP)); + }, + + cropmove(event) { + event.preventDefault(); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/options/cropstart.spec.js b/library/cropperjs/test/specs/options/cropstart.spec.js new file mode 100644 index 000000000..cc261afb1 --- /dev/null +++ b/library/cropperjs/test/specs/options/cropstart.spec.js @@ -0,0 +1,61 @@ +describe('cropstart (option)', () => { + const POINTER_DOWN = window.PointerEvent ? 'pointerdown' : 'mousedown'; + const POINTER_MOVE = window.PointerEvent ? 'pointermove' : 'mousemove'; + const POINTER_UP = window.PointerEvent ? 'pointerup' : 'mouseup'; + + it('should be `null` be default', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + + expect(cropper.options.cropstart).to.be.null; + }); + + it('should execute the `cropstart` hook function', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const { dragBox } = cropper; + + dragBox.dispatchEvent(window.createEvent(POINTER_DOWN)); + dragBox.dispatchEvent(window.createEvent(POINTER_MOVE)); + dragBox.dispatchEvent(window.createEvent(POINTER_UP)); + }, + + cropstart(event) { + expect(event.type).to.equal('cropstart'); + expect(event.detail).to.be.an('object').that.has.all.keys(['action', 'originalEvent']); + expect(event.detail.action).to.equal('crop'); + expect(event.detail.originalEvent.type).to.equal(POINTER_DOWN); + done(); + }, + }); + + expect(cropper.options.cropstart).to.be.a('function'); + }); + + it('should not execute the `cropmove` and `cropend` callback function when default prevented', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const { dragBox } = cropper; + + dragBox.dispatchEvent(window.createEvent(POINTER_DOWN)); + dragBox.dispatchEvent(window.createEvent(POINTER_MOVE)); + dragBox.dispatchEvent(window.createEvent(POINTER_UP)); + }, + + cropstart(event) { + event.preventDefault(); + done(); + }, + + cropmove() { + expect.fail(1, 0); + }, + + cropend() { + expect.fail(1, 0); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/options/data.spec.js b/library/cropperjs/test/specs/options/data.spec.js new file mode 100644 index 000000000..99be19adb --- /dev/null +++ b/library/cropperjs/test/specs/options/data.spec.js @@ -0,0 +1,40 @@ +describe('data (option)', () => { + it('should be null by default', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + + expect(cropper.options.data).to.be.null; + }); + + it('should match the given data', (done) => { + const image = window.createImage(); + const initialData = { + x: 16, + y: 9, + width: 160, + height: 90, + // rotate: 45, + // scaleX: -1, + // scaleY: -1, + }; + + const cropper = new Cropper(image, { + data: initialData, + + ready() { + const data = cropper.getData(true); + + expect(data.x).to.equal(initialData.x); + expect(data.y).to.equal(initialData.y); + expect(data.width).to.equal(initialData.width); + expect(data.height).to.equal(initialData.height); + // expect(data.rotate).to.equal(initialData.rotate); + // expect(data.scaleX).to.equal(initialData.scaleX); + // expect(data.scaleY).to.equal(initialData.scaleY); + done(); + }, + }); + + expect(cropper.options.data).to.deep.equal(initialData); + }); +}); diff --git a/library/cropperjs/test/specs/options/dragMode.spec.js b/library/cropperjs/test/specs/options/dragMode.spec.js new file mode 100644 index 000000000..fb41c8791 --- /dev/null +++ b/library/cropperjs/test/specs/options/dragMode.spec.js @@ -0,0 +1,41 @@ +describe('dragMode (option)', () => { + it('should be "crop" by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + expect(cropper.dragBox.dataset.cropperAction).to.equal('crop'); + done(); + }, + }); + + expect(cropper.options.dragMode).to.equal('crop'); + }); + + it('should be "move"', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + dragMode: 'move', + + ready() { + expect(cropper.dragBox.dataset.cropperAction).to.equal('move'); + done(); + }, + }); + + expect(cropper.options.dragMode).to.equal('move'); + }); + + it('should be "none"', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + dragMode: 'none', + + ready() { + expect(cropper.dragBox.dataset.cropperAction).to.equal('none'); + done(); + }, + }); + + expect(cropper.options.dragMode).to.equal('none'); + }); +}); diff --git a/library/cropperjs/test/specs/options/guides.spec.js b/library/cropperjs/test/specs/options/guides.spec.js new file mode 100644 index 000000000..0ee8f521d --- /dev/null +++ b/library/cropperjs/test/specs/options/guides.spec.js @@ -0,0 +1,31 @@ +describe('guides (option)', () => { + it('should show the guides by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + Array.from(cropper.cropper.querySelectorAll('.cropper-dashed')).forEach((dashed) => { + expect(window.getComputedStyle(dashed).display).to.not.equal('none'); + }); + done(); + }, + }); + + expect(cropper.options.guides).to.be.true; + }); + + it('should hide the guides', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + guides: false, + + ready() { + Array.from(cropper.cropper.querySelectorAll('.cropper-dashed')).forEach((dashed) => { + expect(window.getComputedStyle(dashed).display).to.equal('none'); + }); + done(); + }, + }); + + expect(cropper.options.guides).to.be.false; + }); +}); diff --git a/library/cropperjs/test/specs/options/highlight.spec.js b/library/cropperjs/test/specs/options/highlight.spec.js new file mode 100644 index 000000000..16a63c205 --- /dev/null +++ b/library/cropperjs/test/specs/options/highlight.spec.js @@ -0,0 +1,31 @@ +describe('highlight (option)', () => { + it('should show the highlight mask by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const face = cropper.cropper.querySelector('.cropper-face'); + + expect(window.getComputedStyle(face).opacity).to.not.equal('0'); + done(); + }, + }); + + expect(cropper.options.highlight).to.be.true; + }); + + it('should not show the highlight mask', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + highlight: false, + + ready() { + const face = cropper.cropper.querySelector('.cropper-face'); + + expect(window.getComputedStyle(face).opacity).to.equal('0'); + done(); + }, + }); + + expect(cropper.options.highlight).to.be.false; + }); +}); diff --git a/library/cropperjs/test/specs/options/initialAspectRatio.spec.js b/library/cropperjs/test/specs/options/initialAspectRatio.spec.js new file mode 100644 index 000000000..fc869f1e1 --- /dev/null +++ b/library/cropperjs/test/specs/options/initialAspectRatio.spec.js @@ -0,0 +1,40 @@ +describe('initialAspectRatio (option)', () => { + it('should be `NaN` by default', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + + expect(cropper.options.initialAspectRatio).to.be.NaN; + }); + + it('should match the given aspect ratio', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + initialAspectRatio: 1, + + ready() { + const cropBoxData = cropper.getCropBoxData(); + + expect(cropBoxData.width).to.equal(cropBoxData.height); + done(); + }, + }); + + expect(cropper.options.initialAspectRatio).to.equal(1); + }); + + it('should allow to change the aspect ratio', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + initialAspectRatio: 2, + + ready() { + let cropBoxData = cropper.getCropBoxData(); + + cropBoxData.width = cropBoxData.height; + cropBoxData = cropper.setCropBoxData(cropBoxData).getCropBoxData(); + expect(cropBoxData.width).to.equal(cropBoxData.height); + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/options/minCanvasHeight.spec.js b/library/cropperjs/test/specs/options/minCanvasHeight.spec.js new file mode 100644 index 000000000..028d22e9f --- /dev/null +++ b/library/cropperjs/test/specs/options/minCanvasHeight.spec.js @@ -0,0 +1,27 @@ +describe('minCanvasHeight (option)', () => { + it('should be `0` by default', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + + expect(cropper.options.minCanvasHeight).to.equal(0); + }); + + it('should match the given minimum size', (done) => { + const image = window.createImage(); + const minCanvasHeight = 270; + const cropper = new Cropper(image, { + minCanvasHeight, + + ready() { + const canvasData = cropper.setCanvasData({ + height: 180, + }).getCanvasData(); + + expect(canvasData.height).to.equal(minCanvasHeight); + done(); + }, + }); + + expect(cropper.options.minCanvasHeight).to.equal(minCanvasHeight); + }); +}); diff --git a/library/cropperjs/test/specs/options/minCanvasWidth.spec.js b/library/cropperjs/test/specs/options/minCanvasWidth.spec.js new file mode 100644 index 000000000..0c58f2a80 --- /dev/null +++ b/library/cropperjs/test/specs/options/minCanvasWidth.spec.js @@ -0,0 +1,27 @@ +describe('minCanvasWidth (option)', () => { + it('should be `0` by default', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + + expect(cropper.options.minCanvasWidth).to.equal(0); + }); + + it('should match the given minimum size', (done) => { + const image = window.createImage(); + const minCanvasWidth = 480; + const cropper = new Cropper(image, { + minCanvasWidth, + + ready() { + const canvasData = cropper.setCanvasData({ + width: 320, + }).getCanvasData(); + + expect(canvasData.width).to.equal(minCanvasWidth); + done(); + }, + }); + + expect(cropper.options.minCanvasWidth).to.equal(minCanvasWidth); + }); +}); diff --git a/library/cropperjs/test/specs/options/minContainerHeight.spec.js b/library/cropperjs/test/specs/options/minContainerHeight.spec.js new file mode 100644 index 000000000..9a71f59d3 --- /dev/null +++ b/library/cropperjs/test/specs/options/minContainerHeight.spec.js @@ -0,0 +1,26 @@ +describe('minContainerHeight (option)', () => { + it('should be `100` by default', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + + expect(cropper.options.minContainerHeight).to.equal(100); + }); + + it('should match the given minimum size', (done) => { + const image = window.createImage(); + + image.parentElement.style.height = '90px'; + + const minContainerHeight = 180; + const cropper = new Cropper(image, { + minContainerHeight, + + ready() { + expect(cropper.getContainerData().height).to.equal(minContainerHeight); + done(); + }, + }); + + expect(cropper.options.minContainerHeight).to.equal(minContainerHeight); + }); +}); diff --git a/library/cropperjs/test/specs/options/minContainerWidth.spec.js b/library/cropperjs/test/specs/options/minContainerWidth.spec.js new file mode 100644 index 000000000..aabbb5e97 --- /dev/null +++ b/library/cropperjs/test/specs/options/minContainerWidth.spec.js @@ -0,0 +1,26 @@ +describe('minContainerWidth (option)', () => { + it('should be `200` by default', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + + expect(cropper.options.minContainerWidth).to.equal(200); + }); + + it('should match the given minimum size', (done) => { + const image = window.createImage(); + + image.parentElement.style.width = '160px'; + + const minContainerWidth = 320; + const cropper = new Cropper(image, { + minContainerWidth, + + ready() { + expect(cropper.getContainerData().width).to.equal(minContainerWidth); + done(); + }, + }); + + expect(cropper.options.minContainerWidth).to.equal(minContainerWidth); + }); +}); diff --git a/library/cropperjs/test/specs/options/minCropBoxHeight.spec.js b/library/cropperjs/test/specs/options/minCropBoxHeight.spec.js new file mode 100644 index 000000000..a071c6e83 --- /dev/null +++ b/library/cropperjs/test/specs/options/minCropBoxHeight.spec.js @@ -0,0 +1,27 @@ +describe('minCropBoxHeight (option)', () => { + it('should be `0` by default', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + + expect(cropper.options.minCropBoxHeight).to.equal(0); + }); + + it('should match the given minimum size', (done) => { + const image = window.createImage(); + const minCropBoxHeight = 150; + const cropper = new Cropper(image, { + minCropBoxHeight, + + ready() { + const cropBoxData = cropper.setCropBoxData({ + height: 100, + }).getCropBoxData(); + + expect(cropBoxData.height).to.equal(minCropBoxHeight); + done(); + }, + }); + + expect(cropper.options.minCropBoxHeight).to.equal(minCropBoxHeight); + }); +}); diff --git a/library/cropperjs/test/specs/options/minCropBoxWidth.spec.js b/library/cropperjs/test/specs/options/minCropBoxWidth.spec.js new file mode 100644 index 000000000..5a2f44faa --- /dev/null +++ b/library/cropperjs/test/specs/options/minCropBoxWidth.spec.js @@ -0,0 +1,27 @@ +describe('minCropBoxWidth (option)', () => { + it('should be `0` by default', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + + expect(cropper.options.minCropBoxWidth).to.equal(0); + }); + + it('should match the given minimum size', (done) => { + const image = window.createImage(); + const minCropBoxWidth = 300; + const cropper = new Cropper(image, { + minCropBoxWidth, + + ready() { + const cropBoxData = cropper.setCropBoxData({ + width: 200, + }).getCropBoxData(); + + expect(cropBoxData.width).to.equal(minCropBoxWidth); + done(); + }, + }); + + expect(cropper.options.minCropBoxWidth).to.equal(minCropBoxWidth); + }); +}); diff --git a/library/cropperjs/test/specs/options/modal.spec.js b/library/cropperjs/test/specs/options/modal.spec.js new file mode 100644 index 000000000..e82fbed82 --- /dev/null +++ b/library/cropperjs/test/specs/options/modal.spec.js @@ -0,0 +1,27 @@ +describe('modal (option)', () => { + it('should show the modal by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + expect(cropper.dragBox.className).to.include('cropper-modal'); + done(); + }, + }); + + expect(cropper.options.modal).to.be.true; + }); + + it('should not show the modal', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + modal: false, + + ready() { + expect(cropper.dragBox.className).to.not.include('cropper-modal'); + done(); + }, + }); + + expect(cropper.options.modal).to.be.false; + }); +}); diff --git a/library/cropperjs/test/specs/options/movable.spec.js b/library/cropperjs/test/specs/options/movable.spec.js new file mode 100644 index 000000000..2c7a06705 --- /dev/null +++ b/library/cropperjs/test/specs/options/movable.spec.js @@ -0,0 +1,35 @@ +describe('movable (option)', () => { + it('should be movable by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + const changedCanvasData = cropper.move(10, 10).getCanvasData(); + + expect(changedCanvasData.left).to.equal(canvasData.left + 10); + expect(changedCanvasData.top).to.equal(canvasData.top + 10); + done(); + }, + }); + + expect(cropper.options.movable).to.be.true; + }); + + it('should not be movable', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + movable: false, + + ready() { + const canvasData = cropper.getCanvasData(); + const changedCanvasData = cropper.move(10, 10).getCanvasData(); + + expect(changedCanvasData.left).to.equal(canvasData.left); + expect(changedCanvasData.top).to.equal(canvasData.top); + done(); + }, + }); + + expect(cropper.options.movable).to.be.false; + }); +}); diff --git a/library/cropperjs/test/specs/options/preview.spec.js b/library/cropperjs/test/specs/options/preview.spec.js new file mode 100644 index 000000000..2d2bc34d4 --- /dev/null +++ b/library/cropperjs/test/specs/options/preview.spec.js @@ -0,0 +1,105 @@ +describe('preview (option)', () => { + it('should be an empty string be default', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + + expect(cropper.options.preview).to.be.a('string').that.is.empty; + }); + + it('should support element', (done) => { + const image = window.createImage(); + const preview = document.createElement('div'); + + image.ownerDocument.body.appendChild(preview); + + const cropper = new Cropper(image, { + preview, + + ready() { + expect(preview.firstElementChild).to.not.be.null; + expect(preview.firstElementChild.src).to.equal(image.src); + done(); + }, + }); + + expect(cropper.options.preview).to.equal(preview); + }); + + it('should support array of elements', (done) => { + const image = window.createImage(); + const previews = document.createElement('ul'); + const preview1 = document.createElement('li'); + const preview2 = document.createElement('li'); + const preview = [preview1, preview2]; + + previews.appendChild(preview1); + previews.appendChild(preview2); + image.ownerDocument.body.appendChild(previews); + + const cropper = new Cropper(image, { + preview, + + ready() { + expect(preview1.firstElementChild).to.not.be.null; + expect(preview2.firstElementChild).to.not.be.null; + expect(preview1.firstElementChild.src).to.equal(image.src); + expect(preview2.firstElementChild.src).to.equal(image.src); + done(); + }, + }); + + expect(cropper.options.preview).to.equal(preview); + }); + + it('should support `NodeList` object', (done) => { + const image = window.createImage(); + const previews = document.createElement('ul'); + const preview1 = document.createElement('li'); + const preview2 = document.createElement('li'); + + previews.appendChild(preview1); + previews.appendChild(preview2); + image.ownerDocument.body.appendChild(previews); + + const cropper = new Cropper(image, { + preview: previews.children, + + ready() { + expect(preview1.firstElementChild).to.not.be.null; + expect(preview2.firstElementChild).to.not.be.null; + expect(preview1.firstElementChild.src).to.equal(image.src); + expect(preview2.firstElementChild.src).to.equal(image.src); + done(); + }, + }); + + expect(cropper.options.preview).to.equal(previews.children); + }); + + it('should support selector', (done) => { + const image = window.createImage(); + const previews = document.createElement('ul'); + const preview1 = document.createElement('li'); + const preview2 = document.createElement('li'); + + preview1.className = 'preview'; + preview2.className = 'preview'; + previews.appendChild(preview1); + previews.appendChild(preview2); + image.ownerDocument.body.appendChild(previews); + + const cropper = new Cropper(image, { + preview: '.preview', + + ready() { + expect(preview1.firstElementChild).to.not.be.null; + expect(preview2.firstElementChild).to.not.be.null; + expect(preview1.firstElementChild.src).to.equal(image.src); + expect(preview2.firstElementChild.src).to.equal(image.src); + done(); + }, + }); + + expect(cropper.options.preview).to.equal('.preview'); + }); +}); diff --git a/library/cropperjs/test/specs/options/ready.spec.js b/library/cropperjs/test/specs/options/ready.spec.js new file mode 100644 index 000000000..0e0f2338a --- /dev/null +++ b/library/cropperjs/test/specs/options/ready.spec.js @@ -0,0 +1,34 @@ +describe('ready (option)', () => { + it('should be `null` be default', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + + expect(cropper.options.ready).to.be.null; + }); + + it('should execute the `ready` hook function', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready(event) { + expect(event.type).to.equal('ready'); + done(); + }, + }); + + expect(cropper.options.ready).to.be.a('function'); + }); + + it('should execute the `crop` hook function even though default prevented', (done) => { + const image = window.createImage(); + + new Cropper(image, { + ready(event) { + event.preventDefault(); + }, + + crop() { + done(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/options/responsive.spec.js b/library/cropperjs/test/specs/options/responsive.spec.js new file mode 100644 index 000000000..8e393f0ff --- /dev/null +++ b/library/cropperjs/test/specs/options/responsive.spec.js @@ -0,0 +1,61 @@ +describe('responsive (option)', () => { + it('should be responsive be default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const containerData = cropper.getContainerData(); + let newContainerWidth = containerData.width - 10; + let newContainerHeight = containerData.height - 10; + + image.parentElement.style.width = `${newContainerWidth}px`; + image.parentElement.style.height = `${newContainerHeight}px`; + window.dispatchEvent(window.createEvent('resize')); + + let newContainerData = cropper.getContainerData(); + + expect(newContainerData.width).to.equal(newContainerWidth); + expect(newContainerData.height).to.equal(newContainerHeight); + + newContainerWidth = containerData.width + 10; + newContainerHeight = containerData.height + 10; + + image.parentElement.style.width = `${newContainerWidth}px`; + image.parentElement.style.height = `${newContainerHeight}px`; + window.dispatchEvent(window.createEvent('resize')); + + newContainerData = cropper.getContainerData(); + + expect(newContainerData.width).to.equal(newContainerWidth); + expect(newContainerData.height).to.equal(newContainerHeight); + done(); + }, + }); + + expect(cropper.options.responsive).to.be.true; + }); + + it('should not be responsive', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + responsive: false, + + ready() { + const containerData = cropper.getContainerData(); + const newContainerWidth = containerData.width - 10; + const newContainerHeight = containerData.height - 10; + + image.parentElement.style.width = `${newContainerWidth}px`; + image.parentElement.style.height = `${newContainerHeight}px`; + window.dispatchEvent(window.createEvent('resize')); + + const newContainerData = cropper.getContainerData(); + + expect(newContainerData.width).to.equal(containerData.width); + expect(newContainerData.height).to.equal(containerData.height); + done(); + }, + }); + + expect(cropper.options.responsive).to.be.false; + }); +}); diff --git a/library/cropperjs/test/specs/options/restore.spec.js b/library/cropperjs/test/specs/options/restore.spec.js new file mode 100644 index 000000000..3a011edc8 --- /dev/null +++ b/library/cropperjs/test/specs/options/restore.spec.js @@ -0,0 +1,38 @@ +describe('restore (option)', () => { + it('should restore the cropped area after resize the window be default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const data = cropper.zoomTo(1).getData(true); + const containerData = cropper.getContainerData(); + + image.parentElement.style.width = `${containerData.width - 10}px`; + image.parentElement.style.height = `${containerData.height - 10}px`; + window.dispatchEvent(window.createEvent('resize')); + expect(cropper.getData(true)).to.deep.equal(data); + done(); + }, + }); + + expect(cropper.options.restore).to.be.true; + }); + + it('should not be restore', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + restore: false, + + ready() { + const data = cropper.zoomTo(1).getData(true); + const containerData = cropper.getContainerData(); + + image.parentElement.style.width = `${containerData.width / 2}px`; + window.dispatchEvent(window.createEvent('resize')); + expect(cropper.getData(true)).to.not.deep.equal(data); + done(); + }, + }); + + expect(cropper.options.restore).to.be.false; + }); +}); diff --git a/library/cropperjs/test/specs/options/rotatable.spec.js b/library/cropperjs/test/specs/options/rotatable.spec.js new file mode 100644 index 000000000..01a9ad09a --- /dev/null +++ b/library/cropperjs/test/specs/options/rotatable.spec.js @@ -0,0 +1,28 @@ +describe('rotatable (option)', () => { + it('should be rotatable by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + + ready() { + expect(cropper.rotate(90).getImageData().rotate).to.equal(90); + done(); + }, + }); + + expect(cropper.options.rotatable).to.be.true; + }); + + it('should not be rotatable', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + rotatable: false, + + ready() { + expect(cropper.rotate(90).getImageData().rotate).to.be.undefined; + done(); + }, + }); + + expect(cropper.options.rotatable).to.be.false; + }); +}); diff --git a/library/cropperjs/test/specs/options/scalable.spec.js b/library/cropperjs/test/specs/options/scalable.spec.js new file mode 100644 index 000000000..3b6f1df4f --- /dev/null +++ b/library/cropperjs/test/specs/options/scalable.spec.js @@ -0,0 +1,33 @@ +describe('scalable (option)', () => { + it('should be scalable by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const imageData = cropper.scale(-1, -1).getImageData(); + + expect(imageData.scaleX).to.equal(-1); + expect(imageData.scaleY).to.equal(-1); + done(); + }, + }); + + expect(cropper.options.scalable).to.be.true; + }); + + it('should not be scalable', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + scalable: false, + + ready() { + const imageData = cropper.scale(-1, -1).getImageData(); + + expect(imageData.scaleX).to.be.undefined; + expect(imageData.scaleY).to.be.undefined; + done(); + }, + }); + + expect(cropper.options.scalable).to.be.false; + }); +}); diff --git a/library/cropperjs/test/specs/options/toggleDragModeOnDblclick.spec.js b/library/cropperjs/test/specs/options/toggleDragModeOnDblclick.spec.js new file mode 100644 index 000000000..b67617f1d --- /dev/null +++ b/library/cropperjs/test/specs/options/toggleDragModeOnDblclick.spec.js @@ -0,0 +1,40 @@ +describe('toggleDragModeOnDblclick (option)', () => { + it('should toggle drag mode on double click', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + + ready() { + const { dragBox } = cropper; + + expect(dragBox.className).include('cropper-crop'); + expect(dragBox.dataset.cropperAction).to.equal('crop'); + dragBox.dispatchEvent(window.createEvent('dblclick')); + expect(dragBox.className).include('cropper-move'); + expect(dragBox.dataset.cropperAction).to.equal('move'); + done(); + }, + }); + + expect(cropper.options.toggleDragModeOnDblclick).to.be.true; + }); + + it('should not toggle drag mode on double click', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + toggleDragModeOnDblclick: false, + + ready() { + const { dragBox } = cropper; + + expect(dragBox.className).include('cropper-crop'); + expect(dragBox.dataset.cropperAction).to.equal('crop'); + dragBox.dispatchEvent(window.createEvent('dblclick')); + expect(dragBox.className).include('cropper-crop'); + expect(dragBox.dataset.cropperAction).to.equal('crop'); + done(); + }, + }); + + expect(cropper.options.toggleDragModeOnDblclick).to.be.false; + }); +}); diff --git a/library/cropperjs/test/specs/options/viewMode.spec.js b/library/cropperjs/test/specs/options/viewMode.spec.js new file mode 100644 index 000000000..7dde93d83 --- /dev/null +++ b/library/cropperjs/test/specs/options/viewMode.spec.js @@ -0,0 +1,89 @@ +describe('viewMode (option)', () => { + it('should not have any restrictions by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = { + left: 100, + top: 100, + width: 160, + height: 90, + }; + const changedCanvasData = cropper.setCanvasData(canvasData).getCanvasData(); + + expect(changedCanvasData.left).to.equal(canvasData.left); + expect(changedCanvasData.top).to.equal(canvasData.top); + expect(changedCanvasData.width).to.equal(canvasData.width); + expect(changedCanvasData.height).to.equal(canvasData.height); + done(); + }, + }); + + expect(cropper.options.viewMode).to.equal(0); + }); + + it('should restrict the crop box to not exceed the size of the canvas', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + viewMode: 1, + + ready() { + let canvasData = cropper.zoom(-0.5).getCanvasData(); + let cropBoxData = cropper.getCropBoxData(); + + expect(canvasData.width).to.be.least(cropBoxData.width); + expect(canvasData.height).to.be.least(cropBoxData.height); + + canvasData = cropper.clear().moveTo(-160, -90).getCanvasData(); + cropBoxData = cropper.crop().setCropBoxData({ + width: canvasData.naturalWidth, + height: canvasData.naturalHeight, + }).getCropBoxData(); + + expect(canvasData.width).to.be.above(cropBoxData.width); + expect(canvasData.height).to.be.above(cropBoxData.height); + done(); + }, + }); + + expect(cropper.options.viewMode).to.equal(1); + }); + + it('should restrict the minimum canvas size to fit within the container.', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + viewMode: 2, + + ready() { + const canvasData = cropper.zoom(-0.5).getCanvasData(); + const containerData = cropper.getContainerData(); + + expect(canvasData.width >= containerData.width + || canvasData.height >= containerData.height).to.be.true; + done(); + }, + }); + + expect(cropper.options.viewMode).to.equal(2); + }); + + it('should restrict the minimum canvas size to full fit the container.', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + viewMode: 3, + + ready() { + const canvasData = cropper.zoom(-0.5).getCanvasData(); + const containerData = cropper.getContainerData(); + + expect(canvasData.left).to.be.most(0); + expect(canvasData.top).to.be.most(0); + expect(canvasData.width).to.be.least(containerData.width); + expect(canvasData.height).to.be.least(containerData.height); + done(); + }, + }); + + expect(cropper.options.viewMode).to.equal(3); + }); +}); diff --git a/library/cropperjs/test/specs/options/wheelZoomRatio.spec.js b/library/cropperjs/test/specs/options/wheelZoomRatio.spec.js new file mode 100644 index 000000000..7d128358d --- /dev/null +++ b/library/cropperjs/test/specs/options/wheelZoomRatio.spec.js @@ -0,0 +1,38 @@ +describe('wheelZoomRatio (option)', () => { + it('should be `0.1` by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + const wheelEvent = window.createEvent('wheel'); + + wheelEvent.deltaY = -1; + cropper.cropper.dispatchEvent(wheelEvent); + expect(canvasData.width * 1.1).to.equal(cropper.getCanvasData().width); + done(); + }, + }); + + expect(cropper.options.wheelZoomRatio).to.equal(0.1); + }); + + it('should match the given zoom ratio', (done) => { + const image = window.createImage(); + const wheelZoomRatio = 0.2; + const cropper = new Cropper(image, { + wheelZoomRatio, + + ready() { + const canvasData = cropper.getCanvasData(); + const wheelEvent = window.createEvent('wheel'); + + wheelEvent.deltaY = -1; + cropper.cropper.dispatchEvent(wheelEvent); + expect(canvasData.width * (1 + wheelZoomRatio)).to.equal(cropper.getCanvasData().width); + done(); + }, + }); + + expect(cropper.options.wheelZoomRatio).to.equal(wheelZoomRatio); + }); +}); diff --git a/library/cropperjs/test/specs/options/zoom.spec.js b/library/cropperjs/test/specs/options/zoom.spec.js new file mode 100644 index 000000000..3d11f3a2f --- /dev/null +++ b/library/cropperjs/test/specs/options/zoom.spec.js @@ -0,0 +1,46 @@ +describe('zoom (option)', () => { + it('should be `null` be default', () => { + const image = window.createImage(); + const cropper = new Cropper(image); + + expect(cropper.options.zoom).to.be.null; + }); + + it('should execute the `zoom` hook function', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + cropper.zoom(0.1); + }, + + zoom(event) { + expect(event.type).to.equal('zoom'); + expect(event.detail).to.be.an('object').that.has.all.keys(['ratio', 'oldRatio', 'originalEvent']); + expect(event.detail.ratio).to.be.a('number'); + expect(event.detail.oldRatio).to.be.a('number'); + expect(event.detail.ratio).to.be.above(0); + expect(event.detail.oldRatio).to.be.above(0); + expect(event.detail.ratio).to.be.above(event.detail.oldRatio); + done(); + }, + }); + + expect(cropper.options.zoom).to.be.a('function'); + }); + + it('should not change the canvas sizes when default prevented', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + + expect(cropper.zoom(0.1).getCanvasData()).to.deep.equal(canvasData); + done(); + }, + + zoom(event) { + event.preventDefault(); + }, + }); + }); +}); diff --git a/library/cropperjs/test/specs/options/zoomOnTouch.spec.js b/library/cropperjs/test/specs/options/zoomOnTouch.spec.js new file mode 100644 index 000000000..feb56b079 --- /dev/null +++ b/library/cropperjs/test/specs/options/zoomOnTouch.spec.js @@ -0,0 +1,176 @@ +describe('zoomOnTouch (option)', () => { + it('should zoom on touch by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + if (window.PointerEvent) { + const pointerDownEvent1 = window.createEvent('pointerdown'); + const pointerDownEvent2 = window.createEvent('pointerdown'); + const pointerMoveEvent1 = window.createEvent('pointermove'); + const pointerMoveEvent2 = window.createEvent('pointermove'); + + pointerDownEvent1.pointerId = 1; + pointerDownEvent1.pageX = 100; + pointerDownEvent1.pageY = 100; + pointerDownEvent2.pointerId = 2; + pointerDownEvent2.pageX = 200; + pointerDownEvent2.pageY = 200; + pointerMoveEvent1.pointerId = 1; + pointerMoveEvent1.pageX = 125; + pointerMoveEvent1.pageY = 125; + pointerMoveEvent2.pointerId = 2; + pointerMoveEvent2.pageX = 175; + pointerMoveEvent2.pageY = 175; + cropper.cropper.dispatchEvent(pointerDownEvent1); + cropper.cropper.dispatchEvent(pointerDownEvent2); + cropper.cropper.dispatchEvent(pointerMoveEvent1); + cropper.cropper.dispatchEvent(pointerMoveEvent2); + } else { + const touchStartEvent1 = window.createEvent('touchstart'); + const touchStartEvent2 = window.createEvent('touchstart'); + const touchMoveEvent1 = window.createEvent('touchmove'); + const touchMoveEvent2 = window.createEvent('touchmove'); + + touchStartEvent1.changedTouches = { + 0: { + identifier: 1, + pageX: 100, + pageY: 100, + }, + length: 1, + }; + touchStartEvent2.changedTouches = { + 0: { + identifier: 2, + pageX: 200, + pageY: 200, + }, + length: 1, + }; + touchMoveEvent1.changedTouches = { + 0: { + identifier: 1, + pageX: 125, + pageY: 125, + }, + length: 1, + }; + touchMoveEvent2.changedTouches = { + 0: { + identifier: 2, + pageX: 175, + pageY: 175, + }, + length: 1, + }; + cropper.cropper.dispatchEvent(touchStartEvent1); + cropper.cropper.dispatchEvent(touchStartEvent2); + cropper.cropper.dispatchEvent(touchMoveEvent1); + cropper.cropper.dispatchEvent(touchMoveEvent2); + } + }, + + zoom() { + done(); + }, + }); + + expect(cropper.options.zoomOnTouch).to.be.true; + }); + + it('should not zoom on touch', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + zoomOnTouch: false, + + ready() { + if (window.PointerEvent) { + cropper.cropper.dispatchEvent(new PointerEvent('pointerdown', { + pointerId: 1, + pageX: 100, + pageY: 100, + })); + cropper.cropper.dispatchEvent(new PointerEvent('pointerdown', { + pointerId: 2, + pageX: 200, + pageY: 200, + })); + cropper.cropper.dispatchEvent(new PointerEvent('pointermove', { + pointerId: 1, + pageX: 125, + pageY: 125, + })); + cropper.cropper.dispatchEvent(new PointerEvent('pointermove', { + pointerId: 2, + pageX: 175, + pageY: 175, + })); + cropper.cropper.dispatchEvent(new PointerEvent('pointerup', { + pointerId: 1, + pageX: 125, + pageY: 125, + })); + cropper.cropper.dispatchEvent(new PointerEvent('pointerup', { + pointerId: 2, + pageX: 175, + pageY: 175, + })); + } else { + cropper.cropper.dispatchEvent(new TouchEvent('touchstart', { + changedTouches: { + 0: { + identifier: 1, + pageX: 100, + pageY: 100, + }, + 1: { + identifier: 2, + pageX: 200, + pageY: 200, + }, + length: 2, + }, + })); + cropper.cropper.dispatchEvent(new TouchEvent('touchmove', { + changedTouches: { + 0: { + identifier: 1, + pageX: 125, + pageY: 125, + }, + 1: { + identifier: 2, + pageX: 175, + pageY: 175, + }, + length: 2, + }, + })); + cropper.cropper.dispatchEvent(new TouchEvent('touchend', { + changedTouches: { + 0: { + identifier: 1, + pageX: 125, + pageY: 125, + }, + 1: { + identifier: 2, + pageX: 175, + pageY: 175, + }, + length: 2, + }, + })); + } + + done(); + }, + + zoom() { + expect.fail(1, 0); + }, + }); + + expect(cropper.options.zoomOnTouch).to.be.false; + }); +}); diff --git a/library/cropperjs/test/specs/options/zoomOnWheel.spec.js b/library/cropperjs/test/specs/options/zoomOnWheel.spec.js new file mode 100644 index 000000000..90e25e6a3 --- /dev/null +++ b/library/cropperjs/test/specs/options/zoomOnWheel.spec.js @@ -0,0 +1,34 @@ +describe('zoomOnWheel (option)', () => { + it('should zoom on wheel by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + cropper.cropper.dispatchEvent(window.createEvent('wheel')); + }, + + zoom() { + done(); + }, + }); + + expect(cropper.options.zoomOnWheel).to.be.true; + }); + + it('should not zoom on wheel', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + zoomOnWheel: false, + + ready() { + cropper.cropper.dispatchEvent(window.createEvent('wheel')); + done(); + }, + + zoom() { + expect.fail(1, 0); + }, + }); + + expect(cropper.options.zoomOnWheel).to.be.false; + }); +}); diff --git a/library/cropperjs/test/specs/options/zoomable.spec.js b/library/cropperjs/test/specs/options/zoomable.spec.js new file mode 100644 index 000000000..d0fbec5ec --- /dev/null +++ b/library/cropperjs/test/specs/options/zoomable.spec.js @@ -0,0 +1,35 @@ +describe('zoomable (option)', () => { + it('should be zoomable by default', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + ready() { + const canvasData = cropper.getCanvasData(); + const changedCanvasData = cropper.zoom(0.1).getCanvasData(); + + expect(changedCanvasData.width).to.be.above(canvasData.width); + expect(changedCanvasData.height).to.be.above(canvasData.height); + done(); + }, + }); + + expect(cropper.options.zoomable).to.be.true; + }); + + it('should not be zoomable', (done) => { + const image = window.createImage(); + const cropper = new Cropper(image, { + zoomable: false, + + ready() { + const canvasData = cropper.getCanvasData(); + const changedCanvasData = cropper.zoom(0.1).getCanvasData(); + + expect(changedCanvasData.width).to.equal(canvasData.width); + expect(changedCanvasData.height).to.equal(canvasData.height); + done(); + }, + }); + + expect(cropper.options.zoomable).to.be.false; + }); +}); |