PHP Classes

File: toastui/test/cropper.spec.js

Recommend this page to a friend!
  Classes of Mark de Leon  >  PHP Document Scanner using SANE or eSCL AirPrint  >  toastui/test/cropper.spec.js  >  Download  
File: toastui/test/cropper.spec.js
Role: Auxiliary data
Content type: text/plain
Description: Auxiliary data
Class: PHP Document Scanner using SANE or eSCL AirPrint
Web interface to scan printed documents
Author: By
Last change:
Date: 1 year ago
Size: 10,822 bytes
 

Contents

Class file image Download
/**
 * @author NHN Ent. FE Development Team <dl_javascript@nhn.com>
 * @fileoverview Test cases of "src/js/component/cropper.js"
 */
import snippet from 'tui-code-snippet';
import fabric from 'fabric/dist/fabric.require';
import $ from 'jquery';
import Cropper from '../src/js/component/cropper';
import Graphics from '../src/js/graphics';

describe('Cropper', () => {
    let cropper, graphics, canvas;

    beforeEach(() => {
        graphics = new Graphics($('<canvas>')[0]);
        canvas = graphics.getCanvas();
        cropper = new Cropper(graphics);
    });

    describe('start()', () => {
        it('should create a cropzone', () => {
            cropper.start();

            expect(cropper._cropzone).toBeDefined();
        });

        it('should add a cropzone to canvas', () => {
            spyOn(canvas, 'add');
            cropper.start();

            expect(canvas.add).toHaveBeenCalledWith(cropper._cropzone);
        });

        it('should no action if a croppzone has been defined', () => {
            cropper._cropzone = {};
            spyOn(canvas, 'add');
            cropper.start();

            expect(canvas.add).not.toHaveBeenCalled();
        });

        it('should set "evented" of all objects to false', () => {
            const objects = [
                new fabric.Object({evented: true}),
                new fabric.Object({evented: true}),
                new fabric.Object({evented: true})
            ];
            canvas.add(objects[0], objects[1], objects[2]);

            cropper.start();
            expect(objects[0].evented).toBe(false);
            expect(objects[1].evented).toBe(false);
            expect(objects[2].evented).toBe(false);
        });
    });

    describe('"onFabricMouseDown()"', () => {
        let fEvent;
        beforeEach(() => {
            fEvent = {
                e: {}
            };
            spyOn(canvas, 'getPointer').and.returnValue({
                x: 10,
                y: 20
            });
        });

        it('should set "selection" to false', () => {
            cropper._onFabricMouseDown(fEvent);
            expect(canvas.selection).toBe(false);
        });

        it('should set "startX, startY"', () => {
            // canvas.getPointer will return object{x: 10, y: 20}
            cropper._onFabricMouseDown(fEvent);
            expect(cropper._startX).toEqual(10);
            expect(cropper._startY).toEqual(20);
        });
    });

    describe('"onFabricMouseMove()', () => {
        beforeEach(() => {
            spyOn(canvas, 'getPointer').and.returnValue({
                x: 10,
                y: 20
            });
            spyOn(canvas, 'getWidth').and.returnValue(100);
            spyOn(canvas, 'getHeight').and.returnValue(200);
        });

        it('should re-render(remove->set->add) cropzone ' +
            'if the mouse moving is over the threshold(=10)', () => {
            cropper._startX = 0;
            cropper._startY = 0;

            cropper.start();
            spyOn(cropper._cropzone, 'remove');
            spyOn(cropper._cropzone, 'set');
            spyOn(canvas, 'add');
            cropper._onFabricMouseMove({e: {}});

            expect(cropper._cropzone.remove).toHaveBeenCalled();
            expect(cropper._cropzone.set).toHaveBeenCalled();
            expect(canvas.add).toHaveBeenCalled();
        });

        it('should not re-render cropzone ' +
            'if the mouse moving is under the threshold', () => {
            cropper._startX = 14;
            cropper._startY = 18;

            cropper.start();
            spyOn(cropper._cropzone, 'remove');
            spyOn(cropper._cropzone, 'set');
            spyOn(canvas, 'add');
            cropper._onFabricMouseMove({e: {}});

            expect(cropper._cropzone.remove).not.toHaveBeenCalled();
            expect(cropper._cropzone.set).not.toHaveBeenCalled();
            expect(canvas.add).not.toHaveBeenCalled();
        });
    });

    describe('_calcRectDimensionFromPoint()', () => {
        beforeEach(() => {
            cropper._startX = 10;
            cropper._startY = 20;
            snippet.extend(canvas, {
                getWidth() {
                    return 100;
                },
                getHeight() {
                    return 200;
                }
            });
        });

        it('should return cropzone-left&top (min: 0, max: startX,Y)', () => {
            const x = 20,
                y = -1,
                expected = {
                    left: 10,
                    top: 0,
                    width: jasmine.any(Number),
                    height: jasmine.any(Number)
                },
                actual = cropper._calcRectDimensionFromPoint(x, y);

            expect(actual).toEqual(expected);
        });

        it('should calculate and return cropzone-width&height', () => {
            let x, y, expected, actual;

            x = 30;
            y = 40;
            expected = {
                left: 10,
                top: 20,
                width: 20,
                height: 20
            };
            actual = cropper._calcRectDimensionFromPoint(x, y);
            expect(actual).toEqual(expected);

            x = 300;
            y = 400;
            expected = {
                left: 10,
                top: 20,
                width: 90,
                height: 180
            };
            actual = cropper._calcRectDimensionFromPoint(x, y);
            expect(actual).toEqual(expected);
        });

        it('should create cropzone that has fixed ratio during shift key is pressed.', () => {
            const x = 100;
            const y = 200;
            const expected = {
                left: 10,
                top: 20,
                width: 180,
                height: 180
            };

            cropper._withShiftKey = true;

            const actual = cropper._calcRectDimensionFromPoint(x, y);

            expect(actual).toEqual(expected);
        });

        it('should create cropzone that inverted current mouse position during shift key is pressed.', () => {
            const x = -10;
            const y = -20;
            const expected = {
                left: -10,
                top: 0,
                width: 20,
                height: 20
            };

            cropper._withShiftKey = true;

            const actual = cropper._calcRectDimensionFromPoint(x, y);

            expect(actual).toEqual(expected);
        });
    });

    it('"onFabricMouseUp()" should activate cropzone', () => {
        canvas.setActiveObject = jasmine.createSpy();
        cropper.start();
        cropper._onFabricMouseUp();

        expect(canvas.setActiveObject).toHaveBeenCalledWith(cropper._cropzone);
    });

    describe('"crop()"', () => {
        it('should return cropzone rect', () => {
            cropper.start();
            spyOn(cropper._cropzone, 'isValid').and.returnValue(true);

            expect(cropper.getCropzoneRect()).toBeTruthy();
            cropper.end();
        });

        it('should return cropzone data if the cropzone is valid', () => {
            cropper.start();
            spyOn(cropper._cropzone, 'isValid').and.returnValue(true);

            expect(cropper.getCroppedImageData(cropper.getCropzoneRect())).toEqual({
                imageName: jasmine.any(String),
                url: jasmine.any(String)
            });
            cropper.end();
        });
    });

    describe('"presets - setCropzoneRect()"', () => {
        beforeEach(() => {
            cropper.start();
        });

        afterEach(() => {
            cropper.end();
        });

        it('should return cropzone rect as a square', () => {
            spyOn(cropper._cropzone, 'isValid').and.returnValue(true);
            cropper.setCropzoneRect(1 / 1);

            expect(cropper.getCropzoneRect().width).toBe(cropper.getCropzoneRect().height);
        });

        it('should return cropzone rect as a 3:2 aspect box', () => {
            spyOn(cropper._cropzone, 'isValid').and.returnValue(true);
            cropper.setCropzoneRect(3 / 2);

            expect((cropper.getCropzoneRect().width / cropper.getCropzoneRect().height).toFixed(1))
                .toBe((3 / 2).toFixed(1));
        });

        it('should return cropzone rect as a 4:3 aspect box', () => {
            spyOn(cropper._cropzone, 'isValid').and.returnValue(true);
            cropper.setCropzoneRect(4 / 3);

            expect((cropper.getCropzoneRect().width / cropper.getCropzoneRect().height).toFixed(1))
                .toBe((4 / 3).toFixed(1));
        });

        it('should return cropzone rect as a 5:4 aspect box', () => {
            spyOn(cropper._cropzone, 'isValid').and.returnValue(true);
            cropper.setCropzoneRect(5 / 4);

            expect((cropper.getCropzoneRect().width / cropper.getCropzoneRect().height).toFixed(1))
                .toBe((5 / 4).toFixed(1));
        });

        it('should return cropzone rect as a 7:5 aspect box', () => {
            spyOn(cropper._cropzone, 'isValid').and.returnValue(true);
            cropper.setCropzoneRect(7 / 5);

            expect((cropper.getCropzoneRect().width / cropper.getCropzoneRect().height).toFixed(1))
                .toBe((7 / 5).toFixed(1));
        });

        it('should return cropzone rect as a 16:9 aspect box', () => {
            spyOn(cropper._cropzone, 'isValid').and.returnValue(true);
            cropper.setCropzoneRect(16 / 9);

            expect((cropper.getCropzoneRect().width / cropper.getCropzoneRect().height).toFixed(1))
                .toBe((16 / 9).toFixed(1));
        });

        it('should remove cropzone of cropper when falsy is passed', () => {
            cropper.setCropzoneRect();
            expect(cropper.getCropzoneRect()).toBeFalsy();

            cropper.setCropzoneRect(0);
            expect(cropper.getCropzoneRect()).toBeFalsy();

            cropper.setCropzoneRect(null);
            expect(cropper.getCropzoneRect()).toBeFalsy();
        });
    });

    describe('"end()"', () => {
        it('should set cropzone of cropper to null', () => {
            cropper.start();
            cropper.end();

            expect(cropper._cropzone).toBe(null);
        });

        it('should set "evented" of all obejcts to true', () => {
            const objects = [
                new fabric.Object({evented: false}),
                new fabric.Object({evented: false}),
                new fabric.Object({evented: false})
            ];
            canvas.add(objects[0], objects[1], objects[2]);

            cropper.start();
            cropper.end();
            expect(objects[0].evented).toBe(true);
            expect(objects[1].evented).toBe(true);
            expect(objects[2].evented).toBe(true);
        });
    });
});
For more information send a message to info at phpclasses dot org.