diff --git a/cvat-ui/package-lock.json b/cvat-ui/package-lock.json
index 59a75dbd..79762999 100644
--- a/cvat-ui/package-lock.json
+++ b/cvat-ui/package-lock.json
@@ -1,6 +1,6 @@
{
"name": "cvat-ui",
- "version": "1.11.1",
+ "version": "1.11.2",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
diff --git a/cvat-ui/package.json b/cvat-ui/package.json
index 35884c24..79ea5093 100644
--- a/cvat-ui/package.json
+++ b/cvat-ui/package.json
@@ -1,6 +1,6 @@
{
"name": "cvat-ui",
- "version": "1.11.1",
+ "version": "1.11.2",
"description": "CVAT single-page application",
"main": "src/index.tsx",
"scripts": {
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/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..440f8e77
--- /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.checkFrameNumber(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.checkFrameNumber(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.checkFrameNumber(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.checkFrameNumber(5);
+ cy.get('.cvat_canvas_shape').should('not.exist');
+ });
+ });
+});
diff --git a/tests/cypress/support/commands.js b/tests/cypress/support/commands.js
index 9648b333..43c7e364 100644
--- a/tests/cypress/support/commands.js
+++ b/tests/cypress/support/commands.js
@@ -490,3 +490,15 @@ Cypress.Commands.add('writeFilterValue', (clear, filterValue) => {
cy.get('.ant-select-selection__choice__content').should('have.text', 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('checkFrameNumber', (frameNum) => {
+ cy.get('.cvat-player-frame-selector').within(() => {
+ cy.get('[role="spinbutton"]').should('have.value', frameNum);
+ });
+});