diff --git a/cvat-ui/src/components/annotation-page/tag-annotation-workspace/styles.scss b/cvat-ui/src/components/annotation-page/tag-annotation-workspace/styles.scss
index a647412a..992f5e50 100644
--- a/cvat-ui/src/components/annotation-page/tag-annotation-workspace/styles.scss
+++ b/cvat-ui/src/components/annotation-page/tag-annotation-workspace/styles.scss
@@ -33,7 +33,7 @@
}
.cvat-tag-annotation-sidebar-buttons,
-.cvat-tag-anntation-sidebar-checkbox-skip-frame {
+.cvat-tag-annotation-sidebar-checkbox-skip-frame {
padding-bottom: 15px;
}
diff --git a/cvat-ui/src/components/annotation-page/tag-annotation-workspace/tag-annotation-sidebar/tag-annotation-sidebar.tsx b/cvat-ui/src/components/annotation-page/tag-annotation-workspace/tag-annotation-sidebar/tag-annotation-sidebar.tsx
index b10d783e..1a8ab191 100644
--- a/cvat-ui/src/components/annotation-page/tag-annotation-workspace/tag-annotation-sidebar/tag-annotation-sidebar.tsx
+++ b/cvat-ui/src/components/annotation-page/tag-annotation-workspace/tag-annotation-sidebar/tag-annotation-sidebar.tsx
@@ -227,7 +227,7 @@ function TagAnnotationSidebar(props: StateToProps & DispatchToProps): JSX.Elemen
-
+
-
+
Frame tags:
{frameTags.map((tag: any) => (
{
onRemoveState(tag);
diff --git a/tests/cypress/integration/actions_tasks_objects/case_22_tag_annotation_mode.js b/tests/cypress/integration/actions_tasks_objects/case_22_tag_annotation_mode.js
new file mode 100644
index 00000000..3fbbf66d
--- /dev/null
+++ b/tests/cypress/integration/actions_tasks_objects/case_22_tag_annotation_mode.js
@@ -0,0 +1,80 @@
+// Copyright (C) 2020 Intel Corporation
+//
+// SPDX-License-Identifier: MIT
+
+///
+
+import { taskName, labelName } from '../../support/const';
+
+context('Tag annotation mode.', () => {
+ const caseId = '22';
+
+ function checkCountFrameTags(countTags) {
+ if (countTags == 0) {
+ cy.get('span.cvat-tag-annotation-sidebar-frame-tag-label').should('not.exist');
+ } else {
+ cy.get('span.cvat-tag-annotation-sidebar-frame-tag-label').should('have.length', countTags);
+ };
+ };
+
+ function checkPresenceFrameTags(labelName) {
+ cy.get('.cvat-tag-annotation-sidebar-frame-tags').within(() => {
+ cy.get('span.cvat-tag-annotation-sidebar-frame-tag-label').contains(labelName).should('exist');
+ });
+ };
+
+ function addTag() {
+ cy.get('.cvat-tag-annotation-sidebar-buttons').contains('Add tag').click();
+ };
+
+ function skipFrame() {
+ cy.get('.cvat-tag-annotation-sidebar-buttons').contains('Skip frame').click();
+ };
+
+ function changeCheckboxAutomaticallyGoToNextFrame(value) {
+ cy.get('.cvat-tag-annotation-sidebar-checkbox-skip-frame').within(() => {
+ if (value == "check") {
+ cy.get('[type="checkbox"]').check();
+ } else if (value == "uncheck") {
+ cy.get('[type="checkbox"]').uncheck();
+ };
+ });
+ };
+
+ before(() => {
+ cy.openTaskJob(taskName);
+ });
+
+ describe(`Testing case "${caseId}"`, () => {
+ it('Go to tag annotation', () => {
+ cy.changeWorkspace('Tag annotation', labelName);
+ checkCountFrameTags(0);
+ });
+
+ it('Skip frame', () => {
+ skipFrame();
+ cy.checkFrameNum(1);
+ checkCountFrameTags(0);
+ cy.goToPreviousFrame(0);
+ checkCountFrameTags(0);
+ });
+
+ it('Add tag', () => {
+ addTag();
+ checkCountFrameTags(1);
+ checkPresenceFrameTags(labelName);
+ });
+
+ it('Set "Automatically go to the next frame" to true and add tag', () => {
+ cy.goToNextFrame(1);
+ checkCountFrameTags(0);
+ changeCheckboxAutomaticallyGoToNextFrame("check");
+ addTag();
+ cy.checkFrameNum(2);
+ checkCountFrameTags(0);
+ cy.goToPreviousFrame(1);
+ checkCountFrameTags(1);
+ checkPresenceFrameTags(labelName);
+ });
+ });
+});
diff --git a/tests/cypress/support/commands.js b/tests/cypress/support/commands.js
index 43c7e364..aa48a82f 100644
--- a/tests/cypress/support/commands.js
+++ b/tests/cypress/support/commands.js
@@ -497,8 +497,18 @@ Cypress.Commands.add('goCheckFrameNumber', (frameNum) => {
});
});
-Cypress.Commands.add('checkFrameNumber', (frameNum) => {
+Cypress.Commands.add('checkFrameNum', (frameNum) => {
cy.get('.cvat-player-frame-selector').within(() => {
- cy.get('[role="spinbutton"]').should('have.value', frameNum);
+ cy.get('input[role="spinbutton"]').should('have.value', frameNum);
});
});
+
+Cypress.Commands.add('goToNextFrame', (expectedFrameNum) => {
+ cy.get('.cvat-player-next-button').click();
+ cy.checkFrameNum(expectedFrameNum);
+});
+
+Cypress.Commands.add('goToPreviousFrame', (expectedFrameNum) => {
+ cy.get('.cvat-player-previous-button').click();
+ cy.checkFrameNum(expectedFrameNum);
+});