Test cases for improved quality UX

cvat-ui/src/components/quality-control/styles.scss

@@ -77,7 +77,7 @@ $excluded-background: #d9d9d973;
     }
 }
 
-.cvat-frame-allocation-actions {
+.cvat-quality-table-header {
     span[role='img'] {
         padding: 0 $grid-unit-size;
     }
@@ -87,7 +87,7 @@ $excluded-background: #d9d9d973;
     }
 }
 
-.cvat-frame-allocation-header {
+.cvat-quality-table-header-title {
     margin-bottom: 0;
     font-size: 20px;
     font-weight: bold;
@@ -120,10 +120,6 @@ $excluded-background: #d9d9d973;
     transform: translate(-50%, -50%);
 }
 
-.cvat-quality-control-overview-tab {
-    min-height: 50vh;
-}
-
 .cvat-annotations-quality-allocation-table-summary {
     margin-bottom: $grid-unit-size * 2;
 

cvat-ui/src/components/quality-control/task-quality/quality-table-header.tsx

@@ -45,12 +45,12 @@ function QualityTableHeader(props: TableHeaderProps): JSX.Element {
     };
 
     return (
-        <Row justify='start' align='middle' className='cvat-frame-allocation-actions'>
+        <Row justify='start' align='middle' className='cvat-quality-table-header'>
             <Col>
-                <Text className='cvat-text-color cvat-frame-allocation-header'>{title}</Text>
+                <Text className='cvat-text-color cvat-quality-table-header-title'>{title}</Text>
             </Col>
             <Col>
-                <DownloadOutlined onClick={handleDownload} />
+                <DownloadOutlined className='cvat-quality-table-dowload-button' onClick={handleDownload} />
             </Col>
             <Col>{actions}</Col>
             {!!onSearch && (

tests/cypress/e2e/features/ground_truth_jobs.js

@@ -356,6 +356,33 @@ context('Ground truth jobs', () => {
             cy.contains('.cvat-allocation-summary-excluded', '0').should('exist');
             cy.contains('.cvat-allocation-summary-active', '3').should('exist');
         });
+
+        it('Check search feature', () => {
+            cy.get('.cvat-quality-table-search-bar input').clear();
+            serverFiles.forEach((file, index) => {
+                cy.get('.cvat-quality-table-search-bar input').type(`image_${index + 1}`);
+                cy.get('.cvat-quality-table-search-bar .ant-input-search-button').click();
+                cy.get('.cvat-allocation-frame-row').should('have.length', 1);
+                cy.get('.cvat-allocation-frame-row').within(() => {
+                    cy.contains(file).should('exist');
+                });
+                cy.get('.cvat-quality-table-search-bar input').clear();
+            });
+
+            cy.get('.cvat-quality-table-search-bar .ant-input-search-button').click();
+            cy.get('.cvat-allocation-frame-row').should('have.length', 3);
+        });
+
+        it('Check management table .csv representation is available for download', () => {
+            cy.get('.cvat-quality-control-management-tab .cvat-quality-table-dowload-button').click();
+
+            const expectedFileName = `allocation-table-task_${taskID}.csv`;
+            cy.verifyDownload(expectedFileName);
+            cy.checkCsvFileContent(expectedFileName, 'frame,name,active', 4, (row, index) => {
+                expect(row).to.include(`images/image_${index + 1}.jpg`);
+                expect(row).to.include('true');
+            });
+        });
     });
 
     describe('Regression tests', () => {

tests/cypress/support/commands.js

@@ -1697,6 +1697,19 @@ Cypress.Commands.add('checkDeletedFrameVisibility', () => {
     cy.closeSettings();
 });
 
+Cypress.Commands.add('checkCsvFileContent', (expectedFileName, header, rowsCount, checkRow = null) => {
+    const downloadsFolder = Cypress.config('downloadsFolder');
+    const filePath = `${downloadsFolder}/${expectedFileName}`;
+    cy.readFile(filePath).then((csv) => {
+        const rows = csv.split('\n');
+        expect(rows.length).to.equal(rowsCount);
+        expect(rows[0]).to.include(header);
+        if (checkRow) {
+            rows.slice(1).forEach(checkRow);
+        }
+    });
+});
+
 Cypress.Commands.overwrite('visit', (orig, url, options) => {
     orig(url, options);
     cy.closeModalUnsupportedPlatform();