Fixed some of tests

cvat-ui/src/components/annotation-page/standard-workspace/objects-side-bar/states-ordering-selector.tsx

@@ -22,6 +22,7 @@ function StatesOrderingSelectorComponent(props: StatesOrderingSelectorComponentP
             <Text strong>Sort by</Text>
             <Select
                 className='cvat-objects-sidebar-ordering-selector'
+                dropdownClassName='cvat-objects-sidebar-ordering-dropdown'
                 value={statesOrdering}
                 onChange={changeStatesOrdering}
             >

cvat-ui/src/components/annotation-page/top-bar/right-group.tsx

@@ -43,7 +43,12 @@ function RightGroup(props: Props): JSX.Element {
                 Info
             </Button>
             <div>
-                <Select className='cvat-workspace-selector' onChange={changeWorkspace} value={workspace}>
+                <Select
+                    dropdownClassName='cvat-workspace-selector-dropdown'
+                    className='cvat-workspace-selector'
+                    onChange={changeWorkspace}
+                    value={workspace}
+                >
                     {Object.values(Workspace).map((ws) => (
                         <Select.Option key={ws} value={ws}>
                             {ws}

cvat-ui/src/components/create-task-page/advanced-configuration-form.tsx

@@ -134,7 +134,6 @@ class AdvancedConfigurationForm extends React.PureComponent<Props> {
     public submit(): Promise<void> {
         const { onSubmit } = this.props;
         if (this.formRef.current) {
-            this.formRef.current.resetFields();
             return this.formRef.current.validateFields().then(
                 (values: Store): Promise<void> => {
                     const frameFilter = values.frameStep ? `step=${values.frameStep}` : undefined;

cvat-ui/src/components/label-selector/label-selector.tsx

@@ -25,12 +25,13 @@ export default function LabelSelector(props: Props): JSX.Element {
 
     return (
         <Select
+            virtual={false}
             {...rest}
             {...dinamicProps}
             showSearch
             filterOption={(input: string, option?: OptionData | OptionGroupData) => {
                 if (option) {
-                    const { children } = option.props;
+                    const { children } = option;
                     if (typeof children === 'string') {
                         return children.toLowerCase().includes(input.toLowerCase());
                     }

cvat-ui/src/components/labels-editor/label-form.tsx

@@ -327,7 +327,7 @@ export default class LabelForm extends React.Component<Props> {
                     <Row
                         justify='space-between'
                         align='middle'
-                        cvat-attribute-id={key}
+                        cvat-attribute-id={fieldValue.id}
                         className='cvat-attribute-inputs-wrapper'
                     >
                         <Col span={5}>{this.renderAttributeNameInput(fieldInstance, attr)}</Col>

tests/cypress/integration/actions_tasks_objects/case_16_z_order_features.js

@@ -38,17 +38,18 @@ context('Actions on polygon', () => {
     });
 
     describe(`Testing case "${caseId}"`, () => {
-
         it('Create a first polygon shape', () => {
             cy.createPolygon(createPolygonShapeFirst);
         });
 
         it('Increase z-layer with a special switcher', () => {
             cy.get('.cvat-canvas-z-axis-wrapper').within(() => {
-                cy.get('[role="slider"]').should('have.attr', 'aria-valuenow').then($zLayer=> {
-                    zLayer = Number($zLayer);
-                });
-                cy.get('i[aria-label="icon: plus-circle"]').click();
+                cy.get('[role="slider"]')
+                    .should('have.attr', 'aria-valuenow')
+                    .then(($zLayer) => {
+                        zLayer = Number($zLayer);
+                    });
+                cy.get('span[aria-label="plus-circle"]').click();
                 cy.get('[role="slider"]').should('have.attr', 'aria-valuenow', zLayer + 1);
             });
         });
@@ -61,22 +62,25 @@ context('Actions on polygon', () => {
             cy.get('.cvat-canvas-container').click();
         });
 
-        it('Second shape is over the first shape', () => {
+        it('Second shape is over the first shape', () => {
             // The larger the index of an element in the array the closer it is to us
-            cy.get('.cvat_canvas_shape').then($canvasShape => {
-                expect(Number($canvasShape[1].id.match(/\d+$/))).to.be.equal(2);
+            cy.get('.cvat_canvas_shape').then(($canvasShape) => {
+                expect(Number($canvasShape[1].id.match(/\d+$/))).to.be.equal(2);
             });
         });
 
-        it('Activate first shape', () => {
+        it('Activate first shape', () => {
             cy.get('#cvat_canvas_shape_1').trigger('mousemove').trigger('mouseover');
         });
 
-        it('First shape is over the second shape', () => {
+        it('First shape is over the second shape', () => {
             // The larger the index of an element in the array the closer it is to us
-            cy.get('.cvat_canvas_shape').then($canvasShape => {
-                expect(Number($canvasShape[1].id.match(/\d+$/))).to.be.equal(1);
-                assert.isAbove(Number($canvasShape.eq(-1).attr('fill-opacity')), Number($canvasShape.eq(0).attr('fill-opacity')));
+            cy.get('.cvat_canvas_shape').then(($canvasShape) => {
+                expect(Number($canvasShape[1].id.match(/\d+$/))).to.be.equal(1);
+                assert.isAbove(
+                    Number($canvasShape.eq(-1).attr('fill-opacity')),
+                    Number($canvasShape.eq(0).attr('fill-opacity')),
+                );
             });
         });
 
@@ -97,10 +101,12 @@ context('Actions on polygon', () => {
 
         it('Increase z-layer with a special switcher', () => {
             cy.get('.cvat-canvas-z-axis-wrapper').within(() => {
-                cy.get('[role="slider"]').should('have.attr', 'aria-valuenow').then($zLayer=> {
-                    zLayer = Number($zLayer);
-                });
-                cy.get('i[aria-label="icon: plus-circle"]').click();
+                cy.get('[role="slider"]')
+                    .should('have.attr', 'aria-valuenow')
+                    .then(($zLayer) => {
+                        zLayer = Number($zLayer);
+                    });
+                cy.get('span[aria-label="plus-circle"]').click();
                 cy.get('[role="slider"]').should('have.attr', 'aria-valuenow', zLayer + 2);
             });
         });

tests/cypress/integration/actions_tasks_objects/case_17_lock_hide_features.js

@@ -32,7 +32,7 @@ context('Lock/hide features.', () => {
         firstX: 260,
         firstY: 200,
         secondX: 360,
-        secondY: 250
+        secondY: 250,
     };
     const createCuboidShape4Points = {
         points: 'By 4 Points',
@@ -61,9 +61,7 @@ context('Lock/hide features.', () => {
     const createPointsShapeSwitchLabel = {
         type: 'Shape',
         labelName: newLabelName2,
-        pointsMap: [
-            { x: 700, y: 200 }
-        ],
+        pointsMap: [{ x: 700, y: 200 }],
         complete: true,
         numberOfPoints: null,
     };
@@ -108,7 +106,7 @@ context('Lock/hide features.', () => {
         it('Draw several objects (different shapes, tracks, tags, labels)', () => {
             cy.createPolygon(createPolygonShape);
             // Get css "background-color" for further comparison.
-            cy.get('#cvat-objects-sidebar-state-item-1').then($cvatObjectsSidebarStateItem1 => {
+            cy.get('#cvat-objects-sidebar-state-item-1').then(($cvatObjectsSidebarStateItem1) => {
                 cvatObjectsSidebarStateItem1 = $cvatObjectsSidebarStateItem1.css('background-color');
             });
             cy.createRectangle(createRectangleTrack2Points);
@@ -121,9 +119,9 @@ context('Lock/hide features.', () => {
         });
         it('Lock all the objects with a dedicated button (in side bar header). All the objects are locked.', () => {
             cy.get('.cvat-objects-sidebar-states-header').within(() => {
-                cy.get('i[aria-label="icon: unlock"]').click();
+                cy.get('span[aria-label="unlock"]').click();
             });
-            cy.get('.cvat-objects-sidebar-state-item').each(item => {
+            cy.get('.cvat-objects-sidebar-state-item').each((item) => {
                 cy.get(item).within(() => {
                     cy.get('.cvat-object-item-button-lock-enabled').should('exist');
                 });
@@ -131,59 +129,68 @@ context('Lock/hide features.', () => {
         });
         it('Hide all the objects. Objects are still visible because they cannot be hidden while locked.', () => {
             cy.get('.cvat-objects-sidebar-states-header').within(() => {
-                cy.get('i[aria-label="icon: eye-invisible"]').click();
+                cy.get('span[aria-label="eye-invisible"]').click();
             });
-            cy.get('.cvat-objects-sidebar-state-item').each(item => {
+            cy.get('.cvat-objects-sidebar-state-item').each((item) => {
                 cy.get(item).within(() => {
                     cy.get('.cvat-object-item-button-hidden-enabled').should('not.exist');
                 });
             });
-            cy.get('.cvat_canvas_shape').each(item => {
+            cy.get('.cvat_canvas_shape').each((item) => {
                 cy.get(item).should('be.visible');
             });
         });
         it('Unlock all objects and hide all objects. All the objects are hidden.', () => {
             cy.get('.cvat-objects-sidebar-states-header').within(() => {
-                cy.get('i[aria-label="icon: lock"]').click();
-                cy.get('i[aria-label="icon: eye"]').click();
-            });
-            cy.get('.cvat-objects-sidebar-state-item').each(item => {
-                cy.get(item).invoke('text').then($itemText => {
-                    // Sidebar for "Tag" doesn't have "Switch hidden property" button.
-                    if (!$itemText.match(/\d+TAG/)) {
-                        cy.get(item).within(() => {
-                            cy.get('.cvat-object-item-button-hidden-enabled').should('exist');
-                        });
-                    }
-                });
+                cy.get('span[aria-label="lock"]').click();
+                cy.get('span[aria-label="eye"]').click();
+            });
+            cy.get('.cvat-objects-sidebar-state-item').each((item) => {
+                cy.get(item)
+                    .invoke('text')
+                    .then(($itemText) => {
+                        // Sidebar for "Tag" doesn't have "Switch hidden property" button.
+                        if (!$itemText.match(/\d+TAG/)) {
+                            cy.get(item).within(() => {
+                                cy.get('.cvat-object-item-button-hidden-enabled').should('exist');
+                            });
+                        }
+                    });
             });
-            cy.get('.cvat_canvas_shape').each(item => {
+            cy.get('.cvat_canvas_shape').each((item) => {
                 cy.get(item).should('have.class', 'cvat_canvas_hidden');
             });
         });
         it('Set properties occluded & pinned to true for a shape. Shape is occluded is visualized (dashed contour) and the shape cannot be moved, but can be resized.', () => {
             // Unhide rectangle shape.
             cy.get('#cvat-objects-sidebar-state-item-6').within(() => {
-                cy.get('i[aria-label="icon: eye-invisible"]').click();
+                cy.get('span[aria-label="eye-invisible"]').click();
             });
             cy.get('#cvat_canvas_shape_6').should('be.visible');
             cy.get('#cvat-objects-sidebar-state-item-6').within(() => {
-                cy.get('.cvat-object-item-button-occluded').click().should('have.class', 'cvat-object-item-button-occluded-enabled');
+                cy.get('.cvat-object-item-button-occluded').click();
             });
             cy.get('#cvat_canvas_shape_6').should('have.css', 'stroke-dasharray');
             cy.get('#cvat-objects-sidebar-state-item-6').within(() => {
-                cy.get('.cvat-object-item-button-pinned').click().should('have.class', 'cvat-object-item-button-pinned-enabled');
+                cy.get('.cvat-object-item-button-pinned').click();
             });
             cy.get('#cvat_canvas_shape_6').should('not.have.class', 'cvat_canvas_shape_draggable');
             // Get cuttent values for "width" parameter.
-            cy.get('#cvat_canvas_shape_6').should('have.attr', 'width').then($shapeWidth => {
-                shapeWidth = $shapeWidth;
-            });
+            cy.get('#cvat_canvas_shape_6')
+                .should('have.attr', 'width')
+                .then(($shapeWidth) => {
+                    shapeWidth = $shapeWidth;
+                });
             // Resize rectangle shape.
-            cy.get('.cvat-canvas-container').trigger('mousedown', 650, 400, {button: 0}).trigger('mousemove', 660, 400).trigger('mouseup');
-            cy.get('#cvat_canvas_shape_6').should('have.attr', 'width').then($shapeWidth => {
-                expect(Math.floor(shapeWidth)).to.be.lessThan(Math.floor($shapeWidth)); // expected 95 to be below 104
-            });
+            cy.get('.cvat-canvas-container')
+                .trigger('mousedown', 650, 400, { button: 0 })
+                .trigger('mousemove', 660, 400)
+                .trigger('mouseup');
+            cy.get('#cvat_canvas_shape_6')
+                .should('have.attr', 'width')
+                .then(($shapeWidth) => {
+                    expect(Math.floor(shapeWidth)).to.be.lessThan(Math.floor($shapeWidth)); // expected 95 to be below 104
+                });
         });
         it('Go to polygon. Pinned is set to true by default. Set it to false. Polygon can be moved.', () => {
             cy.get('#cvat-objects-sidebar-state-item-1').within(() => {
@@ -191,17 +198,17 @@ context('Lock/hide features.', () => {
             });
             cy.get('#cvat_canvas_shape_1').should('not.have.class', 'cvat_canvas_shape_draggable');
             cy.get('#cvat-objects-sidebar-state-item-1').within(() => {
-                cy.get('.cvat-object-item-button-pinned').click().should('not.have.class', 'cvat-object-item-button-pinned-enabled');
+                cy.get('.cvat-object-item-button-pinned').click();
                 // Unhide polygon shape.
-                cy.get('.cvat-object-item-button-hidden').click().should('not.have.class', 'cvat-object-item-button-hidden-enabled');
+                cy.get('.cvat-object-item-button-hidden').click();
             });
             cy.get('#cvat_canvas_shape_1').should('have.class', 'cvat_canvas_shape_draggable');
         });
         it('Go to "Labels" tab.', () => {
             // Hide and unhide all objects for convenience of next testing.
             cy.get('.cvat-objects-sidebar-states-header').within(() => {
-                cy.get('i[aria-label="icon: eye"]').click();
-                cy.get('i[aria-label="icon: eye-invisible"]').click();
+                cy.get('span[aria-label="eye"]').click();
+                cy.get('span[aria-label="eye-invisible"]').click();
             });
             cy.get('.cvat-objects-sidebar').within(() => {
                 cy.contains('Labels').click();
@@ -211,13 +218,15 @@ context('Lock/hide features.', () => {
             const objectsSameLabel = ['cvat_canvas_shape_1', 'cvat_canvas_shape_2', 'cvat_canvas_shape_3'];
             cy.get('.cvat-objects-sidebar-labels-list').within(() => {
                 // Hide and lock all object with "Main task" label (#cvat_canvas_shape_1-3).
-                cy.contains(labelName).parents('.cvat-objects-sidebar-label-item').within(() => {
-                    cy.get('.cvat-label-item-button-hidden').click().should('have.class', 'cvat-label-item-button-hidden-enabled');
-                    cy.get('.cvat-label-item-button-lock').click().should('have.class', 'cvat-label-item-button-lock-enabled');
-                });
+                cy.contains(labelName)
+                    .parents('.cvat-objects-sidebar-label-item')
+                    .within(() => {
+                        cy.get('.cvat-label-item-button-hidden').click();
+                        cy.get('.cvat-label-item-button-lock').click();
+                    });
             });
-            cy.get('.cvat_canvas_shape').then(objectList => {
-                for (let i=0; i<objectList.length; i++) {
+            cy.get('.cvat_canvas_shape').then((objectList) => {
+                for (let i = 0; i < objectList.length; i++) {
                     // Checking whether the class exists on all objects except for objects with the "Main task" label.
                     if (!objectsSameLabel.includes(objectList[i].id)) {
                         cy.get(objectList[i]).should('not.have.class', 'cvat_canvas_hidden');
@@ -229,15 +238,19 @@ context('Lock/hide features.', () => {
                 cy.contains('Objects').click();
             });
             // Objects that have a label different from the "Main task" should not be blocked.
-            cy.get('.cvat-objects-sidebar-state-item').then(objectSidebarList => {
-                for (let i=0; i<objectSidebarList.length; i++) {
+            cy.get('.cvat-objects-sidebar-state-item').then((objectSidebarList) => {
+                for (let i = 0; i < objectSidebarList.length; i++) {
                     if (!objectSidebarList[i].textContent.match(new RegExp(`${labelName}`, 'g'))) {
                         cy.get(objectSidebarList[i]).within(() => {
-                            cy.get('.ant-select-selection-selected-value').click({force: true});
+                            cy.get('.ant-select-selection-item').click({ force: true });
                         });
-                        cy.get('.ant-select-dropdown-menu').last().contains(labelName).click({force: true});
+                        cy.get('.ant-select-dropdown').last().contains(labelName).click({ force: true });
                         // Checking that the css parameter "background-color" has become the same as the ".cvat-objects-sidebar-state-item" with "Main task" label.
-                        cy.get(objectSidebarList[i]).should('have.css', 'background-color', cvatObjectsSidebarStateItem1);
+                        cy.get(objectSidebarList[i]).should(
+                            'have.css',
+                            'background-color',
+                            cvatObjectsSidebarStateItem1,
+                        );
                     }
                 }
             });

tests/cypress/integration/actions_tasks_objects/case_23_canvas_grid_feature.js

@@ -32,8 +32,9 @@ context('Canvas grid feature', () => {
             cy.get('.cvat-player-settings-grid-color-input').click();
             cy.get('.ant-select-dropdown')
                 .not('.ant-select-dropdown-hidden')
-                .contains(new RegExp(`^${gridColor}$`, 'g'))
-                .click();
+                .within(() => {
+                    cy.get(`.ant-select-item-option[title="${gridColor}"]`).click();
+                });
         });
         it('Set "Grid opacity" to 49%.', () => {
             cy.get('.cvat-player-settings-grid-opacity-input')

tests/cypress/integration/actions_tasks_objects/issue_1429_check_new_label.js

@@ -38,8 +38,8 @@ context('Check if the new label reflects in the options', () => {
             cy.createRectangle(createRectangleShape2Points);
         });
         it('Checking for the new label', () => {
-            cy.get('#cvat-objects-sidebar-state-item-1').find('.ant-select-selection').click();
-            cy.get('.ant-select-dropdown-menu-item').should('contain', newLabelName);
+            cy.get('#cvat-objects-sidebar-state-item-1').find('.ant-select-selector').click();
+            cy.get('.ant-select-dropdown').not('.ant-select-dropdown-hidden').should('contain', newLabelName);
         });
     });
 });

tests/cypress/integration/actions_tasks_objects/issue_1498_message_ui_raw_labels_wrong.js

@@ -37,7 +37,7 @@ context('Message in UI when raw labels are wrong.', () => {
 
     describe(`Testing issue "${issueId}"`, () => {
         it('"Raw" field is empty.', () => {
-            cy.get('.ant-form-explain')
+            cy.get('.ant-form-item-explain')
                 .should('exist')
                 .invoke('text')
                 .then(($explainText) => {
@@ -49,7 +49,7 @@ context('Message in UI when raw labels are wrong.', () => {
             taskRawNameNumber[0].name = 1;
             let jsonNameNumber = JSON.stringify(taskRawNameNumber);
             cy.get('#labels').type(jsonNameNumber, { parseSpecialCharSequences: false });
-            cy.get('.ant-form-explain')
+            cy.get('.ant-form-item-explain')
                 .should('exist')
                 .invoke('text')
                 .then(($explainText) => {
@@ -61,7 +61,7 @@ context('Message in UI when raw labels are wrong.', () => {
             taskRawLabelString[0].id = '1';
             let jsonLabelString = JSON.stringify(taskRawLabelString);
             cy.get('#labels').type(jsonLabelString, { parseSpecialCharSequences: false });
-            cy.get('.ant-form-explain')
+            cy.get('.ant-form-item-explain')
                 .should('exist')
                 .invoke('text')
                 .then(($explainText) => {
@@ -73,7 +73,7 @@ context('Message in UI when raw labels are wrong.', () => {
             taskRawAttrNumber[0].attributes = 1;
             let jsonAttrNumber = JSON.stringify(taskRawAttrNumber);
             cy.get('#labels').type(jsonAttrNumber, { parseSpecialCharSequences: false });
-            cy.get('.ant-form-explain')
+            cy.get('.ant-form-item-explain')
                 .should('exist')
                 .invoke('text')
                 .then(($explainText) => {
@@ -85,7 +85,7 @@ context('Message in UI when raw labels are wrong.', () => {
             taskRawColorNumber[0].color = 1;
             let jsonColorNumber = JSON.stringify(taskRawColorNumber);
             cy.get('#labels').type(jsonColorNumber, { parseSpecialCharSequences: false });
-            cy.get('.ant-form-explain')
+            cy.get('.ant-form-item-explain')
                 .should('exist')
                 .invoke('text')
                 .then(($explainText) => {
@@ -97,7 +97,7 @@ context('Message in UI when raw labels are wrong.', () => {
             taskRawAttrIdString[0].attributes[0].id = '1';
             let jsonAttrIdString = JSON.stringify(taskRawAttrIdString);
             cy.get('#labels').type(jsonAttrIdString, { parseSpecialCharSequences: false });
-            cy.get('.ant-form-explain')
+            cy.get('.ant-form-item-explain')
                 .should('exist')
                 .invoke('text')
                 .then(($explainText) => {
@@ -111,7 +111,7 @@ context('Message in UI when raw labels are wrong.', () => {
                 taskRawAttrTypeNumber[0].attributes[0].input_type = type;
                 let jsonAttrTypeNumber = JSON.stringify(taskRawAttrTypeNumber);
                 cy.get('#labels').type(jsonAttrTypeNumber, { parseSpecialCharSequences: false });
-                cy.get('.ant-form-explain')
+                cy.get('.ant-form-item-explain')
                     .should('exist')
                     .invoke('text')
                     .then(($explainText) => {
@@ -125,7 +125,7 @@ context('Message in UI when raw labels are wrong.', () => {
             taskRawAttrMutableNumber[0].attributes[0].mutable = 1;
             let jsonAttrMutableNumber = JSON.stringify(taskRawAttrMutableNumber);
             cy.get('#labels').type(jsonAttrMutableNumber, { parseSpecialCharSequences: false });
-            cy.get('.ant-form-explain')
+            cy.get('.ant-form-item-explain')
                 .should('exist')
                 .invoke('text')
                 .then(($explainText) => {
@@ -137,7 +137,7 @@ context('Message in UI when raw labels are wrong.', () => {
             taskRawAttrValuesNumber[0].attributes[0].values = 1;
             let jsonAttrValueNumber = JSON.stringify(taskRawAttrValuesNumber);
             cy.get('#labels').type(jsonAttrValueNumber, { parseSpecialCharSequences: false });
-            cy.get('.ant-form-explain')
+            cy.get('.ant-form-item-explain')
                 .should('exist')
                 .invoke('text')
                 .then(($explainText) => {
@@ -149,7 +149,7 @@ context('Message in UI when raw labels are wrong.', () => {
             taskRawAttrValuesNumberArr[0].attributes[0].values = [1];
             let jsonAttrValuesNumberArr = JSON.stringify(taskRawAttrValuesNumberArr);
             cy.get('#labels').type(jsonAttrValuesNumberArr, { parseSpecialCharSequences: false });
-            cy.get('.ant-form-explain')
+            cy.get('.ant-form-item-explain')
                 .should('exist')
                 .invoke('text')
                 .then(($explainText) => {
@@ -161,7 +161,7 @@ context('Message in UI when raw labels are wrong.', () => {
             taskRawAttrNameNumber[0].attributes[0].name = 1;
             let jsonAttrNameNumber = JSON.stringify(taskRawAttrNameNumber);
             cy.get('#labels').type(jsonAttrNameNumber, { parseSpecialCharSequences: false });
-            cy.get('.ant-form-explain')
+            cy.get('.ant-form-item-explain')
                 .should('exist')
                 .invoke('text')
                 .then(($explainText) => {
@@ -173,7 +173,7 @@ context('Message in UI when raw labels are wrong.', () => {
             taskRawAttrValuesEmptyArr[0].attributes[0].values = [];
             let jsonAttrValuesEmptyArr = JSON.stringify(taskRawAttrValuesEmptyArr);
             cy.get('#labels').type(jsonAttrValuesEmptyArr, { parseSpecialCharSequences: false });
-            cy.get('.ant-form-explain')
+            cy.get('.ant-form-item-explain')
                 .should('exist')
                 .invoke('text')
                 .then(($explainText) => {

tests/cypress/integration/actions_tasks_objects/issue_1568_cuboid_dump_annotation.js

@@ -43,9 +43,9 @@ context('Dump annotation if cuboid created', () => {
             cy.get('.cvat-menu-dump-submenu-item').within(() => {
                 cy.contains('Datumaro').click();
             });
+            cy.wait(3000);
         });
-        it('Error notification is ot exists', () => {
-            cy.wait(5000);
+        it('Error notification is not exists', () => {
             cy.get('.ant-notification-notice').should('not.exist');
         });
     });

tests/cypress/integration/actions_tasks_objects/issue_1750_err_aam_switch_frames.js

@@ -58,7 +58,7 @@ context('An error occurs in AAM when switching to 2 frames, if the frames have o
                 .click({ force: true });
         });
         it('Page with the error is missing', () => {
-            cy.contains('Oops, something went wrong').should('not.exist');
+            cy.contains('Oops, something went wrong', { timeout: 1000 }).should('not.exist');
             cy.changeLabelAAM(labelName);
             cy.get('.attribute-annotation-sidebar-object-switcher').should('contain', `${labelName} 2 [2/2]`);
         });

tests/cypress/integration/actions_tasks_objects/issue_2411_deleting_attributes.js

@@ -8,47 +8,29 @@ context('Wrong attribute is removed in label constructor.', () => {
     const issueId = '2411';
     const taskRaw = [
         {
-            name: "person",
-            color: "#ff6037",
+            name: 'person',
+            color: '#ff6037',
             attributes: [
-            {
-                name: "lower_body",
-                input_type: "select",
-                mutable: true,
-                values: [
-                    "__undefined__",
-                    "long",
-                    "short",
-                    "n/a"
-                ]
-            },
-            {
-                name: "hair_color",
-                input_type: "select",
-                mutable: true,
-                values: [
-                    "__undefined__",
-                    "black",
-                    "brown",
-                    "blond",
-                    "grey",
-                    "other",
-                    "n/a"
-                ]
-            },
-            {
-                name: "cellphone",
-                input_type: "select",
-                mutable: true,
-                values: [
-                    "__undefined__",
-                    "yes",
-                    "no",
-                    "n/a"
-                ]
-            }
-            ]
-        }
+                {
+                    name: 'lower_body',
+                    input_type: 'select',
+                    mutable: true,
+                    values: ['__undefined__', 'long', 'short', 'n/a'],
+                },
+                {
+                    name: 'hair_color',
+                    input_type: 'select',
+                    mutable: true,
+                    values: ['__undefined__', 'black', 'brown', 'blond', 'grey', 'other', 'n/a'],
+                },
+                {
+                    name: 'cellphone',
+                    input_type: 'select',
+                    mutable: true,
+                    values: ['__undefined__', 'yes', 'no', 'n/a'],
+                },
+            ],
+        },
     ];
 
     before(() => {
@@ -67,43 +49,65 @@ context('Wrong attribute is removed in label constructor.', () => {
         });
         it('Go to constructor tab. The label "person" appeared there.', () => {
             cy.get('[role="tab"]').contains('Constructor').click();
-            cy.get('.cvat-constructor-viewer-item').should('have.text', 'person').within(() => {
-                cy.get('i[aria-label="icon: edit"]').click();
-            });
+            cy.get('.cvat-constructor-viewer-item')
+                .should('have.text', 'person')
+                .within(() => {
+                    cy.get('span[aria-label="edit"]').click();
+                });
         });
         it('Remove the average attribute "hair_color". It has been deleted.', () => {
             cy.get('.cvat-label-constructor-updater').within(() => {
-                cy.get('.ant-row-flex-space-between').eq(1).within(() => {
-                    cy.get('[placeholder="Name"]').invoke('val').then(placeholderNameValue => {
-                        expect(placeholderNameValue).to.be.equal('hair_color');
+                cy.get('.cvat-attribute-inputs-wrapper')
+                    .eq(1)
+                    .within(() => {
+                        cy.get('.cvat-attribute-name-input')
+                            .invoke('val')
+                            .then((placeholderNameValue) => {
+                                expect(placeholderNameValue).to.be.equal('hair_color');
+                            });
+                        cy.get('.cvat-delete-attribute-button').click();
                     });
-                    cy.get('.cvat-delete-attribute-button').click();
-                });
-                cy.get('.ant-row-flex-space-between').eq(0).within(() => {
-                    cy.get('[placeholder="Name"]').invoke('val').then(placeholderNameValue => {
-                        expect(placeholderNameValue).to.be.equal('cellphone');
+                cy.get('.cvat-attribute-inputs-wrapper')
+                    .eq(0)
+                    .within(() => {
+                        cy.get('.cvat-attribute-name-input')
+                            .invoke('val')
+                            .then((placeholderNameValue) => {
+                                expect(placeholderNameValue).to.be.equal('lower_body');
+                            });
                     });
-                });
-                cy.get('.ant-row-flex-space-between').eq(1).within(() => {
-                    cy.get('[placeholder="Name"]').invoke('val').then(placeholderNameValue => {
-                        expect(placeholderNameValue).to.be.equal('lower_body');
+                cy.get('.cvat-attribute-inputs-wrapper')
+                    .eq(1)
+                    .within(() => {
+                        cy.get('.cvat-attribute-name-input')
+                            .invoke('val')
+                            .then((placeholderNameValue) => {
+                                expect(placeholderNameValue).to.be.equal('cellphone');
+                            });
                     });
-                });
             });
         });
         it('Remove the latest attribute "lower_body". It has been deleted.', () => {
             cy.get('.cvat-label-constructor-updater').within(() => {
-                cy.get('.ant-row-flex-space-between').eq(1).within(() => {
-                    cy.get('[placeholder="Name"]').invoke('val').then(placeholderNameValue => {
-                        expect(placeholderNameValue).to.be.equal('lower_body');
+                cy.get('.cvat-attribute-inputs-wrapper')
+                    .eq(1)
+                    .within(() => {
+                        cy.get('.cvat-attribute-name-input')
+                            .invoke('val')
+                            .then((placeholderNameValue) => {
+                                expect(placeholderNameValue).to.be.equal('cellphone');
+                            });
+                        cy.get('.cvat-delete-attribute-button').click();
                     });
-                    cy.get('.cvat-delete-attribute-button').click();
-                });
-                cy.get('.ant-row-flex-space-between').eq(0).within(() => {
-                    cy.get('[placeholder="Name"]').invoke('val').then(placeholderNameValue => {
-                        expect(placeholderNameValue).to.be.equal('cellphone');
+                cy.get('.cvat-attribute-inputs-wrapper')
+                    .eq(0)
+                    .within(() => {
+                        cy.get('.cvat-attribute-name-input')
+                            .invoke('val')
+                            .then((placeholderNameValue) => {
+                                expect(placeholderNameValue).to.be.equal('lower_body');
+                            });
                     });
-                });
             });
         });
     });

tests/cypress/integration/actions_tasks_objects/issue_2418_object_tag_same_labels.js

@@ -37,9 +37,7 @@ context('Check hide/unhide functionality from label tab for object and tag with
                 cy.contains(labelName)
                     .parents('.cvat-objects-sidebar-label-item')
                     .within(() => {
-                        cy.get('.cvat-label-item-button-hidden')
-                            .click()
-                            .should('have.class', 'cvat-label-item-button-hidden-enabled');
+                        cy.get('.cvat-label-item-button-hidden').click();
                     });
             });
             cy.get('#cvat_canvas_shape_1').should('be.hidden');
@@ -49,9 +47,7 @@ context('Check hide/unhide functionality from label tab for object and tag with
                 cy.contains(labelName)
                     .parents('.cvat-objects-sidebar-label-item')
                     .within(() => {
-                        cy.get('.cvat-label-item-button-hidden')
-                            .click()
-                            .should('not.have.class', 'cvat-label-item-button-hidden-enabled');
+                        cy.get('.cvat-label-item-button-hidden').click();
                     });
             });
             cy.get('#cvat_canvas_shape_1').should('be.visible');

tests/cypress/integration/actions_users/issue_2440_value_must_be_a_user_instance.js

@@ -20,8 +20,9 @@ context('Value must be a user instance.', () => {
             });
             cy.get('.ant-select-dropdown')
                 .not('.ant-select-dropdown-hidden')
-                .contains(new RegExp(`^${Cypress.env('user')}$`, 'g'))
-                .click();
+                .within(() => {
+                    cy.get(`.ant-select-item-option[title="${Cypress.env('user')}"]`).click();
+                });
             cy.get('.cvat-spinner').should('exist');
         });
         it('Assign the task to the same user again', () => {
@@ -30,8 +31,9 @@ context('Value must be a user instance.', () => {
             });
             cy.get('.ant-select-dropdown')
                 .not('.ant-select-dropdown-hidden')
-                .contains(new RegExp(`^${Cypress.env('user')}$`, 'g'))
-                .click();
+                .within(() => {
+                    cy.get(`.ant-select-item-option[title="${Cypress.env('user')}"]`).click();
+                });
             // Before fix:
             // The following error originated from your application code, not from Cypress.
             // > Value must be a user instance

tests/cypress/integration/auth_page.js

@@ -27,6 +27,6 @@ describe('Check server availability', () => {
 
     it('Click to "Sign in" button', () => {
         cy.get('[type="submit"]').click();
-        cy.wait(10000);
+        cy.wait(1000);
     });
 });

tests/cypress/support/commands.js

@@ -60,8 +60,8 @@ Cypress.Commands.add(
             cy.get('[placeholder="Label name"]').type(labelName);
             cy.get('.cvat-new-attribute-button').click();
             cy.get('[placeholder="Name"]').type(attrName);
-            cy.get('div[title="Select"]').click();
-            cy.get('li').contains('Text').click();
+            cy.get('.cvat-attribute-type-input').click();
+            cy.get('.ant-select-item-option').contains('Text').click();
             cy.get('[placeholder="Default value"]').type(textDefaultValue);
             if (multiAttrParams) {
                 cy.updateAttributes(multiAttrParams);
@@ -72,8 +72,9 @@ Cypress.Commands.add(
                 cy.get('.cvat-project-search-field').click();
                 cy.get('.ant-select-dropdown')
                     .not('.ant-select-dropdown-hidden')
-                    .contains(new RegExp(`^${projectName}$`, 'g'))
-                    .click();
+                    .within(() => {
+                        cy.get(`.ant-select-item-option[title="${projectName}"]`).click();
+                    });
             }
             cy.get('.cvat-project-search-field').within(() => {
                 cy.get('[type="text"]').should('have.value', projectName);
@@ -130,7 +131,7 @@ Cypress.Commands.add('createRectangle', (createRectangleParams) => {
     cy.contains('Draw new rectangle')
         .parents('.cvat-draw-shape-popover-content')
         .within(() => {
-            cy.get('.ant-select-selection-selected-value').then(($labelValue) => {
+            cy.get('.ant-select-selection-item').then(($labelValue) => {
                 selectedValueGlobal = $labelValue.text();
             });
             cy.get('.ant-radio-wrapper').contains(createRectangleParams.points).click();
@@ -151,12 +152,13 @@ Cypress.Commands.add('switchLabel', (labelName, objectType) => {
     cy.contains(regex)
         .parents('.cvat-draw-shape-popover-content')
         .within(() => {
-            cy.get('.ant-select-selection-selected-value').click();
+            cy.get('.ant-select-selection-item').click();
         });
     cy.get('.ant-select-dropdown')
         .not('.ant-select-dropdown-hidden')
-        .contains(new RegExp(`^${labelName}$`, 'g'))
-        .click();
+        .within(() => {
+            cy.get(`.ant-select-item-option[title="${labelName}"]`).click();
+        });
 });
 
 Cypress.Commands.add('checkObjectParameters', (objectParameters, objectType) => {
@@ -172,7 +174,7 @@ Cypress.Commands.add('checkObjectParameters', (objectParameters, objectType) =>
             .should('contain', maxId)
             .and('contain', `${objectType} ${objectParameters.type.toUpperCase()}`)
             .within(() => {
-                cy.get('.ant-select-selection-selected-value').should('have.text', selectedValueGlobal);
+                cy.get('.ant-select-selection-item').should('have.text', selectedValueGlobal);
             });
     });
 });
@@ -183,7 +185,7 @@ Cypress.Commands.add('createPoint', (createPointParams) => {
     cy.contains('Draw new points')
         .parents('.cvat-draw-shape-popover-content')
         .within(() => {
-            cy.get('.ant-select-selection-selected-value').then(($labelValue) => {
+            cy.get('.ant-select-selection-item').then(($labelValue) => {
                 selectedValueGlobal = $labelValue.text();
             });
             if (createPointParams.numberOfPoints) {
@@ -225,7 +227,7 @@ Cypress.Commands.add('createPolygon', (createPolygonParams) => {
         cy.contains('Draw new polygon')
             .parents('.cvat-draw-shape-popover-content')
             .within(() => {
-                cy.get('.ant-select-selection-selected-value').then(($labelValue) => {
+                cy.get('.ant-select-selection-item').then(($labelValue) => {
                     selectedValueGlobal = $labelValue.text();
                 });
                 if (createPolygonParams.numberOfPoints) {
@@ -259,7 +261,10 @@ Cypress.Commands.add('closeSettings', () => {
 
 Cypress.Commands.add('changeWorkspace', (mode, labelName) => {
     cy.get('.cvat-workspace-selector').click();
-    cy.get('.ant-select-dropdown-menu-item').contains(mode).click();
+    cy.get('.cvat-workspace-selector-dropdown').within(() => {
+        cy.get(`.ant-select-item-option[title="${mode}"]`).click();
+    });
+
     cy.get('.cvat-workspace-selector').should('contain.text', mode);
     cy.changeLabelAAM(labelName);
 });
@@ -269,12 +274,13 @@ Cypress.Commands.add('changeLabelAAM', (labelName) => {
         const cvatWorkspaceSelectorValue = value.text();
         if (cvatWorkspaceSelectorValue === 'Attribute annotation') {
             cy.get('.attribute-annotation-sidebar-basics-editor').within(() => {
-                cy.get('.ant-select-selection').click();
+                cy.get('.ant-select-selector').click();
             });
             cy.get('.ant-select-dropdown')
                 .not('.ant-select-dropdown-hidden')
-                .contains(new RegExp(`^${labelName}$`, 'g'))
-                .click();
+                .within(() => {
+                    cy.get(`.ant-select-item-option[title="${labelName}"]`).click();
+                });
         }
     });
 });
@@ -285,7 +291,7 @@ Cypress.Commands.add('createCuboid', (createCuboidParams) => {
     cy.contains('Draw new cuboid')
         .parents('.cvat-draw-shape-popover-content')
         .within(() => {
-            cy.get('.ant-select-selection-selected-value').then(($labelValue) => {
+            cy.get('.ant-select-selection-item').then(($labelValue) => {
                 selectedValueGlobal = $labelValue.text();
             });
             cy.contains(createCuboidParams.points).click();
@@ -317,8 +323,9 @@ Cypress.Commands.add('updateAttributes', (multiAttrParams) => {
         });
         cy.get('.ant-select-dropdown')
             .not('.ant-select-dropdown-hidden')
-            .contains(new RegExp(`^${multiAttrParams.typeAttribute}$`, 'g'))
-            .click();
+            .within(() => {
+                cy.get(`.ant-select-item-option[title="${multiAttrParams.typeAttribute}"]`).click();
+            });
 
         if (multiAttrParams.typeAttribute === 'Text' || multiAttrParams.typeAttribute === 'Number') {
             cy.get(`[cvat-attribute-id="${minId}"]`).within(() => {
@@ -334,8 +341,9 @@ Cypress.Commands.add('updateAttributes', (multiAttrParams) => {
             });
             cy.get('.ant-select-dropdown')
                 .not('.ant-select-dropdown-hidden')
-                .contains(new RegExp(`^.*${multiAttrParams.additionalValue}.*$`, 'g'))
-                .click();
+                .within(() => {
+                    cy.get(`.ant-select-item-option[title="${multiAttrParams.additionalValue}"]`).click();
+                });
         }
     });
 });
@@ -346,7 +354,7 @@ Cypress.Commands.add('createPolyline', (createPolylineParams) => {
     cy.contains('Draw new polyline')
         .parents('.cvat-draw-shape-popover-content')
         .within(() => {
-            cy.get('.ant-select-selection-selected-value').then(($labelValue) => {
+            cy.get('.ant-select-selection-item').then(($labelValue) => {
                 selectedValueGlobal = $labelValue.text();
             });
             if (createPolylineParams.numberOfPoints) {
@@ -407,7 +415,7 @@ Cypress.Commands.add('removeAnnotations', () => {
         cy.contains('Remove annotations').click();
     });
     cy.get('.ant-modal-content').within(() => {
-        cy.get('.ant-btn-danger').click();
+        cy.get('.ant-btn-dangerous').click();
     });
 });
 
@@ -449,10 +457,9 @@ Cypress.Commands.add('createTag', (labelName) => {
 
 Cypress.Commands.add('sidebarItemSortBy', (sortBy) => {
     cy.get('.cvat-objects-sidebar-ordering-selector').click();
-    cy.get('.ant-select-dropdown')
-        .not('.ant-select-dropdown-hidden')
-        .contains(new RegExp(`^${sortBy}$`, 'g'))
-        .click();
+    cy.get('.cvat-objects-sidebar-ordering-dropdown').within(() => {
+        cy.get(`.ant-select-item-option[title="${sortBy}"]`).click();
+    });
 });
 
 Cypress.Commands.add('goToRegisterPage', () => {
@@ -466,8 +473,9 @@ Cypress.Commands.add('assignTaskToUser', (user) => {
     });
     cy.get('.ant-select-dropdown')
         .not('.ant-select-dropdown-hidden')
-        .contains(new RegExp(`^${user}$`, 'g'))
-        .click();
+        .within(() => {
+            cy.get(`.ant-select-item-option[title="${user}"]`).click();
+        });
 });
 
 Cypress.Commands.add('getScaleValue', () => {
@@ -481,13 +489,13 @@ Cypress.Commands.add('getScaleValue', () => {
 Cypress.Commands.add('writeFilterValue', (clear, filterValue) => {
     if (clear) {
         cy.get('.cvat-annotations-filters-input').within(() => {
-            cy.get('.ant-select-selection__choice__remove').click();
+            cy.get('.ant-select-selection-item-remove').click();
         });
     }
     cy.get('.cvat-annotations-filters-input')
         .type(`${filterValue}{Enter}`)
         .within(() => {
-            cy.get('.ant-select-selection__choice__content').should('have.text', filterValue);
+            cy.get('.ant-select-selection-item-content').should('have.text', filterValue);
         });
 });
 

tests/cypress/support/commands_projects.js

@@ -16,8 +16,8 @@ Cypress.Commands.add('createProjects', (projectName, labelName, attrName, textDe
     cy.get('[placeholder="Label name"]').type(labelName);
     cy.get('.cvat-new-attribute-button').click();
     cy.get('[placeholder="Name"]').type(attrName);
-    cy.get('div[title="Select"]').click();
-    cy.get('li').contains('Text').click();
+    cy.get('.cvat-attribute-type-input').click();
+    cy.get('.ant-select-item-option').contains('Text').click();
     cy.get('[placeholder="Default value"]').type(textDefaultValue);
     if (multiAttrParams) {
         cy.updateAttributes(multiAttrParams);
@@ -70,6 +70,7 @@ Cypress.Commands.add('assignProjectToUser', (user) => {
     });
     cy.get('.ant-select-dropdown')
         .not('.ant-select-dropdown-hidden')
-        .contains(new RegExp(`^${user}$`, 'g'))
-        .click();
+        .within(() => {
+            cy.get(`.ant-select-item-option[title="${user}"]`).click();
+        });
 });