Test to confirm correct UI and cache state after frame deletion

tests/cypress/e2e/issues_prs2/issue_8785_update_job_metadata.js

@@ -9,17 +9,6 @@ import { taskName } from '../../support/const';
 context('The UI remains stable even when the metadata request fails.', () => {
     const issueId = '8785';
 
-    function clickDeleteFrame() {
-        cy.get('.cvat-player-delete-frame').click();
-        cy.get('.cvat-modal-delete-frame').within(() => {
-            cy.contains('button', 'Delete').click();
-        });
-    }
-    function clickSave() {
-        cy.get('button').contains('Save').click({ force: true });
-        cy.get('button').contains('Save').trigger('mouseout');
-    }
-
     before(() => {
         cy.checkDeletedFrameVisibility();
         cy.openTaskJob(taskName);
@@ -44,10 +33,10 @@ context('The UI remains stable even when the metadata request fails.', () => {
 
             cy.intercept(routeMatcher, badResponse).as('patchError');
 
-            clickDeleteFrame();
+            cy.clickDeleteFrame();
             cy.get('.cvat-player-restore-frame').should('be.visible');
 
-            clickSave();
+            cy.clickSave();
             cy.wait('@patchError').then((intercept) => {
                 expect(intercept.response.body).to.equal(badResponse.body);
                 expect(intercept.response.statusCode).to.equal(badResponse.statusCode);

tests/cypress/e2e/issues_prs2/issue_8872_delete_frame.js

@@ -0,0 +1,70 @@
+// Copyright (C) 2025 CVAT.ai Corporation
+//
+// SPDX-License-Identifier: MIT
+
+/// <reference types="cypress" />
+
+import { taskName } from '../../support/const';
+
+context('UI and job metadata work correctly when deleting frames', () => {
+    const chunkReloadPeriod = 100; // 100 ms
+    let defaultJobMetadataReloadPreiod;
+
+    describe('Attempt to delete any frame after repeated request to /data/meta/', () => {
+        before(() => {
+            cy.window().then((window) => {
+                defaultJobMetadataReloadPreiod = window.cvat.config.jobMetaDataReloadPeriod;
+                window.cvat.config.jobMetaDataReloadPeriod = chunkReloadPeriod;
+            });
+        });
+
+        it('Elapse job metadata reload period, delete a frame, validate UI state is and request body ', () => {
+            let frameNum = null;
+            function getCurrentFrameNumber() {
+                cy.get('.cvat-player-frame-selector').within(() => cy.get('[role="spinbutton"]')
+                    .should('have.attr', 'aria-valuenow')
+                    .then((valueFrameNow) => { frameNum = Number(valueFrameNow); }));
+            }
+
+            cy.intercept('GET', '/api/jobs/**/data/meta**').as('getMeta');
+            cy.intercept('PATCH', '/api/jobs/**/data/meta**').as('patchMeta');
+
+            cy.openTaskJob(taskName);
+            // Ensure first request is sent after loading the job
+            cy.wait('@getMeta');
+
+            cy.goToNextFrame(1);
+            cy.wait('@getMeta');
+            getCurrentFrameNumber();
+
+            cy.clickDeleteFrame();
+            cy.get('.cvat-player-restore-frame').should('not.exist');
+
+            // Save and intercept request to confirm validate deleted frames
+            cy.clickSave();
+            cy.wait('@patchMeta').then((interceptDeleted) => {
+                const deletedFrames = interceptDeleted.request.body.deleted_frames;
+
+                // Check old frame is unavailable
+                cy.checkFrameNum(frameNum + 1);
+
+                // Check deleted frame are correct
+                expect(deletedFrames).to.include(frameNum);
+            });
+            // Restore state and save
+            // Validate UI and that no frames are marked deleted
+            cy.contains('.cvat-annotation-header-button', 'Undo').click();
+            cy.clickSave();
+            cy.wait('@patchMeta').then((interceptRestored) => {
+                const deletedFrames = interceptRestored.request.body.deleted_frames;
+                cy.wrap(deletedFrames).should('be.empty');
+                cy.checkFrameNum(frameNum);
+            });
+        });
+        after(() => {
+            cy.window().then((window) => {
+                window.cvat.config.jobMetaDataReloadPeriod = defaultJobMetadataReloadPreiod;
+            });
+        });
+    });
+});

tests/cypress/support/commands.js

@@ -399,8 +399,7 @@ Cypress.Commands.add('openTask', (taskName, projectSubsetFieldValue) => {
 
 Cypress.Commands.add('saveJob', (method = 'PATCH', status = 200, as = 'saveJob') => {
     cy.intercept(method, '/api/jobs/**').as(as);
-    cy.get('button').contains('Save').click({ force: true });
-    cy.get('button').contains('Save').trigger('mouseout');
+    cy.clickSave(true);
     cy.wait(`@${as}`).its('response.statusCode').should('equal', status);
 });
 
@@ -1420,10 +1419,7 @@ Cypress.Commands.add('deleteFrame', (action = 'delete') => {
     if (action === 'restore') {
         cy.get('.cvat-player-restore-frame').click();
     } else if (action === 'delete') {
-        cy.get('.cvat-player-delete-frame').click();
-        cy.get('.cvat-modal-delete-frame').within(() => {
-            cy.contains('button', 'Delete').click();
-        });
+        cy.clickDeleteFrame();
     }
     cy.saveJob('PATCH', 200);
     cy.wait('@patchMeta').its('response.statusCode').should('equal', 200);
@@ -1704,3 +1700,15 @@ Cypress.Commands.overwrite('reload', (orig, options) => {
     orig(options);
     cy.closeModalUnsupportedPlatform();
 });
+
+Cypress.Commands.add('clickDeleteFrame', (force = false) => {
+    cy.get('.cvat-player-delete-frame').click();
+    cy.get('.cvat-modal-delete-frame').within(() => {
+        cy.contains('button', 'Delete').click({ force });
+    });
+});
+
+Cypress.Commands.add('clickSave', (force = false) => {
+    cy.get('button').contains('Save').click({ force });
+    cy.get('button').contains('Save').trigger('mouseout');
+});