Cypress. Adapting tests to the new filter functionality. (#3026)

* adapting 1444

* Add cypress command

* Tests adaptations.

Removed test or issue 2690.

* Add the css class if filter modal visible

* Move cypress command for filters to diff file

* Tests adaptations

* Applying comments.

* Moving comments

* Prettier formatting.

* Fix another tests
main
Dmitry Kruchinin 5 years ago committed by GitHub
parent 56bba8ec93
commit 59d7b38157
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -251,7 +251,7 @@ export default function FiltersModalComponent(props: Props): JSX.Element {
return ( return (
<Modal <Modal
className='cvat-filters-modal' className={visible ? 'cvat-filters-modal cvat-filters-modal-visible' : 'cvat-filters-modal'}
visible={visible} visible={visible}
closable={false} closable={false}
width={800} width={800}

@ -4,182 +4,280 @@
// /// <reference types="cypress" /> // /// <reference types="cypress" />
// import { taskName } from '../../support/const'; import { taskName } from '../../support/const';
// TODO: Update with new filters UI context('Filters functionality.', () => {
const caseId = '18';
// context('Filters functionality.', () => { const labelShape = 'shape 3 points';
// const caseId = '18'; const additionalAttrsLabelShape = [
// const labelShape = 'shape 3 points'; { additionalAttrName: 'type', additionalValue: 'shape', typeAttribute: 'Text' },
// const additionalAttrsLabelShape = [ { additionalAttrName: 'count points', additionalValue: '3', typeAttribute: 'Text' },
// { additionalAttrName: 'type', additionalValue: 'shape', typeAttribute: 'Text' }, { additionalAttrName: 'polygon', additionalValue: 'True', typeAttribute: 'Checkbox' },
// { additionalAttrName: 'count points', additionalValue: '3', typeAttribute: 'Text' }, ];
// { additionalAttrName: 'polygon', additionalValue: 'True', typeAttribute: 'Checkbox' }, const labelTrack = 'track 4 points';
// ]; const additionalAttrsLabelTrack = [
// const labelTrack = 'track 4 points'; { additionalAttrName: 'type', additionalValue: 'track', typeAttribute: 'Text' },
// const additionalAttrsLabelTrack = [ { additionalAttrName: 'polygon', additionalValue: 'True', typeAttribute: 'Checkbox' },
// { additionalAttrName: 'type', additionalValue: 'track', typeAttribute: 'Text' }, { additionalAttrName: 'count points', additionalValue: '4', typeAttribute: 'Text' },
// { additionalAttrName: 'polygon', additionalValue: 'True', typeAttribute: 'Checkbox' }, ];
// { additionalAttrName: 'count points', additionalValue: '4', typeAttribute: 'Text' },
// ]; const createPolygonShape = {
reDraw: false,
// const createPolygonShape = { type: 'Shape',
// reDraw: false, labelName: labelShape,
// type: 'Shape', pointsMap: [
// labelName: labelShape, { x: 200, y: 200 },
// pointsMap: [ { x: 250, y: 200 },
// { x: 200, y: 200 }, { x: 250, y: 240 },
// { x: 250, y: 200 }, ],
// { x: 250, y: 240 }, complete: true,
// ], numberOfPoints: null,
// complete: true, };
// numberOfPoints: null, const createRectangleTrack2Points = {
// }; points: 'By 2 Points',
// const createRectangleTrack2Points = { type: 'Track',
// points: 'By 2 Points', labelName: labelTrack,
// type: 'Track', firstX: 260,
// labelName: labelTrack, firstY: 200,
// firstX: 260, secondX: 360,
// firstY: 200, secondY: 250,
// secondX: 360, };
// secondY: 250, const createRectangleShape4Points = {
// }; points: 'By 4 Points',
// const createRectangleShape4Points = { type: 'Shape',
// points: 'By 4 Points', labelName: labelShape,
// type: 'Shape', firstX: 550,
// labelName: labelShape, firstY: 350,
// firstX: 550, secondX: 650,
// firstY: 350, secondY: 350,
// secondX: 650, thirdX: 650,
// secondY: 350, thirdY: 450,
// thirdX: 650, fourthX: 550,
// thirdY: 450, fourthY: 450,
// fourthX: 550, };
// fourthY: 450, const createPolygonTrack = {
// }; reDraw: false,
// const createPolygonTrack = { type: 'Track',
// reDraw: false, labelName: labelTrack,
// type: 'Track', pointsMap: [
// labelName: labelTrack, { x: 700, y: 350 },
// pointsMap: [ { x: 850, y: 350 },
// { x: 700, y: 350 }, { x: 850, y: 450 },
// { x: 850, y: 350 }, { x: 700, y: 450 },
// { x: 850, y: 450 }, ],
// { x: 700, y: 450 }, numberOfPoints: 4,
// ], };
// numberOfPoints: 4,
// }; let cvatCanvasShapeList = [];
let cvatFiltesList = [];
// let cvatCanvasShapeList = [];
// let cvatFiltesList = []; function checkingFilterApplication(ids) {
for (let i = 0; i < cvatCanvasShapeList.length; i++) {
// function checkingFilterApplication(ids) { if (ids.indexOf(cvatCanvasShapeList[i]) > -1) {
// for (let i = 0; i < cvatCanvasShapeList.length; i++) { cy.get(`#cvat_canvas_shape_${cvatCanvasShapeList[i]}`).should('exist');
// if (ids.indexOf(cvatCanvasShapeList[i]) > -1) { cy.get(`#cvat-objects-sidebar-state-item-${cvatCanvasShapeList[i]}`).should('exist');
// cy.get(`#cvat_canvas_shape_${cvatCanvasShapeList[i]}`).should('exist'); } else {
// cy.get(`#cvat-objects-sidebar-state-item-${cvatCanvasShapeList[i]}`).should('exist'); cy.get(`#cvat_canvas_shape_${cvatCanvasShapeList[i]}`).should('not.exist');
// } else { cy.get(`#cvat-objects-sidebar-state-item-${cvatCanvasShapeList[i]}`).should('not.exist');
// cy.get(`#cvat_canvas_shape_${cvatCanvasShapeList[i]}`).should('not.exist'); }
// cy.get(`#cvat-objects-sidebar-state-item-${cvatCanvasShapeList[i]}`).should('not.exist'); }
// } }
// }
// } before(() => {
cy.openTask(taskName);
// before(() => { cy.addNewLabel(labelShape, additionalAttrsLabelShape);
// cy.openTask(taskName); cy.addNewLabel(labelTrack, additionalAttrsLabelTrack);
// cy.addNewLabel(labelShape, additionalAttrsLabelShape); cy.openJob();
// cy.addNewLabel(labelTrack, additionalAttrsLabelTrack); });
// cy.openJob();
// }); describe(`Testing case "${caseId}"`, () => {
it('Draw several objects (different shapes, tracks, labels)', () => {
// describe(`Testing case "${caseId}"`, () => { cy.createPolygon(createPolygonShape);
// it('Draw several objects (different shapes, tracks, labels)', () => { cy.createRectangle(createRectangleTrack2Points);
// cy.createPolygon(createPolygonShape); cy.createRectangle(createRectangleShape4Points);
// cy.createRectangle(createRectangleTrack2Points); cy.createPolygon(createPolygonTrack);
// cy.createRectangle(createRectangleShape4Points); cy.get('.cvat_canvas_shape').then(($cvatCanvasShapeList) => {
// cy.createPolygon(createPolygonTrack); for (let i = 0; i < $cvatCanvasShapeList.length; i++) {
// cy.get('.cvat_canvas_shape').then(($cvatCanvasShapeList) => { cvatCanvasShapeList.push(Number($cvatCanvasShapeList[i].id.match(/\d+$/)));
// for (let i = 0; i < $cvatCanvasShapeList.length; i++) { }
// cvatCanvasShapeList.push(Number($cvatCanvasShapeList[i].id.match(/\d+$/))); });
// } });
// });
// }); it('Filter: shape == "polygon". Only the polygon exist.', () => {
// it('Filter: shape=="polygon". Only the polygon exist.', () => { const textFilter = 'shape == "polygon"';
// const textFilter = 'shape=="polygon"'; cvatFiltesList.push(textFilter);
// cvatFiltesList.push(textFilter); cy.addFiltersRule(0);
// cy.writeFilterValue(false, textFilter); // #cvat_canvas_shape_1,4, #cvat-objects-sidebar-state-item-1,4 cy.setFilter({
// checkingFilterApplication([1, 4]); groupIndex: 0,
// }); ruleIndex: 0,
// it('Filter: shape=="polygon" | shape=="rectangle". Only the rectangle and polygon exist.', () => { field: 'Shape',
// const textFilter = 'shape=="polygon" | shape=="rectangle"'; operator: '==',
// cvatFiltesList.push(textFilter); value: 'polygon',
// cy.writeFilterValue(true, textFilter); // #cvat_canvas_shape_1,2,3,4, #cvat-objects-sidebar-state-item-1,2,3,4 submit: true,
// checkingFilterApplication([1, 2, 3, 4]); });
// }); checkingFilterApplication([1, 4]); // #cvat_canvas_shape_1,4, #cvat-objects-sidebar-state-item-1,4
// it('Filter: type=="shape". Only the objects with shape type exist.', () => { cy.clearFilters(); // Clear filters
// const textFilter = 'type=="shape"'; });
// cvatFiltesList.push(textFilter);
// cy.writeFilterValue(true, textFilter); // #cvat_canvas_shape_1,3, #cvat-objects-sidebar-state-item-1,3 it('Filter: (shape == "polygon" || shape == "rectangle"). Only the rectangle and polygon exist.', () => {
// checkingFilterApplication([1, 3]); const textFilter = '(shape == "polygon" || shape == "rectangle")';
// }); cvatFiltesList.push(textFilter);
// it('Filter: label=="track 4 points". Only the polygon exist.', () => { cy.addFiltersRule(0);
// const textFilter = `label=="${labelTrack}"`; cy.setFilter({ groupIndex: 0, ruleIndex: 0, field: 'Shape', operator: '==', value: 'polygon' });
// cvatFiltesList.push(textFilter); cy.addFiltersRule(0);
// cy.writeFilterValue(true, textFilter); // #cvat_canvas_shape_2,4, #cvat-objects-sidebar-state-item-2,4 cy.setGroupCondition(0, 'Or');
// checkingFilterApplication([2, 4]); cy.setFilter({
// }); groupIndex: 0,
// it('Filter: attr["count points"] == "4". Only the objects with same attr exist.', () => { ruleIndex: 1,
// const textFilter = 'attr["count points"] == "4"'; field: 'Shape',
// cvatFiltesList.push(textFilter); operator: '==',
// cy.writeFilterValue(true, textFilter); // #cvat_canvas_shape_2,4, #cvat-objects-sidebar-state-item-2,4 value: 'rectangle',
// checkingFilterApplication([2, 4]); submit: true,
// }); });
// it('Filter: width >= height. All objects exist.', () => { checkingFilterApplication([1, 2, 3, 4]); // #cvat_canvas_shape_1,2,3,4, #cvat-objects-sidebar-state-item-1,2,3,4
// const textFilter = 'width >= height'; cy.clearFilters(); // Clear filters
// cvatFiltesList.push(textFilter); });
// cy.writeFilterValue(true, textFilter); // #cvat_canvas_shape_1,2,3,4, #cvat-objects-sidebar-state-item-1,2,3,4
// checkingFilterApplication([1, 2, 3, 4]); it('Filter: type == "shape". Only the objects with shape type exist.', () => {
// }); const textFilter = 'type == "shape"';
// it('Filter: clientID == 4. Only the objects with same id exist (polygon track).', () => { cvatFiltesList.push(textFilter);
// const textFilter = 'clientID == 4'; cy.addFiltersRule(0);
// cvatFiltesList.push(textFilter); cy.setFilter({ groupIndex: 0, ruleIndex: 0, field: 'Type', operator: '==', value: 'shape', submit: true });
// cy.writeFilterValue(true, textFilter); // #cvat_canvas_shape_7, #cvat-objects-sidebar-state-item-4 checkingFilterApplication([1, 3]); // #cvat_canvas_shape_1,3, #cvat-objects-sidebar-state-item-1,3
// checkingFilterApplication([4]); cy.clearFilters(); // Clear filters
// }); });
// it('Filter: (label=="shape 3 points" & attr["polylines"]==true) | (label=="track 4 points" & width > 60). Only the objects polygon and rectangle exist.', () => {
// const textFilter = it('Filter: label == "track 4 points". Only the polygon exist.', () => {
// '(label=="shape 3 points" & attr["polylines"]==true) | (label=="track 4 points" & width > 60)'; const textFilter = 'label == "track 4 points"';
// cvatFiltesList.push(textFilter); cvatFiltesList.push(textFilter);
// cy.writeFilterValue(true, textFilter); // #cvat_canvas_shape_2,4, #cvat-objects-sidebar-state-item-2,4 cy.addFiltersRule(0);
// checkingFilterApplication([2, 4]); cy.setFilter({
// }); groupIndex: 0,
// it('Filter: (( label==["shape 3 points"]) | (attr["type"]=="shape" & width > 50)) & (height > 50 & (clientID == serverID))). All objects not exist.', () => { ruleIndex: 0,
// const textFilter = field: 'Label',
// '(( label==["points shape"]) | (attr["type"]=="shape" & width > 50)) & (height > 50 & (clientID == serverID)))'; operator: '==',
// cvatFiltesList.push(textFilter); value: labelTrack,
// cy.writeFilterValue(true, textFilter); submit: true,
// checkingFilterApplication([]); });
// }); checkingFilterApplication([2, 4]); // #cvat_canvas_shape_2,4, #cvat-objects-sidebar-state-item-2,4
// it('Verify to show all filters', () => { cy.clearFilters(); // Clear filters
// cvatFiltesList.forEach(function (filterValue) { });
// cy.contains('.cvat-annotations-filters-input-history-element', filterValue);
// }); it('Filter: Attributes count points 4. Only the objects with same attr exist.', () => {
// }); const textFilter = 'attr.track 4 points.count points == "4"';
// it('Select filter: type=="shape"', () => { cvatFiltesList.push(textFilter);
// cy.selectFilterValue(true, 'type=="shape"'); // #cvat_canvas_shape_1,3, #cvat-objects-sidebar-state-item-1,3 cy.addFiltersRule(0);
// checkingFilterApplication([1, 3]); cy.setFilter({
// }); groupIndex: 0,
// it('Select filter: clientID == 4', () => { ruleIndex: 0,
// cy.selectFilterValue(true, 'clientID == 4'); // #cvat_canvas_shape_7, #cvat-objects-sidebar-state-item-4 field: 'Attributes',
// checkingFilterApplication([4]); operator: '==',
// }); value: 4,
// it('Select two filters', () => { label: labelTrack,
// const textFirstFilter = labelAttr: 'count points',
// '(label=="shape 3 points" & attr["polylines"]==true) | (label=="track 4 points" & width > 60)'; // #cvat_canvas_shape_2,4, #cvat-objects-sidebar-state-item-2,4 submit: true,
// const textSecondFilter = 'shape=="polygon"'; // #cvat_canvas_shape_1,4, #cvat-objects-sidebar-state-item-1,4 });
// cy.selectFilterValue(true, textFirstFilter); checkingFilterApplication([2, 4]); // #cvat_canvas_shape_2,4, #cvat-objects-sidebar-state-item-2,4
// cy.selectFilterValue(false, textSecondFilter); cy.clearFilters(); // Clear filters
// checkingFilterApplication([1, 2, 4]); });
// });
// }); it('Filter: width >= height. All objects exist.', () => {
// }); const textFilter = 'width >= height';
cvatFiltesList.push(textFilter);
cy.addFiltersRule(0);
cy.setFilter({
groupIndex: 0,
ruleIndex: 0,
field: 'Width',
operator: '>=',
valueSource: 'Field',
value: 'Height',
submit: true,
});
checkingFilterApplication([1, 2, 3, 4]); // #cvat_canvas_shape_1,2,3,4, #cvat-objects-sidebar-state-item-1,2,3,4
cy.clearFilters(); // Clear filters
});
it('Filter: objectID == 4. Only the objects with same id exist (polygon track).', () => {
const textFilter = 'objectID == 4';
cvatFiltesList.push(textFilter);
cy.addFiltersRule(0);
cy.setFilter({ groupIndex: 0, ruleIndex: 0, field: 'ObjectID', operator: '==', value: 4, submit: true });
checkingFilterApplication([4]); // #cvat_canvas_shape_4, #cvat-objects-sidebar-state-item-4
cy.clearFilters(); // Clear filters
});
it('Filter: ((label == "shape 3 points" && attr.track 4 points.type == "polylines") || (label == "track 4 points" && width > 60)). Only the objects polygon and rectangle exist.', () => {
const textFilter =
'((label == "shape 3 points" && attr.track 4 points.type == "polylines") || (label == "track 4 points" && width > 60))';
cvatFiltesList.push(textFilter);
cy.addFiltersGroup(0);
cy.addFiltersGroup(0);
cy.setFilter({ groupIndex: 1, ruleIndex: 0, field: 'Label', operator: '==', value: labelShape });
cy.addFiltersRule(1);
cy.setFilter({
groupIndex: 1,
ruleIndex: 1,
field: 'Attributes',
operator: '==',
value: 'polylines',
label: labelTrack,
labelAttr: 'type',
});
cy.setFilter({ groupIndex: 2, ruleIndex: 2, field: 'Label', operator: '==', value: labelTrack });
cy.addFiltersRule(2);
cy.setGroupCondition(0, 'Or');
cy.setFilter({ groupIndex: 2, ruleIndex: 3, field: 'Width', operator: '>', value: '60', submit: true });
checkingFilterApplication([2, 4]); // #cvat_canvas_shape_2,4, #cvat-objects-sidebar-state-item-2,4
cy.clearFilters(); // Clear filters
});
it('Filter: ((label == "shape 3 points" || (attr.shape 3 points.type == "shape" && width > 50)) && height > 50). Only the rectangle shape exist.', () => {
const textFilter =
'((label == "shape 3 points" || (attr.shape 3 points.type == "shape" && width > 50)) && height > 50)';
cvatFiltesList.push(textFilter);
cy.addFiltersGroup(0);
cy.setFilter({ groupIndex: 1, ruleIndex: 0, field: 'Label', operator: '==', value: labelShape });
cy.addFiltersGroup(1);
cy.setGroupCondition(1, 'Or');
cy.setFilter({
groupIndex: 2,
ruleIndex: 1,
field: 'Attributes',
operator: '==',
value: 'shape',
label: labelShape,
labelAttr: 'type',
});
cy.addFiltersRule(2);
cy.setFilter({ groupIndex: 2, ruleIndex: 2, field: 'Width', operator: '>', value: 50 });
cy.addFiltersGroup(0);
cy.setGroupCondition(0, 'And');
cy.setFilter({ groupIndex: 3, ruleIndex: 3, field: 'Height', operator: '>', value: 50, submit: true });
checkingFilterApplication([3]); // #cvat_canvas_shape_3, #cvat-objects-sidebar-state-item-3
cy.clearFilters(); // Clear filters
});
it('Verify to show all filters', () => {
cy.сheckFiltersModalOpened();
cy.get('.recently-used-wrapper').trigger('mouseover');
cy.get('.ant-dropdown')
.not('.ant-dropdown-hidden')
.within(() => {
cvatFiltesList.forEach(function (filterValue) {
cy.contains('[role="menuitem"]', filterValue);
});
});
});
it('Select filter: type == "shape"', () => {
cy.selectFilterValue('type == "shape"'); // #cvat_canvas_shape_1,3, #cvat-objects-sidebar-state-item-1,3
checkingFilterApplication([1, 3]);
});
it('Select filter: objectID == 4', () => {
cy.selectFilterValue('objectID == 4'); // #cvat_canvas_shape_4, #cvat-objects-sidebar-state-item-4
checkingFilterApplication([4]);
});
});
});

@ -39,17 +39,27 @@ context('Filter property "shape" work correctly', () => {
cy.createRectangle(createRectangleShape2Points); cy.createRectangle(createRectangleShape2Points);
cy.get('#cvat-objects-sidebar-state-item-1').should('contain', '1').and('contain', 'RECTANGLE SHAPE'); cy.get('#cvat-objects-sidebar-state-item-1').should('contain', '1').and('contain', 'RECTANGLE SHAPE');
}); });
it('Create a polygon', () => { it('Create a polygon', () => {
cy.createPolygon(createPolygonShape); cy.createPolygon(createPolygonShape);
cy.get('#cvat-objects-sidebar-state-item-2').should('contain', '2').and('contain', 'POLYGON SHAPE'); cy.get('#cvat-objects-sidebar-state-item-2').should('contain', '2').and('contain', 'POLYGON SHAPE');
}); });
// TODO: Update with new filters UI
// it('Input filter "shape == "polygon""', () => { it('Set a filter: "shape == "polygon""', () => {
// cy.get('.cvat-annotations-filters-input').type('shape == "polygon"{Enter}'); cy.addFiltersRule(0);
// }); cy.setFilter({
// it('Only polygon is visible', () => { groupIndex: 0,
// cy.get('#cvat_canvas_shape_2').should('exist'); ruleIndex: 0,
// cy.get('#cvat_canvas_shape_1').should('not.exist'); field: 'Shape',
// }); operator: '==',
value: 'polygon',
submit: true,
});
});
it('Only polygon is visible', () => {
cy.get('#cvat_canvas_shape_2').should('exist');
cy.get('#cvat_canvas_shape_1').should('not.exist');
});
}); });
}); });

