96 lines
3.5 KiB
JavaScript
96 lines
3.5 KiB
JavaScript
|
// Copyright (C) 2020-2022 Intel Corporation
|
||
|
|
//
|
||
|
|
// SPDX-License-Identifier: MIT
|
||
|
|
|
||
|
|
/// <reference types="cypress" />
|
||
|
|
|
||
|
|
import { taskName } from '../../support/const';
|
||
|
|
|
||
|
|
context('Check if the image is rotated', () => {
|
||
|
|
const caseId = '5';
|
||
|
|
|
||
|
|
function imageRotate(direction = 'anticlockwise') {
|
||
|
|
cy.interactControlButton('rotate-canvas');
|
||
|
|
if (direction === 'clockwise') {
|
||
|
|
cy.get('.cvat-rotate-canvas-controls-right').click();
|
||
|
|
} else {
|
||
|
|
cy.get('.cvat-rotate-canvas-controls-left').click();
|
||
|
|
}
|
||
|
|
cy.get('.cvat-canvas-container').click(); // Hide popover
|
||
|
|
cy.get('.cvat-rotate-canvas-popover').should('be.hidden');
|
||
|
|
}
|
||
|
|
|
||
|
|
function scaleFitImage() {
|
||
|
|
let scaleBefore;
|
||
|
|
cy.get('#cvat_canvas_background')
|
||
|
|
.should('have.attr', 'style')
|
||
|
|
.then(($styles) => {
|
||
|
|
scaleBefore = Number($styles.match(/scale\((\d\.\d+)\)/m)[1]);
|
||
|
|
});
|
||
|
|
cy.get('.cvat-canvas-container').trigger('wheel', { deltaY: 5 });
|
||
|
|
cy.get('#cvat_canvas_background')
|
||
|
|
.should('have.attr', 'style')
|
||
|
|
.then(($styles) => {
|
||
|
|
const scaleAfter = Number($styles.match(/scale\((\d\.\d+)\)/m)[1]);
|
||
|
|
cy.expect(scaleBefore).to.be.greaterThan(scaleAfter);
|
||
|
|
cy.get('#cvat_canvas_content').dblclick();
|
||
|
|
cy.get('#cvat_canvas_background').should('have.attr', 'style').and('contain', scaleBefore);
|
||
|
|
});
|
||
|
|
cy.get('.cvat-rotate-canvas-popover-visible').should('not.exist');
|
||
|
|
}
|
||
|
|
|
||
|
|
before(() => {
|
||
|
|
cy.openTaskJob(taskName);
|
||
|
|
});
|
||
|
|
|
||
|
|
describe(`Testing case "${caseId}"`, () => {
|
||
|
|
it('Rotate image clockwise 90deg', () => {
|
||
|
|
imageRotate('clockwise');
|
||
|
|
cy.get('#cvat_canvas_background').should('have.attr', 'style').and('contain', 'rotate(90deg);');
|
||
|
|
scaleFitImage();
|
||
|
|
});
|
||
|
|
|
||
|
|
it('Rotate image clockwise 180deg', () => {
|
||
|
|
imageRotate('clockwise');
|
||
|
|
cy.get('#cvat_canvas_background').should('have.attr', 'style').and('contain', 'rotate(180deg);');
|
||
|
|
scaleFitImage();
|
||
|
|
});
|
||
|
|
|
||
|
|
it('Rotate image clockwise 270deg', () => {
|
||
|
|
imageRotate('clockwise');
|
||
|
|
cy.get('#cvat_canvas_background').should('have.attr', 'style').and('contain', 'rotate(270deg);');
|
||
|
|
scaleFitImage();
|
||
|
|
});
|
||
|
|
|
||
|
|
it('Rotate image clockwise 360deg', () => {
|
||
|
|
imageRotate('clockwise');
|
||
|
|
cy.get('#cvat_canvas_background').should('have.attr', 'style').and('contain', 'rotate(0deg);');
|
||
|
|
scaleFitImage();
|
||
|
|
});
|
||
|
|
|
||
|
|
it('Rotate image anticlockwise 90deg', () => {
|
||
|
|
imageRotate();
|
||
|
|
cy.get('#cvat_canvas_background').should('have.attr', 'style').and('contain', 'rotate(270deg);');
|
||
|
|
scaleFitImage();
|
||
|
|
});
|
||
|
|
|
||
|
|
it('Rotate image anticlockwise 180deg', () => {
|
||
|
|
imageRotate();
|
||
|
|
cy.get('#cvat_canvas_background').should('have.attr', 'style').and('contain', 'rotate(180deg);');
|
||
|
|
scaleFitImage();
|
||
|
|
});
|
||
|
|
|
||
|
|
it('Rotate image anticlockwise 270deg', () => {
|
||
|
|
imageRotate();
|
||
|
|
cy.get('#cvat_canvas_background').should('have.attr', 'style').and('contain', 'rotate(90deg);');
|
||
|
|
scaleFitImage();
|
||
|
|
});
|
||
|
|
|
||
|
|
it('Rotate image anticlockwise 360deg', () => {
|
||
|
|
imageRotate();
|
||
|
|
cy.get('#cvat_canvas_background').should('have.attr', 'style').and('contain', 'rotate(0deg);');
|
||
|
|
scaleFitImage();
|
||
|
|
});
|
||
|
|
});
|
||
|
|
});
|