Skip to content

Commit

Permalink
Added cypress test for 3D cuboids interpolation (#5699)
Browse files Browse the repository at this point in the history
<!-- Raise an issue to propose your change
(https://github.com/opencv/cvat/issues).
It helps to avoid duplication of efforts from multiple independent
contributors.
Discuss your ideas with maintainers to be sure that changes will be
approved and merged.
Read the [Contribution
guide](https://opencv.github.io/cvat/docs/contributing/). -->

<!-- Provide a general summary of your changes in the Title above -->

### Motivation and context
<!-- Why is this change required? What problem does it solve? If it
fixes an open
issue, please link to the issue here. Describe your changes in detail,
add
screenshots. -->

### How has this been tested?
<!-- Please describe in detail how you tested your changes.
Include details of your testing environment, and the tests you ran to
see how your change affects other areas of the code, etc. -->

### Checklist
<!-- Go over all the following points, and put an `x` in all the boxes
that apply.
If an item isn't applicable for some reason, then ~~explicitly
strikethrough~~ the whole
line. If you don't do that, GitHub will show incorrect progress for the
pull request.
If you're unsure about any of these, don't hesitate to ask. We're here
to help! -->
- [x] I submit my changes into the `develop` branch
- [ ] I have added a description of my changes into the
[CHANGELOG](https://github.com/opencv/cvat/blob/develop/CHANGELOG.md)
file
- [ ] I have updated the documentation accordingly
- [ ] I have added tests to cover my changes
- [ ] I have linked related issues (see [GitHub docs](

https://help.github.com/en/github/managing-your-work-on-github/linking-a-pull-request-to-an-issue#linking-a-pull-request-to-an-issue-using-a-keyword))
- [ ] I have increased versions of npm packages if it is necessary

([cvat-canvas](https://github.com/opencv/cvat/tree/develop/cvat-canvas#versioning),

[cvat-core](https://github.com/opencv/cvat/tree/develop/cvat-core#versioning),

[cvat-data](https://github.com/opencv/cvat/tree/develop/cvat-data#versioning)
and

[cvat-ui](https://github.com/opencv/cvat/tree/develop/cvat-ui#versioning))

### License

- [x] I submit _my code changes_ under the same [MIT License](
https://github.com/opencv/cvat/blob/develop/LICENSE) that covers the
project.
  Feel free to contact the maintainers if that's a concern.
  • Loading branch information
bsekachev authored Feb 15, 2023
1 parent f38e87a commit 771c13c
Show file tree
Hide file tree
Showing 19 changed files with 179 additions and 14 deletions.
31 changes: 31 additions & 0 deletions cvat-canvas3d/src/typescript/canvas3dView.ts
Original file line number Diff line number Diff line change
Expand Up @@ -285,6 +285,37 @@ export class Canvas3dViewImpl implements Canvas3dView, Listener {
configurable: false,
writable: false,
});

Object.defineProperty(view, 'getDrawnObjects', {
value: () => Object.values(this.drawnObjects).map((object) => {
const { clientID } = object.data;
return {
...object,
state: this.model.objects.find((_state: ObjectState) => _state.clientID === clientID),
};
}),
enumerable: false,
configurable: false,
writable: false,
});

Object.defineProperty(view, 'updatePosition', {
value: (state: ObjectState, points: number[]) => {
this.dispatchEvent(
new CustomEvent('canvas.edited', {
bubbles: false,
cancelable: true,
detail: {
state,
points: [...points],
},
}),
);
},
enumerable: false,
configurable: false,
writable: false,
});
});

canvasPerspectiveView.addEventListener('contextmenu', (e: MouseEvent): void => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -116,6 +116,7 @@ context('Backup, restore a project with a 3D task.', { browser: '!firefox' }, ()
const archiveName3d = '../../cypress/e2e/canvas3d_functionality/assets/test_canvas3d.zip';

const cuboidCreationParams = {
objectType: 'Shape',
labelName: project.label,
x: 480,
y: 160,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -13,21 +13,25 @@ context('Canvas 3D functionality. Grouping.', () => {
const caseId = '83';
const screenshotsPath = 'cypress/screenshots/canvas3d_functionality/case_83_canvas3d_functionality_cuboid_grouping.js';
const firstCuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 400,
y: 200,
};
const secondCuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 400,
y: 280,
};
const thirdCuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 500,
y: 280,
};
const fourthCuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 500,
y: 200,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,10 @@ import { taskName, labelName } from '../../support/const_canvas3d';
context('Canvas 3D functionality. Redraw.', () => {
const caseId = '84';
const cuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 480,
y: 160,
};

before(() => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,24 +12,33 @@ import { taskName, labelName } from '../../support/const_canvas3d';
context('Canvas 3D functionality. "Move the image" button interaction.', () => {
const caseId = '86';
const screenshotsPath = 'cypress/screenshots/canvas3d_functionality/case_86_canvas3d_functionality_move_image_button.js';
const cuboidCreationParams = { labelName };
const cuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 480,
y: 160,
};

before(() => {
cy.openTask(taskName);
cy.openJob();
cy.wait(1000); // Waiting for the point cloud to display
cy.create3DCuboid(cuboidCreationParams);
cy.customScreenshot('.cvat-canvas3d-perspective', 'canvas3d_perspective_after_add_cuboid');
['topview', 'sideview', 'frontview'].forEach((view) => {
cy.customScreenshot(`.cvat-canvas3d-${view}`, `canvas3d_${view}_after_add_cuboid`);
});
});

describe(`Testing case "${caseId}"`, () => {
it('Click to "Move the image" button. The cuboid on the top/side/front view should be hidden.', () => {
cy.get('.cvat-canvas3d-perspective canvas').trigger('mousemove', 340, 310);
cy.customScreenshot('.cvat-canvas3d-perspective', 'canvas3d_perspective_after_add_cuboid');
['topview', 'sideview', 'frontview'].forEach((view) => {
cy.customScreenshot(`.cvat-canvas3d-${view}`, `canvas3d_${view}_after_add_cuboid`);
});
cy.get('.cvat-move-control').click();
cy.get('.cvat-canvas3d-perspective').trigger('mousemove', 300, 200); // Interacting with the canvas before interacting with the cuboid.
cy.get('.cvat-canvas3d-perspective').trigger('mousemove');
cy.get('.cvat-canvas3d-perspective canvas').trigger('mousedown', { button: 0 });
cy.get('.cvat-canvas3d-perspective canvas').trigger('pointerdown', { buttons: 1 });
cy.get('.cvat-canvas3d-perspective canvas').trigger('pointermove', { buttons: 1, clientX: 100, clientY: 100 }); // Interacting with the canvas before interacting with the cuboid.
cy.get('.cvat-canvas3d-perspective canvas').trigger('pointerup', { buttons: 1 });
cy.get('.cvat-canvas3d-perspective canvas').trigger('mouseup', { button: 0 });
cy.get('#cvat-objects-sidebar-state-item-1').should('not.have.class', 'cvat-objects-sidebar-state-active-item');
cy.customScreenshot('.cvat-canvas3d-perspective', 'canvas3d_perspective_move_the_image_clicked');
['topview', 'sideview', 'frontview'].forEach((view) => {
Expand All @@ -54,8 +63,7 @@ context('Canvas 3D functionality. "Move the image" button interaction.', () => {
it('Cancel "Move the image" activity. "Cursor" button should be active.', () => {
cy.get('body').type('{Esc}');
cy.get('.cvat-active-canvas-control').should('exist');
cy.get('.cvat-canvas3d-perspective').trigger('mousemove', 300, 200); // Interacting with the canvas before interacting with the cuboid.
cy.get('.cvat-canvas3d-perspective').trigger('mousemove');
cy.get('.cvat-canvas3d-perspective canvas').trigger('mousemove', 346, 372); // Interacting with the canvas before interacting with the cuboid.
cy.get('#cvat-objects-sidebar-state-item-1').should('have.class', 'cvat-objects-sidebar-state-active-item');
});
});
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,10 @@ import { taskName, labelName } from '../../support/const_canvas3d';
context('Canvas 3D functionality. Delete a cuboid.', () => {
const caseId = '87';
const cuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 480,
y: 160,
};

before(() => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,10 @@ context('Canvas 3D functionality. Save a job. Remove annotations.', () => {
const screenshotsPath =
'cypress/screenshots/canvas3d_functionality/case_88_canvas3d_functionality_save_job_remove_annotation.js';
const cuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 480,
y: 160,
};
const waitTime = 2000;

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,11 +11,13 @@ context('Canvas 3D functionality. Filters.', () => {
const secondLabel = 'car';
const screenshotsPath = 'cypress/screenshots/canvas3d_functionality/case_89_canvas3d_functionality_filters.js';
const firstCuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 350,
y: 250,
};
const secondCuboidCreationParams = {
objectType: 'Shape',
labelName: secondLabel,
x: 450,
y: 250,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,10 @@ import { taskName, labelName } from '../../support/const_canvas3d';
context('Canvas 3D functionality. Dump/upload annotation. "Point Cloud" format', () => {
const caseId = '91';
const cuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 480,
y: 160,
};
const dumpTypePC = 'Sly Point Cloud Format';
let annotationPCArchiveName = '';
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,10 @@ import { taskName, labelName } from '../../support/const_canvas3d';
context('Canvas 3D functionality. Dump/upload annotation. "Velodyne Points" format.', () => {
const caseId = '92';
const cuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 480,
y: 160,
};
const dumpTypeVC = 'Kitti Raw Format';
let annotationVCArchiveName = '';
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,10 @@ import { taskName, labelName } from '../../support/const_canvas3d';
context('Canvas 3D functionality. Export as a dataset.', () => {
const caseId = '93';
const cuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 480,
y: 160,
};

const dumpTypePC = 'Sly Point Cloud Format';
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,10 @@ context('Canvas 3D functionality. Add cuboid.', () => {

const screenshotsPath = 'cypress/screenshots/canvas3d_functionality_2/case_64_canvas3d_functionality_cuboid.js';
const cuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 480,
y: 160,
};

before(() => {
Expand All @@ -26,6 +29,7 @@ context('Canvas 3D functionality. Add cuboid.', () => {
describe(`Testing case "${caseId}"`, () => {
it('Add cuboid.', () => {
cy.create3DCuboid(cuboidCreationParams);
cy.get('#cvat-objects-sidebar-state-item-1').trigger('mouseover').should('have.class', 'cvat-objects-sidebar-state-active-item');
cy.customScreenshot('.cvat-canvas3d-perspective', 'canvas3d_perspective_after_add_cuboid'); // The cuboid displayed
cy.compareImagesAndCheckResult(
`${screenshotsPath}/canvas3d_perspective_before_all.png`,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,10 @@ context('Canvas 3D functionality. Interaction with cuboid via sidebar.', () => {
const caseId = '78';
const screenshotsPath = 'cypress/screenshots/canvas3d_functionality_2/case_78_canvas3d_functionality_cuboid_label.js';
const cuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 480,
y: 160,
};
const secondLabel = 'car';
const secondLabelAdditionalAttrs = false;
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,10 @@ import { taskName, labelName } from '../../support/const_canvas3d';
context('Canvas 3D functionality. Cuboid context menu.', () => {
const caseId = '79';
const cuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 480,
y: 160,
};

before(() => {
Expand All @@ -21,7 +24,8 @@ context('Canvas 3D functionality. Cuboid context menu.', () => {

describe(`Testing case "${caseId}"`, () => {
it('Right click on the cuboid. Context menu should exist.', () => {
cy.get('.cvat-canvas3d-perspective').rightclick();
cy.get('.cvat-canvas3d-perspective canvas').trigger('mousemove', 340, 310);
cy.get('.cvat-canvas3d-perspective').rightclick(340, 310);
cy.get('.cvat-canvas-context-menu').should('exist');
});

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ context('Canvas 3D functionality. Make a copy.', () => {
const caseId = '80';
const secondLabel = 'car';
const cuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 480,
y: 160,
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,10 @@ import { taskName, labelName } from '../../support/const_canvas3d';
context('Canvas 3D functionality. Cuboid propagate.', () => {
const caseId = '81';
const cuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 480,
y: 160,
};

before(() => {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import { taskName, labelName } from '../../support/const_canvas3d';
context('Canvas 3D functionality. Opacity. Outlined borders.', () => {
const caseId = '82';
const cuboidCreationParams = {
objectType: 'Shape',
labelName,
x: 500,
y: 250,
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,82 @@
// Copyright (C) 2023 CVAT.ai Corporation
//
// SPDX-License-Identifier: MIT

/* eslint-disable cypress/no-unnecessary-waiting */

/// <reference types="cypress" />

import { taskName, labelName } from '../../support/const_canvas3d';

context('3D cuboids interpolation pipeline', () => {
const cuboidCreationParams = {
objectType: 'Track',
labelName,
x: 460,
y: 390,
};

before(() => {
cy.openTaskJob(taskName);
cy.wait(2000); // waiting for the point cloud to display
});

describe('Drawing a cuboid', () => {
it('Check track-related elements', () => {
cy.get('.cvat-merge-control').should('exist').and('be.visible');
cy.get('.cvat-split-track-control').should('exist').and('be.visible');
cy.get('.cvat-annotation-header-button').contains('Info').click();
cy.get('.cvat-job-info-modal-window').should('exist').and('be.visible').within(() => {
cy.get('table tr:nth-child(3) td:nth-child(2)').should('contain.text', '0 / 0');
});
cy.get('.ant-modal-content button').contains('OK').click();
});

it('Just add a cuboid track and update it on the second frame, check interpolation', () => {
let initialX = 0;
let initialY = 0;
let initialZ = 0;
cy.get('.cvat-canvas3d-perspective canvas').then(([el]) => {
const bbox = el.getBoundingClientRect();
cuboidCreationParams.x -= bbox.x;
cuboidCreationParams.y -= bbox.y;
return el;
}).then(([el]) => {
cy.create3DCuboid(cuboidCreationParams);
cy.get('#cvat-objects-sidebar-state-item-1').should('exist').and('contain.text', 'CUBOID TRACK').then(() => {
const cuboid = Object.values(el.getDrawnObjects())[0].cuboid.perspective;
({ x: initialX, y: initialY, z: initialZ } = cuboid.position);
});
});

cy.goCheckFrameNumber(2);
cy.wait(1000); // waiting for the point cloud to display
cy.get('.cvat-canvas3d-topview canvas').then(([el]) => {
const { state } = Object.values(el.getDrawnObjects())[0];
const [x, y, z] = [0, 0, 0];
const [rotX, rotY, rotZ] = [Math.PI, Math.PI, Math.PI];
const [width, height, depth] = [2, 2, 2];
el.updatePosition(
state, Array.from([x, y, z, rotX, rotY, rotZ, width, height, depth, 0, 0, 0, 0, 0, 0, 0]),
);
});

cy.goCheckFrameNumber(1);
cy.wait(1000); // waiting for the point cloud to display
cy.get('.cvat-canvas3d-topview canvas').then(([el]) => {
const cuboid = Object.values(el.getDrawnObjects())[0].cuboid.perspective;
expect(cuboid.position.x).to.equal(initialX / 2);
expect(cuboid.position.y).to.equal(initialY / 2);
expect(cuboid.position.z).to.equal(initialZ / 2);
expect(cuboid.scale.x).to.equal(1.5);
expect(cuboid.scale.y).to.equal(1.5);
expect(cuboid.scale.z).to.equal(1.5);
expect(cuboid.rotation.x).to.equal(Math.PI / 2);
expect(cuboid.rotation.y).to.equal(Math.PI / 2);
expect(cuboid.rotation.z).to.equal(Math.PI / 2);
});

cy.removeAnnotations();
});
});
});
11 changes: 7 additions & 4 deletions tests/cypress/support/commands_canvas3d.js
Original file line number Diff line number Diff line change
Expand Up @@ -18,12 +18,15 @@ Cypress.Commands.add('compareImagesAndCheckResult', (baseImage, afterImage, noCh
});

Cypress.Commands.add('create3DCuboid', (cuboidCreationParams) => {
const {
x, y, labelName, objectType,
} = cuboidCreationParams;
cy.interactControlButton('draw-cuboid');
cy.switchLabel(cuboidCreationParams.labelName, 'draw-cuboid');
cy.get('.cvat-draw-cuboid-popover').contains('Shape').click();
cy.switchLabel(labelName, 'draw-cuboid');
cy.get('.cvat-draw-cuboid-popover').contains(objectType).click();
cy.get('.cvat-canvas3d-perspective')
.trigger('mousemove', cuboidCreationParams.x, cuboidCreationParams.y)
.dblclick(cuboidCreationParams.x, cuboidCreationParams.y);
.trigger('mousemove', x, y)
.dblclick(x, y);
cy.wait(1000); // Waiting for a cuboid creation
cy.get('.cvat-draw-cuboid-popover').should('be.hidden');
});
Expand Down

0 comments on commit 771c13c

Please sign in to comment.