@ -33,11 +33,18 @@ context('Navigation to empty frames', () => {
cy.createRectangle(createRectangleShape2Points); cy.createRectangle(createRectangleShape2Points);
}); });
// TODO: Update with new filters UI it('Set a filter to see the created objects.', () => {
// it('Input a filter to see the created objects.', () => { cy.addFiltersRule(0);
// cy.writeFilterValue(false, 'shape=="rectangle"'); cy.setFilter({
// cy.get('#cvat_canvas_shape_2').should('exist'); groupIndex: 0,
// }); ruleIndex: 0,
field: 'Shape',
operator: '==',
value: 'rectangle',
submit: true,
});
cy.get('#cvat_canvas_shape_2').should('exist');
});
it('Go to 3rd frame.', () => { it('Go to 3rd frame.', () => {
cy.goCheckFrameNumber(3); cy.goCheckFrameNumber(3);
@ -51,22 +58,21 @@ context('Navigation to empty frames', () => {
} }
}); });
// TODO: Update with new filters UI it("Press go previous with a filter. CVAT get 2nd frame. Press again. Frame wasn't changed.", () => {
// it("Press go previous with a filter. CVAT get 2nd frame. Press again. Frame wasn't changed.", () => { for (let i = 1; i <= 2; i++) {
// for (let i = 1; i <= 2; i++) { cy.get('.cvat-player-previous-button-filtered').click({ force: true });
// cy.get('.cvat-player-previous-button-filtered').click({ force: true }); cy.checkFrameNum(2);
// cy.checkFrameNum(2); cy.get('#cvat_canvas_shape_1').should('exist');
// cy.get('#cvat_canvas_shape_1').should('exist'); }
// } });
// });
// it("Press go next with a filter. CVAT get 4th frame. Press again. Frame wasn't changed.", () => { it("Press go next with a filter. CVAT get 4th frame. Press again. Frame wasn't changed.", () => {
// for (let i = 1; i <= 2; i++) { for (let i = 1; i <= 2; i++) {
// cy.get('.cvat-player-next-button-filtered').click({ force: true }); cy.get('.cvat-player-next-button-filtered').click({ force: true });
// cy.checkFrameNum(4); cy.checkFrameNum(4);
// cy.get('#cvat_canvas_shape_2').should('exist'); cy.get('#cvat_canvas_shape_2').should('exist');
// } }
// }); });
it('Change navigation buttons mode to "Go next/previous to an empty frame".', () => { it('Change navigation buttons mode to "Go next/previous to an empty frame".', () => {
for (const i of ['previous', 'next']) { for (const i of ['previous', 'next']) {
@ -75,17 +81,16 @@ context('Navigation to empty frames', () => {
} }
}); });
// TODO: Update with new filters UI it('Go previous to an empty frame. CVAT get 3rd frame.', () => {
// it('Go previous to an empty frame. CVAT get 3rd frame.', () => { cy.get('.cvat-player-previous-button-empty').click({ force: true });
// cy.get('.cvat-player-previous-button-empty').click({ force: true }); cy.checkFrameNum(3);
// cy.checkFrameNum(3); cy.get('.cvat_canvas_shape').should('not.exist');
// cy.get('.cvat_canvas_shape').should('not.exist'); });
// });
// it('Go next to an empty frame. CVAT get 5th frame.', () => { it('Go next to an empty frame. CVAT get 5th frame.', () => {
// cy.get('.cvat-player-next-button-empty').click({ force: true }); cy.get('.cvat-player-next-button-empty').click({ force: true });
// cy.checkFrameNum(5); cy.checkFrameNum(5);
// cy.get('.cvat_canvas_shape').should('not.exist'); cy.get('.cvat_canvas_shape').should('not.exist');
// }); });
}); });
}); });

