diff --git a/cvat-ui/src/components/annotation-page/top-bar/player-buttons.tsx b/cvat-ui/src/components/annotation-page/top-bar/player-buttons.tsx
index db1bb4a8..c17c940a 100644
--- a/cvat-ui/src/components/annotation-page/top-bar/player-buttons.tsx
+++ b/cvat-ui/src/components/annotation-page/top-bar/player-buttons.tsx
@@ -76,12 +76,16 @@ function PlayerButtons(props: Props): JSX.Element {
let prevButtonTooltipMessage = prevRegularText;
if (prevButtonType === 'filtered') {
prevButton = (
-
+
);
prevButtonTooltipMessage = prevFilteredText;
} else if (prevButtonType === 'empty') {
prevButton = (
-
+
);
prevButtonTooltipMessage = prevEmptyText;
}
@@ -90,11 +94,11 @@ function PlayerButtons(props: Props): JSX.Element {
let nextButtonTooltipMessage = nextRegularText;
if (nextButtonType === 'filtered') {
nextButton = (
-
+
);
nextButtonTooltipMessage = nextFilteredText;
} else if (nextButtonType === 'empty') {
- nextButton = ;
+ nextButton = ;
nextButtonTooltipMessage = nextEmptyText;
}
diff --git a/tests/cypress/integration/actions_tasks_objects/case_13_merge_split_features.js b/tests/cypress/integration/actions_tasks_objects/case_13_merge_split_features.js
index 2588b646..3a1fa29f 100644
--- a/tests/cypress/integration/actions_tasks_objects/case_13_merge_split_features.js
+++ b/tests/cypress/integration/actions_tasks_objects/case_13_merge_split_features.js
@@ -35,15 +35,9 @@ context('Merge/split features', () => {
cy.openTaskJob(taskName);
});
- function goCheckFrameNumber(frameNum) {
- cy.get('.cvat-player-frame-selector').within(() => {
- cy.get('input[role="spinbutton"]').clear().type(`${frameNum}{Enter}`).should('have.value', frameNum);
- });
- }
-
describe(`Testing case "${caseId}"`, () => {
it('Create rectangle shape on first frame', () => {
- goCheckFrameNumber(frameNum);
+ cy.goCheckFrameNumber(frameNum);
cy.createRectangle(createRectangleShape2Points);
cy.get('#cvat_canvas_shape_1')
.should('have.attr', 'x')
@@ -52,7 +46,7 @@ context('Merge/split features', () => {
});
});
it('Create rectangle shape on third frame with another position', () => {
- goCheckFrameNumber(frameNum + 2);
+ cy.goCheckFrameNumber(frameNum + 2);
cy.createRectangle(createRectangleShape2PointsSecond);
cy.get('#cvat_canvas_shape_2')
.should('have.attr', 'x')
@@ -63,7 +57,7 @@ context('Merge/split features', () => {
it('Merge the objects with "Merge button"', () => {
cy.get('.cvat-merge-control').click();
cy.get('#cvat_canvas_shape_2').click();
- goCheckFrameNumber(frameNum);
+ cy.goCheckFrameNumber(frameNum);
cy.get('#cvat_canvas_shape_1').click();
cy.get('.cvat-merge-control').click();
});
@@ -75,7 +69,7 @@ context('Merge/split features', () => {
.within(() => {
cy.get('.cvat-object-item-button-keyframe-enabled').should('exist');
});
- goCheckFrameNumber(frameNum + 2);
+ cy.goCheckFrameNumber(frameNum + 2);
cy.get('#cvat_canvas_shape_3').should('exist').and('be.visible');
cy.get('#cvat-objects-sidebar-state-item-3')
.should('contain', '3')
@@ -85,13 +79,13 @@ context('Merge/split features', () => {
});
});
it('On the second frame and on the fourth frame the track is invisible', () => {
- goCheckFrameNumber(frameNum + 1);
+ cy.goCheckFrameNumber(frameNum + 1);
cy.get('#cvat_canvas_shape_3').should('exist').and('be.hidden');
- goCheckFrameNumber(frameNum + 3);
+ cy.goCheckFrameNumber(frameNum + 3);
cy.get('#cvat_canvas_shape_3').should('exist').and('be.hidden');
});
it('Go to the second frame and remove "outside" flag from the track. The track now visible.', () => {
- goCheckFrameNumber(frameNum + 1);
+ cy.goCheckFrameNumber(frameNum + 1);
cy.get('#cvat-objects-sidebar-state-item-3')
.should('contain', '3')
.and('contain', 'RECTANGLE TRACK')
@@ -120,7 +114,7 @@ context('Merge/split features', () => {
});
});
it('On the fourth frame remove "keyframe" flag from the track. The track now visible and "outside" flag is disabled.', () => {
- goCheckFrameNumber(frameNum + 3);
+ cy.goCheckFrameNumber(frameNum + 3);
cy.get('#cvat-objects-sidebar-state-item-3')
.should('contain', '3')
.and('contain', 'RECTANGLE TRACK')
diff --git a/tests/cypress/integration/actions_tasks_objects/issue_2485_navigation_empty_frames.js b/tests/cypress/integration/actions_tasks_objects/issue_2485_navigation_empty_frames.js
new file mode 100644
index 00000000..c29e0dd4
--- /dev/null
+++ b/tests/cypress/integration/actions_tasks_objects/issue_2485_navigation_empty_frames.js
@@ -0,0 +1,88 @@
+// Copyright (C) 2020 Intel Corporation
+//
+// SPDX-License-Identifier: MIT
+
+///
+
+import { taskName, labelName } from '../../support/const';
+
+context('Navigation to empty frames', () => {
+ const issueId = '2485';
+ const createRectangleShape2Points = {
+ points: 'By 2 Points',
+ type: 'Shape',
+ labelName: labelName,
+ firstX: 250,
+ firstY: 350,
+ secondX: 350,
+ secondY: 450,
+ };
+
+ before(() => {
+ cy.openTaskJob(taskName);
+ });
+
+ describe(`Testing issue "${issueId}"`, () => {
+ it('Go to 2nd frame. Create a shape.', () => {
+ cy.goCheckFrameNumber(2);
+ cy.createRectangle(createRectangleShape2Points);
+ });
+
+ it('Go to 4th frame. Create a shape.', () => {
+ cy.goCheckFrameNumber(4);
+ cy.createRectangle(createRectangleShape2Points);
+ });
+
+ it('Input a filter to see the created objects.', () => {
+ cy.writeFilterValue(false, 'shape=="rectangle"');
+ cy.get('#cvat_canvas_shape_2').should('exist');
+ });
+
+ it('Go to 3rd frame.', () => {
+ cy.goCheckFrameNumber(3);
+ });
+
+ it('Right click to navigation buttons: Previous, Next. Switch their mode to: Go next/previous with a filter.', () => {
+ cy.goCheckFrameNumber(3);
+ for (const i of ['previous', 'next']) {
+ cy.get(`.cvat-player-${i}-button`).rightclick();
+ cy.get(`.cvat-player-${i}-filtered-inlined-button`).click();
+ }
+ });
+
+ it("Press go previous with a filter. CVAT get 2nd frame. Press again. Frame wasn't changed.", () => {
+ for (let i = 1; i <= 2; i++) {
+ cy.get('.cvat-player-previous-button-filtered').click({ force: true });
+ cy.checkFrameNum(2);
+ 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.", () => {
+ for (let i = 1; i <= 2; i++) {
+ cy.get('.cvat-player-next-button-filtered').click({ force: true });
+ cy.checkFrameNum(4);
+ cy.get('#cvat_canvas_shape_2').should('exist');
+ }
+ });
+
+ it('Change navigation buttons mode to "Go next/previous to an empty frame".', () => {
+ for (const i of ['previous', 'next']) {
+ cy.get(`.cvat-player-${i}-button-filtered`).rightclick({ force: true });
+ cy.get(`.cvat-player-${i}-empty-inlined-button`).click({ force: true });
+ }
+ });
+
+ it('Go previous to an empty frame. CVAT get 3rd frame.', () => {
+ cy.get('.cvat-player-previous-button-empty').click({ force: true });
+ cy.checkFrameNum(3);
+ cy.get('.cvat_canvas_shape').should('not.exist');
+ });
+
+ it('Go next to an empty frame. CVAT get 5th frame.', () => {
+ cy.get('.cvat-player-next-button-empty').click({ force: true });
+ cy.checkFrameNum(5);
+ cy.get('.cvat_canvas_shape').should('not.exist');
+ });
+ });
+});
diff --git a/tests/cypress/support/commands.js b/tests/cypress/support/commands.js
index 824be82b..aa48a82f 100644
--- a/tests/cypress/support/commands.js
+++ b/tests/cypress/support/commands.js
@@ -491,6 +491,12 @@ Cypress.Commands.add('writeFilterValue', (clear, filterValue) => {
});
});
+Cypress.Commands.add('goCheckFrameNumber', (frameNum) => {
+ cy.get('.cvat-player-frame-selector').within(() => {
+ cy.get('input[role="spinbutton"]').clear().type(`${frameNum}{Enter}`).should('have.value', frameNum);
+ });
+});
+
Cypress.Commands.add('checkFrameNum', (frameNum) => {
cy.get('.cvat-player-frame-selector').within(() => {
cy.get('input[role="spinbutton"]').should('have.value', frameNum);