@ -1,33 +0,0 @@
// Copyright (C) 2021 Intel Corporation
//
// SPDX-License-Identifier: MIT
/// <reference types="cypress" />
import { taskName } from '../../support/const';
context('Annotation filter help dialog window.', () => {
const issueId = '2690';
before(() => {
cy.openTaskJob(taskName);
});
describe(`Testing issue "${issueId}"`, () => {
// TODO: Update with new filters UI
// it('Open annotation filters help dialog window. The window is visible.', () => {
// cy.get('.cvat-annotations-filters-input').within(() => {
// // class="ant-select-selection-placeholder" has CSS pointer-events: none
// cy.get('.ant-select-selection-placeholder').invoke('css', 'pointer-events', 'auto'); // Replace CSS "pointer-events" to auto
// cy.get('[aria-label="filter"]').click();
// });
// cy.get('.cvat-annotations-filters-help-modal-window').should('exist').and('be.visible');
// });
// it('Close annotation filters help dialog window. The window is closed.', () => {
// cy.get('.cvat-annotations-filters-help-modal-window').within(() => {
// cy.contains('button', 'OK').click();
// });
// cy.get('.cvat-annotations-filters-help-modal-window').should('not.exist');
// });
});
});

@ -572,34 +572,6 @@ Cypress.Commands.add('getScaleValue', () => {
}); });
}); });
Cypress.Commands.add('writeFilterValue', (clear, filterValue) => {
if (clear) {
cy.get('.cvat-annotations-filters-input').within(() => {
cy.get('[aria-label="close-circle"]').click();
});
}
cy.get('.cvat-annotations-filters-input')
.type(`${filterValue}{Enter}`)
.within(() => {
cy.get('.ant-select-selection-item-content').should('have.text', filterValue);
});
});
Cypress.Commands.add('selectFilterValue', (clear, filterValue) => {
if (clear) {
cy.get('.cvat-annotations-filters-input').within(() => {
cy.get('[aria-label="close-circle"]').click();
});
}
cy.get('body').click();
cy.get('.cvat-annotations-filters-input').click();
cy.contains('.cvat-annotations-filters-input-history-element', filterValue).scrollIntoView().click();
cy.get('body').click();
cy.get('.cvat-annotations-filters-input').within(() => {
cy.contains('.ant-select-selection-item-content', filterValue);
});
});
Cypress.Commands.add('goCheckFrameNumber', (frameNum) => { Cypress.Commands.add('goCheckFrameNumber', (frameNum) => {
cy.get('.cvat-player-frame-selector').within(() => { cy.get('.cvat-player-frame-selector').within(() => {
cy.get('input[role="spinbutton"]') cy.get('input[role="spinbutton"]')

@ -0,0 +1,139 @@
// Copyright (C) 2021 Intel Corporation
//
// SPDX-License-Identifier: MIT
/// <reference types="cypress" />
Cypress.Commands.add('сheckFiltersModalOpened', () => {
cy.document().then((doc) => {
const filterModal = Array.from(doc.querySelectorAll('.cvat-filters-modal-visible'));
if (filterModal.length === 0) {
cy.contains('.cvat-annotation-header-button', 'Filters').click();
}
});
});
Cypress.Commands.add('collectGroupID', () => {
let groupDataID = [];
cy.get('.group').then(($group) => {
for (let i = 0; i < $group.length; i++) {
groupDataID.push($group[i].dataset.id);
}
return groupDataID;
});
});
Cypress.Commands.add('collectRuleID', () => {
let ruleDataID = [];
cy.get('.rule').then(($rule) => {
for (let i = 0; i < $rule.length; i++) {
ruleDataID.push($rule[i].dataset.id);
}
return ruleDataID;
});
});
Cypress.Commands.add('clearFilters', () => {
cy.сheckFiltersModalOpened();
cy.contains('button', 'Clear filters').click();
});
Cypress.Commands.add('addFiltersGroup', (groupIndex) => {
cy.сheckFiltersModalOpened();
cy.collectGroupID().then((groupIdIndex) => {
cy.get(`[data-id="${groupIdIndex[groupIndex]}"]`).contains('button', 'Add group').first().click();
});
});
Cypress.Commands.add('addFiltersRule', (groupIndex) => {
cy.сheckFiltersModalOpened();
cy.collectGroupID().then((groupIdIndex) => {
cy.get(`[data-id="${groupIdIndex[groupIndex]}"]`).contains('button', 'Add rule').click();
});
});
Cypress.Commands.add('setGroupCondition', (groupIndex, condition) => {
cy.сheckFiltersModalOpened();
cy.collectGroupID().then((groupIdIndex) => {
cy.get(`[data-id="${groupIdIndex[groupIndex]}"]`).within(() => {
cy.get('.group--header').first().trigger('mouseover');
cy.contains('button', condition).click({ force: true });
});
});
});
Cypress.Commands.add(
'setFilter',
({groupIndex, ruleIndex, field, operator, valueSource, value, label, labelAttr, submit}) => {
cy.сheckFiltersModalOpened();
cy.collectGroupID().then((groupIdIndex) => {
cy.collectRuleID().then((ruleIdIndex) => {
cy.get(`[data-id="${groupIdIndex[groupIndex]}"]`)
.find(`[data-id="${ruleIdIndex[ruleIndex]}"]`)
.within(() => {
cy.contains('button', 'Select field').click();
});
if (field === 'Attributes') {
cy.get('.ant-dropdown')
.not('.ant-dropdown-hidden')
.contains('[role="menuitem"]', field)
.trigger('mouseover');
cy.get('.ant-dropdown-menu-sub').contains(label).trigger('mouseover', { force: true });
cy.contains('.ant-dropdown-menu-item-only-child', labelAttr).click();
} else {
cy.get('.ant-dropdown').not('.ant-dropdown-hidden').contains('[role="menuitem"]', field).click();
}
cy.get(`[data-id="${groupIdIndex[groupIndex]}"]`)
.find(`[data-id="${ruleIdIndex[ruleIndex]}"]`)
.within(() => {
cy.get('[type="search"]').first().click({ force: true });
});
cy.get(`[label="${operator}"]`).last().click();
if (valueSource) {
cy.get(`[data-id="${groupIdIndex[groupIndex]}"]`)
.find(`[data-id="${ruleIdIndex[ruleIndex]}"]`)
.within(() => {
cy.get('[aria-label="ellipsis"]').trigger('mouseover');
});
cy.contains('Select value source').parents('[role="tooltip"]').contains(valueSource).click();
}
cy.get(`[data-id="${groupIdIndex[groupIndex]}"]`)
.find(`[data-id="${ruleIdIndex[ruleIndex]}"]`)
.within(() => {
if (field === 'Attributes') {
cy.get('[placeholder="Enter string"]').last().type(`${value}{Enter}`);
} else {
if (!valueSource) {
if (field === 'ObjectID' || field === 'Width' || field === 'Height') {
cy.get('[placeholder="Enter number"]').type(`${value}{Enter}`);
} else {
cy.get('[type="search"]').last().type(`${value}{Enter}`);
}
} else {
cy.contains('[type="button"]', 'Select field ').click();
}
}
});
if (valueSource) {
cy.get('.ant-dropdown').not('.ant-dropdown-hidden').contains('[role="menuitem"]', value).click();
}
cy.get('.cvat-filters-modal').within(() => {
submit ? cy.contains('button', 'Submit').click() : null;
});
});
});
},
);
Cypress.Commands.add('selectFilterValue', (filterValue) => {
cy.сheckFiltersModalOpened();
cy.get('.recently-used-wrapper').trigger('mouseover');
cy.get('.ant-dropdown')
.not('.ant-dropdown-hidden')
.within(() => {
cy.contains('[role="menuitem"]', new RegExp(`^${filterValue}$`)).click();
});
cy.get('.cvat-filters-modal').within(() => {
cy.contains('button', 'Submit').click();
});
});

@ -6,6 +6,7 @@ require('./commands');
require('./commands_projects'); require('./commands_projects');
require('./commands_review_pipeline'); require('./commands_review_pipeline');
require('./commands_canvas3d'); require('./commands_canvas3d');
require('./commands_filters_feature');
require('@cypress/code-coverage/support'); require('@cypress/code-coverage/support');
require('cypress-plugin-tab'); require('cypress-plugin-tab');

Loading…
Cancel
Save